为LinkButton组件添加icon(图标)并设定icon和label的位置

来自:http://blog.flexexamples.com/2008/09/05/positioning-icons-on-a-linkbutton-control-in-flex/

为LinkButton添加图标的方法很简单,因为LinkButton有icon属性,我们只要为icon属性绑定一个图片就可以了。

调整icon和label的相对位置,我们只要设置labelPlacement属性就可以了。

 

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/09/05/positioning-icons-on-a-linkbutton-control-in-flex/ -->
<mx:Application name="LinkButton_labelPlacement_test"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:Script>
        <![CDATA[
            import mx.controls.ButtonLabelPlacement;
        ]]>
    </mx:Script>

    <mx:Array id="arr">
        <mx:String>{ButtonLabelPlacement.LEFT}</mx:String>
        <mx:String>{ButtonLabelPlacement.RIGHT}</mx:String>
        <mx:String>{ButtonLabelPlacement.TOP}</mx:String>
        <mx:String>{ButtonLabelPlacement.BOTTOM}</mx:String>
    </mx:Array>

    <mx:ApplicationControlBar dock="true">
        <mx:Form styleName="plain">
            <mx:FormItem label="labelPlacement:">
                <mx:ComboBox id="comboBox"
                        dataProvider="{arr}"
                        selectedIndex="1" />
            </mx:FormItem>
        </mx:Form>
    </mx:ApplicationControlBar>

    <mx:LinkButton id="linkButton"
            label="LinkButton"
            labelPlacement="{comboBox.selectedItem}"
            icon="@Embed('assets/LinkButton.png')" />

</mx:Application>

 

你可能感兴趣的:(xml,Flex,Blog,Adobe)