세그먼트 버튼
<%@ 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>