Flex - disappearing button - apache-flex

I have a strange problem in Flex. I have a ButtonBar with 7 buttons and always the fifth is invisible. Even when I switch places of buttons always the one which is the fifth is the one I cannot see.
Here is my code:
<s:HGroup x="6" y="6" visible="{entityId > 0}">
<mx:ButtonBar height="20" x="10" horizontalGap="4" itemClick="onButtonBarClickHandler(event)" id="buttonBar">
<mx:dataProvider>
<s:ArrayList>
<fx:Object label="xxx" action="AddItem" icon="{_addIcon}" />
<fx:Object label="zzz" action="DeleteItem" icon="{_deleteIcon}" enabled="{_dg.selectedItem as TemplateFile != null}" />
<fx:Object label="yyy" action="Generate" enabled="{_dg.selectedItem.IsTemplate}" />
<fx:Object label="aaa" action="PublishSharePoint" enabled="{_dg.selectedItem.IsTemplate}" />
<fx:Object label="bbb" action="SetDefault"/>
<fx:Object label="Download document" action="DownloadDocument"/>
<fx:Object label="Show Tags" action="ShowTags"/>
</s:ArrayList>
</mx:dataProvider>
</mx:ButtonBar>
</s:HGroup>
Do you have any idea what is wrong here?

Tried to reproduce it, no success - they are all visible.
My guess is that you have some code that causes it to become invisible.

Related

flex buttonbar initially anything selected flex 4

hello i have this buttonbar:
<s:ButtonBar id="channelsBtnBar" requireSelection="true" width="100%" horizontalCenter="0"
skinClass="skins.TvButtonBarSkin"
change="channelsBtnBar_changeHandler(event)">
<s:dataProvider>
<s:ArrayList>
<fx:Object icon="#Embed('assets/ch1.png')"/>
<fx:Object icon="#Embed('assets/ch2.png')"/>
<fx:Object icon="#Embed('assets/ch3.png')"/>
<fx:Object icon="#Embed('assets/ch4.png')"/>
<fx:Object icon="#Embed('assets/ch5.png')"/>
<fx:Object icon="#Embed('assets/ch6.png')"/>
<fx:Object icon="#Embed('assets/ch7.png')"/>
<fx:Object icon="#Embed('assets/ch8.png')"/>
<fx:Object icon="#Embed('assets/ch9.png')"/>
</s:ArrayList>
</s:dataProvider>
</s:ButtonBar>
how can i have in creationcomplete of the parent component any of the items selected? is this possible without setting requireSelection to false and selectedItem to -1?
Swap the property requireSelection to "true" on first click!
Use selectedIndex property of ButtonBar.
if you want to select any item use selectedIndex="2" where as 2 is your selected index of ButtonBar.
If you do not want to select any thing use selectedIndex="-1".
Hope this may help....

Vertical, Scrollable List of Panels

I'm using Adobe Flex Builder 4.5, and I'd like to create a vertical, scrollable list of panels for an AIR application. How do I do that?
A little something like this:
<fx:Declarations>
<s:ArrayCollection id="dp">
<fx:Object title="Panel A" content="content AAAAA" />
<fx:Object title="Panel B" />
<fx:Object title="Panel C" />
<fx:Object title="Panel D" />
</s:ArrayCollection>
</fx:Declarations>
<s:List dataProvider="{dp}" height="100%">
<s:itemRenderer>
<fx:Component>
<s:ItemRenderer>
<s:Panel title="{data.title}">
<s:Label text="{data.content}" />
</s:Panel>
</s:ItemRenderer>
</fx:Component>
</s:itemRenderer>
</s:List>
Doesn't matter whether you're in AIR or just Flex.

binding data from webservice to custom flex component

