Ⓔeui.ToggleSwitch 用法

iphone開關鈕

MainUISkin.exml

<?xml version="1.0" encoding="utf-8"?>
<e:Skin class="edwin.MainUISkin" xmlns:e="http://ns.egret.com/eui">
    <e:Rect fillColor="0x000000" width="100%" height="100%" />
    <e:Group horizontalCenter="0" verticalCenter="0">
        <e:ToggleSwitch id="mySwitch">
            <e:Skin states="up,down,disabled,upAndSelected,downAndSelected,disabledAndSelected">
                <e:Group>
                    <e:Rect fillColor="0x333333" width="100" height="50" ellipseWidth="50" ellipseHeight="50"
                            horizontalCenter="0" verticalCenter="0" includeIn="up,down" />
                    <e:Rect fillColor="0x00FF00" width="100" height="50" ellipseWidth="50" ellipseHeight="50"
                            horizontalCenter="0" verticalCenter="0" includeIn="upAndSelected,downAndSelected" />
                    <e:Rect fillColor="0xFFFFFF" width="45" height="45" ellipseWidth="45" ellipseHeight="45"
                            includeIn="up,down" left="3"  verticalCenter="0" />
                    <e:Rect fillColor="0xFFFFFF" width="45" height="45" ellipseWidth="45" ellipseHeight="45"
                            includeIn="upAndSelected,downAndSelected" right="3"  verticalCenter="0"/>
                </e:Group>
            </e:Skin>
        </e:ToggleSwitch>
    </e:Group>
</e:Skin>

MainUI.ts

namespace edwin {

    export class MainUI extends eui.Component {

        private mySwitch: eui.ToggleSwitch;

        protected createChildren(): void {
            super.createChildren();
            this.percentWidth = this.percentHeight = 100;

            this.mySwitch.addEventListener(eui.UIEvent.CHANGE, () => console.log(this.mySwitch.selected), this);
        }

    }

}