mx.validators.Validator的錯誤提示文字的樣式修改

來源:互聯網
上載者:User

       mx.validators.Validator預設的錯誤提示顯示英文文字的確很好看,但顯示中文就效果太差了,小的看不清,而且是加粗的。由於mx.validators.Validator沒有直接提供應用Style的方法屬性,下面的方法就是用StyleManager修改錯誤顯示效果:

test.mxml檔案內容:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml"
 xmlns="*" verticalGap="0">

    <mx:Script>
    <![CDATA[
        import mx.styles.StyleManager;

        function changeNormal() {
            StyleManager.styles.ErrorTip.fontWeight = "nomal";
            StyleManager.styles.ErrorTip.fontFamily = "Arial";
            StyleManager.styles.ErrorTip.fontSize = "9";
            var s1 = StyleManager.styles.ErrorTip.getStyle("fontWeight");
            address.text = s1;
        }

        function changeBold() {
            StyleManager.styles.ErrorTip.fontWeight = "bold";
            StyleManager.styles.ErrorTip.fontFamily = "Helvetica";
            StyleManager.styles.ErrorTip.fontSize = "15";
            var s1 = StyleManager.styles.ErrorTip.getStyle("fontWeight");
            address.text = s1;
        }
    ]]>
    </mx:Script>
    <mx:Model id="order">
        <name>{name.text}</name>
        <address>{address.text}</address>
        <city>{city.text}</city>
        <zip>{zip.text}</zip>
        <email>{email.text}</email>
    </mx:Model>

    <RequiredFieldValidator field="order.name"/>
    <RequiredFieldValidator field="order.city"/>
    <mx:EmailValidator field="order.email"/>

        <mx:Form>
            <mx:FormItem label="Name" required="true">
                <mx:Text text="下面輸入字元: 1  即有錯誤提示"/>
                <mx:TextInput id="name" width="200"/>
            </mx:FormItem>

            <mx:FormItem label="Address">
                <mx:TextInput id="address" width="200"/>
            </mx:FormItem>

            <mx:FormItem label="City" required="true">
                <mx:TextInput id="city" width="200"/>
            </mx:FormItem>

            <mx:FormItem label="Zip" required="true">
                <mx:TextInput id="zip" width="100"/>
            </mx:FormItem>

            <mx:FormItem label="Email" required="true">
                <mx:TextInput id="email" width="200"/>
            </mx:FormItem>

        </mx:Form>
    <mx:HBox>
        <mx:Button label="一般顯示" click="changeNormal()"/>
        <mx:Button label="加大加粗" click="changeBold()"/>
    </mx:HBox>

</mx:Application>

RequiredFieldValidator.as檔案內容:

class RequiredFieldValidator extends mx.validators.Validator {

    function doValidation(value) : Void {
        if (value == "1" || value == null ) {
            validationError("required", "請輸入名字", "123");
        }
        if (value == "2" ) {
            validationError("required", "error");
        }

    }

}

 

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.