티스토리 뷰

정보 보관 ver1.0

세그먼트 버튼

James Wetzel 2013. 3. 27. 15:40

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>


<!DOCTYPE HTML>

<html manifest="" lang="kr">

<head>

    <meta charset="UTF-8">

    <title>MobileWeather</title>

    

    <script src="../../touch/sencha-touch-all-debug.js" type="text/javascript"></script>

    <link href="../../touch/resources/css/sencha-touch.css" rel="stylesheet" type="text/css" />

   

    <script type="text/javascript">

        

    </script>


    <script type="text/javascript">

        Ext.application({

            name: "MobileWeather",

            launch: function () {

                var segmentedButton1 = Ext.create("Ext.SegmentedButton", {

                    allowMultiple: false,

                    items: [

                        { text: "Button01", ui: "decline", pressed: true },

                        { text: "Button02", ui: "decline" },

                        { text: "Button03", ui: "decline" }

                    ],

                    listeners: {

                        toggle: function (segmentedButton, button, pressed) {

                            Ext.Msg.alert("알림", button.getText() + ":" + (pressed ? "on" : "off"), Ext.emptyFn);

                        }

                    }

                });


                var segmentedButton2 = {

                    xtype: "segmentedbutton",

                    allowMultiple: true,

                    items: [

                        { text: "Button4", ui: "confirm", iconCls: "locate", iconMask: true },

                        { text: "Button5", ui: "confirm", iconCls: "settings", iconMask: true }

                    ],

                    listeners: {

                        toggle: function (segmentedButton, button, pressed) {

                            Ext.Msg.alert("알림", button.getText() + ":" + (pressed ? "on" : "off"), Ext.emptyFn);

                        }

                    }

                };


                var toolbar = {

                    xtype: "toolbar",

                    docked: "top",

                    items: [segmentedButton1]

                };


                var rootPanel = Ext.create("Ext.Panel", {

                    layout: { type: "vbox", align: "middle", pack: "center" },

                    items: [toolbar, segmentedButton2]

                });


                Ext.Viewport.add(rootPanel);

            }

        });

    </script>


</head>

<body>

</body>

</html>


728x90
반응형