PROBLEM SUMMARY
I want the UI to change based on user role using states. How might this be done?
SOLUTION SUMMARY
The UI can be made to change based on user role using cascading states. This simply means the application state changes, which changes the state of a child component, which changes the states of further child components.
EXPLANATION
WARNING: The code in this example is somewhat complex, but examine the code and read the comments here, and it should be clear.
Continue reading ‘Flex UI with cascading states based on roles’
The following example shows how you can style the last button in a Flex ButtonBar control
by setting the lastButtonStyleName style.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application name="ButtonBar_lastButtonStyleName_test"
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Style>
.lastButton {
color: red;
cornerRadius: 10;
fontWeight: normal;
themeColor: haloGreen;
}
</mx:Style>
<mx:ButtonBar id="buttonBar"
dataProvider="[Red,Orange,Yellow,Green,Blue]"
lastButtonStyleName="lastButton" />
</mx:Application>
Continue reading 'styling the last button in a buttonbar control in flex'
PROBLEM SUMMARY
You want to use a SWF file with a set of own symbols in order to customize Combobox states.
SOLUTION SUMMARY
Use the upSkin, overSkin, downSkin, and disabledSkin style properties of the ComboBox class to apply custom symbols to any combobox. These attributes can be set directly on a ComboBox instance or as part of a CSS style definition.
EXPLANATION
The first thing to do is create a file in Flash and ComboBoxSkins.swf within it to create 4 symbols of type MovieClip with different states of the ComboBox. These symbols should be named: ComboBox_upSkin, ComboBox_downSkin, ComboBox_overSkin, ComboBox_disabledSkin
If we want to put the CSS inline style do the following:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:ComboBox x="196" y="135"
upSkin="@Embed(source='ComboBoxSkins.swf', symbol='ComboBox_upSkin')"
overSkin="@Embed(source='ComboBoxSkins.swf', symbol='ComboBox_overSkin')"
downSkin="@Embed(source='ComboBoxSkins.swf', symbol='ComboBox_downSkin')"
disabledSkin="@Embed(source='ComboBoxSkins.swf', symbol='ComboBox_disabledSkin')">
<!-- PUT HERE THE OPTIONS OF COMBOBOX -->
</mx:ComboBox>
</mx:Application>
Continue reading 'How to skin a combobox from Flash'