• Flex调整文本的距离


    距离分为两种:

    水平间距:letterSpacing           在线示例

    垂直间距:leading                    在线示例

    还有一种,调整段落的缩进,与网页类似,使用textIndent属性

    letterSpacing示例代码:

    <?xml version="1.0" encoding="utf-8"?>
    <!-- http://blog.flexexamples.com/2008/04/22/setting-the-letter-spacing-in-the-richtexteditor-control-in-flex/ -->
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="vertical"
    verticalAlign="middle"
    backgroundColor="white" viewSourceURL="srcview/index.html">

    <mx:Style>
    .myTextAreaStyleName {
    fontFamily: Courier;
    letterSpacing: 3; /* pixels */
    }
    </mx:Style>

    <mx:Script>
    <![CDATA[
    import mx.events.SliderEvent;

    private function slider_change(evt:SliderEvent):void {
    var cssStyle:CSSStyleDeclaration = StyleManager.getStyleDeclaration(".myTextAreaStyleName");
    cssStyle.setStyle("letterSpacing", evt.value);
    }
    ]]>
    </mx:Script>

    <mx:String id="str" source="lorem.txt" />

    <mx:ApplicationControlBar dock="true">
    <mx:Form styleName="plain">
    <mx:FormItem label="letterSpacing:">
    <mx:HSlider id="slider"
    minimum="0"
    maximum="20"
    value="3"
    liveDragging="true"
    snapInterval="1"
    tickInterval="1"
    change="slider_change(event);" />
    </mx:FormItem>
    </mx:Form>
    </mx:ApplicationControlBar>

    <mx:RichTextEditor id="richTextEditor"
    text="{str}"
    textAreaStyleName="myTextAreaStyleName"
    width="100%"
    height="100%" />

    </mx:Application>

    leading的示例代码:

    <?xml version="1.0" encoding="utf-8"?>
    <!-- http://blog.flexexamples.com/2008/05/31/setting-the-leading-on-a-text-control-in-flex/ -->
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="vertical"
    verticalAlign="top"
    backgroundColor="white" viewSourceURL="srcview/index.html">

    <mx:Script>
    <![CDATA[
    private function init():void {
    slider.value = txt.getStyle("leading");
    }
    ]]>
    </mx:Script>

    <mx:String id="lorem" source="lorem.txt" />

    <mx:ApplicationControlBar dock="true">
    <mx:Form styleName="plain">
    <mx:FormItem label="leading:" direction="horizontal">
    <mx:HSlider id="slider"
    minimum="0"
    maximum="10"
    snapInterval="1"
    tickInterval="1"
    liveDragging="true" />
    <mx:Label text="{slider.value}" />
    </mx:FormItem>
    <mx:FormItem label="height:">
    <mx:Label text="{txt.height}" />
    </mx:FormItem>
    </mx:Form>
    </mx:ApplicationControlBar>

    <mx:Text id="txt"
    text="{lorem}"
    leading="{slider.value}"
    textAlign="justify"
    width="400"
    preinitialize="init();" />

    </mx:Application>

  • 相关阅读:
    MyEclipse启动时,报错Error:could not open`E:Program FilesJavaJAVAlibamd64jvm.cfg'
    换JDK以后,MyEclipse无法启动,报错:Failed to load the JNI...
    ORA-12514
    java语言
    基本数据类型
    C# 计算时间间隔,两个时间差(年月日时分秒)
    Java的Stream流
    Java的Lambda表达式和函数式接口
    Java中的Log
    Oracle的触发器Trigger
  • 原文地址:https://www.cnblogs.com/meteoric_cry/p/1977266.html
Copyright © 2020-2023  润新知