numericstepper(sparkコンポーネント)をカスタマイズ

この度teppe-studioさんに参加させて頂く事になりました。
abukuと申します。
flex4関連の記事を中心に投稿させて頂こうと思っております。


Flex4のnumericstepper(sparkコンポーネント)をカスタマイズして
index表示部分の編集不可のサンプルを作成してみました。


参照:Creating a non-editable Spark NumericStepper control in Flex 4 | Flex Examples

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/06/12/creating-a-non-editable-spark-numericstepper-control-in-flex-4/ -->
<s:Application name="Spark_NumericStepper_textInput_editable_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/halo">

    <fx:Script>
        <![CDATA[
            private function init():void {
                numericStepper.textInput.editable = false;
            }
        ]]>
    </fx:Script>

    <s:NumericStepper id="numericStepper"
            minimum="0"
            maximum="100"
            horizontalCenter="0"
            verticalCenter="0"
            initialize="init();" />

</s:Application>


そもそもnumericStepperにeditableみたいなプロパティが無い訳ですが
(enabledはあるのですが・・・)
numericStepperがtextInput持っててくれてるので
textInputのeditableに対して制御する事が可能となるので便利ですね。


とは言え、どこまで何をやってくれるか理解する為にも
sparkコンポーネントの解析が必要になってきますね。