Flex3+ArcGIS+API实现Button控件文字竖向排列

最新推荐文章于 2013-07-22 14:10:39 发布

原创最新推荐文章于 2013-07-22 14:10:39 发布 · 907 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#button #flex #api #import #function #class

本文介绍了一个自定义的Flex Button组件，该组件使按钮上的文本能够竖向排列。通过覆盖默认的Button行为，调整了内部文本字段的布局和样式，使得文字能够在按钮上垂直显示。

以下代码来自网络，主要实现了在Flex3+ArcGIS+API环境下Button控件上显示的文字竖向排列。在Flex中新建类，复制下面的代码，然后在需要使用的地方添加该类的引用，运行后可看到Button上文字竖向排列。

package controls
{
    import flash.filters.GlowFilter;
    import flash.text.TextFieldAutoSize;

    import mx.controls.Button;
    import mx.controls.ButtonLabelPlacement;
    import mx.core.mx_internal;
    import mx.events.FlexEvent;
    /**
     * @类名:    VButton
     * @作者:    Angine
     * @日期:    2010-1-27
     * @版本:    V1.0
     * @描述:
     *      垂直按钮类实现按钮Label文本垂直显示功能
     *      功能实现通过获取到Button内部textField引用，
     *      并对textField中的设置作出更改。
     *      如果你需要调整文字与按钮的位置，需要考虑按钮的 Width,Height,fontSize
     *      及paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" 等样式
     */
    use namespace mx_internal;
    public class VButton extends Button
    {
        private static const glowFilter:GlowFilter = new GlowFilter(0x000000,1,2,2,288,1,false); //黑色滤镜
        public function VButton()
        {
            super();
        }

        override public function initialize():void
        {
            super.initialize();
            buttonMode=true;
            textField.wordWrap=true;
            this.labelPlacement=ButtonLabelPlacement.TOP;
            textField.autoSize=TextFieldAutoSize.CENTER;
            this.setStyle("paddingBottom",0);
            this.setStyle("paddingLeft",0);
            this.setStyle("paddingRight",0);
            this.setStyle("paddingTop",0);
//          textField.filters = [glowFilter];//文字描黑边
        }

        override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
        {
            super.updateDisplayList(unscaledWidth,unscaledHeight);
            textField.y=(height-textField.height)/2;
            textField.x=(width-textField.width)/2;
        }
    }

}