i'm using flash builder 4..i want to ask something..how to binding data to custom list component in flex??...
i already try binding data from webservice to standard datagrid component in flex, and it's work perfectly...this is my code for binding to datagrid..
<mx:DataGrid includeIn="LobbyPage" x="30" y="319" id="dataGrid" creationComplete="dataGrid_creationCompleteHandler(event)" dataProvider="{TakeUserResult4.lastResult}">
<mx:columns>
<mx:DataGridColumn headerText="Username" dataField="Username"/>
<mx:DataGridColumn headerText="Password" dataField="Password"/>
</mx:columns>
</mx:DataGrid>
now i'm stuck with this..i have custom list like i wrote below..
<s:List skinClass="components.DataList4" x="18" y="611" id="listPlayer">
<s:ArrayCollection>
<fx:Object image1="#Embed('/assets/images/test aj/basil.png')" text1="FLAVOR"
text2="Description of the flavor goes here"/>
<fx:Object image1="#Embed('/assets/images/test aj/basil.png')" text1="FLAVOR"
text2="Description of the flavor goes here"/>
<fx:Object image1="#Embed('/assets/images/test aj/basil.png')" text1="FLAVOR"
text2="Description of the flavor goes here"/>
</s:ArrayCollection>
</s:List>
now..how to bind data to "image1","text1","text2" from webservice??
anyone who want to share an experience to this stuff and give me example?thanks in advance..
by the way..sorry for my bad english :)
Give your list a dataProvider (wrap your array collection in the data provider tag) then specify an itemRenderer so the list knows how to render the data.
<s:List id="listPlayer" width="200" height="500">
<s:dataProvider>
<s:ArrayCollection>
<fx:Object image1="#Embed('/assets/images/test aj/basil.png')" text1="FLAVOR"
text2="Description of the flavor goes here"/>
<fx:Object image1="#Embed('/assets/images/test aj/basil.png')" text1="FLAVOR"
text2="Description of the flavor goes here"/>
<fx:Object image1="#Embed('/assets/images/test aj/basil.png')" text1="FLAVOR"
text2="Description of the flavor goes here"/>
</s:ArrayCollection>
</s:dataProvider>
<s:itemRenderer>
<fx:Component>
<s:ItemRenderer>
<s:HGroup>
<s:Image source="{data.image1}" />
<s:Label text="{data.text1}" fontWeight="bold"/>
<s:Label text="{data.text2}" />
</s:HGroup>
</s:ItemRenderer>
</fx:Component>
</s:itemRenderer>
</s:List>

Click event not working flex

I have a list that as an arraylist as a dataprovider.It has an inline item renderer thet has image control. The click event doesn't work for the image ctrl.The code looks like this
<s:ArrayList id="allActionsArrList">
<fx:Object click="showList('Portlet')" source="#Embed('images/bpc1.jpg')" />
<fx:Object click="showList('Pages')" source="#Embed('images/Tab.png')" />
<fx:Object click="smsClick()" source="#Embed('images/launchpad_tel.png')" />
<fx:Object click="logoutImg_clickHandler(event)" source="#Embed('images/logoutS.swf')" />
</s:ArrayList>
<s:List id="actionStripList" bottom="0" width="100%" borderColor="black"
borderVisible="true" contentBackgroundAlpha="0" dataProvider="{allActionsArrList}"
useVirtualLayout="false">
<s:layout>
<s:TileLayout/>
</s:layout>
<s:itemRenderer>
<fx:Component>
<s:ItemRenderer width="100%" height="40">
<mx:Image buttonMode="true" horizontalCenter="0"
width="40" height="40" source="{data.source}" click="{data.click}"/>
</s:ItemRenderer>
</fx:Component>
</s:itemRenderer>
</s:List>
Any idea.Thanks in advance!
1.You may do something like this:
<fx:Object clickHandler="{showList}" clickParams="{['Portlet']}" source="#Embed('images/bpc1.jpg')" />
<fx:Object clickHandler="{showList}" clickParams="{['Pages']}" source="#Embed('images/Tab.png')" />
<fx:Object clickHandler="{smsClick}" clickParams="{[]}" source="#Embed('images/launchpad_tel.png')" />
<fx:Object clickHandler="{logoutImg_clickHandler}" clickParams="{[]}" source="#Embed('images/logoutS.swf')"/>
<mx:Image buttonMode="true" horizontalCenter="0" width="40" height="40" source="{data.source}" click="data.clickHandler.apply(this, data.clickParams)"/>
Here you possibly should take care of this object (info)
But I'd used the 2nd variant.
2.Another variant is to define some attribute (id for example) for your Object items. Then you can use switch statement in your inline itemRenderer and call different listeners depending on data.id.

How to set tooltip for buttonbar button

I have a buttonbar that has 3 buttons. I'm trying to set a tooltip for each of the buttons, but not sure where. The ButtonBar itself has a skin, which in turn includes a skin for each of the buttons.
<s:ButtonBar id="bb" selectedIndex="0" skinClass="skins.bbSkin">
<s:dataProvider>
<s:ArrayList>
<fx:Object label="item1" />
<fx:Object label="item2" />
<fx:Object label="item3" />
</s:ArrayList>
</s:dataProvider>
</s:ButtonBar>
The skin for the buttonbar is skins.bbSkin
The skin inside it for each button is skins.bbbSkin
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:ButtonBar id="bb" selectedIndex="0" toolTipField="tooltip">
<mx:dataProvider>
<mx:Array>
<mx:Object label="item1" tooltip='hello1'/>
<mx:Object label="item2" tooltip='hello2'/>
<mx:Object label="item3" tooltip='hello3'/>
</mx:Array>
</mx:dataProvider>
</mx:ButtonBar>
</mx:Application>
If you want to display a toolTip with the spark ButtonBar you have to manage with the skinClass.
Have a look here :
https://sensaran.wordpress.com/2010/07/19/setting-tooltip-for-spark-buttonbar

Resources