Allmas

  • Increase font size
  • Default font size
  • Decrease font size

Preserve undo actions in a RichEditableText

E-mail Print PDF

The Spark RichEditableText component supports undo/redo operations. By default, these operations are limited to one session, which means they are cleared when the component loses focus. Sometimes we want to preserve these operations so that they are available after the component loses and gets focus back. Internally, the component checks the property clearUndoOnFocusOut to decide whether the undo operations should be cleared or not when it loses focus. This property is defined in the mx_internal namespace and set to true by default. To preserve the undo operations, just set its value to false, so if for example the component instance to configure is called ret, the following code will do the trick:

import mx.core.mx_internal;

ret.mx_internal::clearUndoOnFocusOut = false;
 

ALLMAS Recherche des Développeurs Flex Freelance en Tunisie

E-mail Print PDF

Nous sommes à la recherche de développeurs Flex 4/AIR/ActionScript 3 en Tunisie qui travaillent en Freelance. Le but est de créer un réseau de compétences dans ce domaine pour nous aider sur nos projets. La demande est de plus en plus importante et avec un réseau solide nous pourrons nous permettre de décrocher un plus grand nombre de projets et en faire profiter tous les membres du réseau.

Les compétences recherchées sont :

  • Adobe Flex 4
  • Adobe AIR
  • ActionScript 3
  • Adobe Flash Builder 4
  • Parsley ou Swiz est un +
  • PHP 5 est un +
  • Zend Framework est un +
Si vous êtes intéressés, veuillez nous contacter à travers notre page de contact.
 

Custom Components in Flex 4

E-mail Print PDF
Interesting presentation about Custom Components in Flex 4 that nicely explains the Flex component lifecycle.
 

Adobe Developer Week

E-mail Print PDF

Adobe is organizing a set of e-seminars next week about Flex 4, Flash Builder 4 and Flash Catalyst. The sessions will be presented by members of the Adobe evangelism team and include topics about the new features of Flex 4 and Flash Builder 4, connecting with different backend technologies like PHP, ColdFusion ans Java, designer-developer workflow, building mobile applications and much more. Check the whole list of sessions and subscribe on the Adobe Developer Week page.

Adobe Developer Week 2010 logo

 

Customizing the Accordion component

E-mail Print PDF

I have lately contributed an example to a discussion on the "Adobe Flex Developers" LinkedIn Group. As the example seemed to have success among the participants, I'm publishing it here so that more people can benefit from it (I hope).

The example shows how to customze the look of the Accordion component, especially the accordion headers. The starting point was an image posted by the user who started the discussion to show the desired design. From this image, we can deduce the following characteristics:

  1. Special headers that are different for the open and closed states of the tabs
  2. A gap between the children of the accordion
  3. No background
  4. No border
  5. Header and corresponding child have the same width

To create our own skin for the headers, we can use the headerRenderer property of the component. This must be set to a factory that creates the desired object for the header. According to the documentation, the created object must be a subclass of Button and implement the mx.core.IDataRenderer interface. The Button control already implements this interface and our case is simple enough to simply use a Button and skin it according to our needs. So all that remains to do is to create the skins in Flash and skin our Button taking care of skinning for both selected (open) and not selected (closed) states. The simplest way to assign this button to the headerRenderer property is inline using the Component MXML tag:

  1. <mx:Accordion
  2.    width="200" height="400"
  3.    verticalGap="5"
  4.    backgroundAlpha="0"
  5.    borderStyle="none"
  6.    paddingLeft="0" paddingRight="0"
  7.    creationPolicy="all"
  8. >
  9.     <mx:headerRenderer>
  10.         <mx:Component>
  11.             <mx:Button
  12.                height="24"
  13.                textAlign="left"
  14.                upSkin="@Embed(source='../assets/accordion.swf', symbol='AccordionHeaderClosed')"
  15.                overSkin="@Embed(source='../assets/accordion.swf', symbol='AccordionHeaderClosed')"
  16.                downSkin="@Embed(source='../assets/accordion.swf', symbol='AccordionHeaderClosed')"
  17.                selectedUpSkin="@Embed(source='../assets/accordion.swf', symbol='AccordionHeaderOpen')"
  18.                selectedOverSkin="@Embed(source='../assets/accordion.swf', symbol='AccordionHeaderOpen')"
  19.                selectedDownSkin="@Embed(source='../assets/accordion.swf', symbol='AccordionHeaderOpen')"
  20.            />
  21.         </mx:Component>
  22.     </mx:headerRenderer>
  23. </mx:Accordion>
  24.  

For the other properties, it's just a matter of setting some styles of the component. More specifically, we can set the gap with verticalGap, remove the background by setting backgroundAlpha="0", remove the border by setting borderStyle="none" and make the headers and children the same width by removing the paddings with paddingLeft="0" and paddingRight="0".

Check the final working example along with all the source and assets available through source view (right-click / "View Source").

Enjoy!

 
  • «
  •  Start 
  •  Prev 
  •  1 
  •  2 
  •  3 
  •  4 
  •  Next 
  •  End 
  • »


Page 1 of 4
View Haykel Ben Jemia's profile on LinkedIn

Login


Shared Items