2010. 8. 6. 18:01 flex
[08-D3] 기본 콤포넌트(ListBox, ComboBox, Panel, Form, ControlBar.....)
[08-D3] 기본 콤포넌트(ListBox, ComboBox, Panel, Form, ControlBar.....)
[01] 기본 콤포넌트(ListBox, ComboBox, Panel, Form, ControlBar)
1. ListBox
>>>>> control/src/listBox.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
public function onChange():void{
var msg:String;
msg = "selectedIndex - " + String(lstFruits.selectedIndex) + "\n";
msg = msg + "selectedItem.code - " + String(lstFruits.selectedItem.code) + "\n";
msg = msg + "selectedItem.label - " + String(lstFruits.selectedItem.label) + "\n";
Alert.show(msg);
}
]]>
</mx:Script>
<mx:Array id="Fruits">
<mx:Object label="사과" code="55"/>
<mx:Object label="배" code="66"/>
<mx:Object label="복숭아" code="77"/>
<mx:Object label="감" code="88"/>
<mx:Object label="자두" code="99"/>
</mx:Array>
<mx:List x="100" y="100" width="200" height="100" id="lstFruits"
dataProvider="{Fruits}" fontSize="12"
change="onChange();">
</mx:List>
</mx:Application>
2. ComboBox
>>>>> control/src/comboBox.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
public function onChange():void{
var msg:String;
msg = "selectedIndex - " + String(cmbFruits.selectedIndex) + "\n";
msg = msg + "selectedItem.code - " + String(cmbFruits.selectedItem.code) + "\n";
msg = msg + "selectedItem.label - " + String(cmbFruits.selectedItem.label) + "\n";
Alert.show(msg);
}
]]>
</mx:Script>
<mx:Array id="Fruits">
<mx:Object label="사과" code="55"/>
<mx:Object label="배" code="66"/>
<mx:Object label="복숭아" code="77"/>
<mx:Object label="감" code="88"/>
<mx:Object label="자두" code="99"/>
</mx:Array>
<mx:ComboBox x="129" y="110" id="cmbFruits"
dataProvider="{Fruits}"
change="onChange();" fontSize="12">
</mx:ComboBox>
</mx:Application>
3. ControlBar의 이용
>>>>> control/src/formTest.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
]]>
</mx:Script>
<mx:Panel x="10" y="10" width="471" height="365" layout="absolute" title="제안하기" fontSize="12">
<mx:Form x="10" y="10" width="431" height="267">
<mx:FormItem label="제안 등록: ">
<mx:Label text="좋은 제안이 있으면 등록해 주세요." width="240"/>
</mx:FormItem>
<mx:FormItem label="500자 내외 등록 가능" width="382" height="204">
<mx:TextArea width="238" height="200"/>
</mx:FormItem>
</mx:Form>
<mx:ControlBar horizontalAlign="center">
<mx:Button label="등록" click="Alert.show('등록 작업 실행');"/>
<mx:Button label="취소" click="Alert.show('등록 취소');"/>
<mx:Button label="목록" click="Alert.show('목록으로 이동');"/>
</mx:ControlBar>
</mx:Panel>
</mx:Application>
[02] 기본 콤포넌트(HSlider, VSlider, NumericStepper)
1. Slider(Hslider, VSlider)
>>>>> control/src/slider.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" height="360">
<mx:Script>
<![CDATA[
public function resizeButton():void{
// Image 크기 조절
img.width = sliderV.value;
imgSize.text = "이미지 크기: " + img.width + " * " + img.height;
}
public function handlePrice():void{
// 가격 출력
endPrice.text = String(SliderH.value);
}
]]>
</mx:Script>
<mx:VSlider x="22" y="10" minimum="1" maximum="400"
snapInterval="1" id="sliderV" value="150"
change="resizeButton();" height="233" labels=""/>
<mx:Image x="64" y="22" width="150" id="img"
source="./images/r12.jpg"/>
<mx:HSlider x="22" y="285" minimum="0" maximum="500000"
snapInterval="1000" id="SliderH" value="50"
change="handlePrice();" width="474"/>
<mx:Label x="38.5" y="311" text="시작 값:" fontSize="20" color="#FFFFFF" fontWeight="bold"/>
<mx:Label x="127.5" y="311" text="1000" fontSize="20" color="#FFFFFF" fontWeight="bold" width="73" id="startPrice"/>
<mx:Label x="217.5" y="311" text="최대 값:" fontSize="20" color="#FFFFFF" fontWeight="bold"/>
<mx:Label x="302.5" y="311" text="1000" fontSize="20" color="#FFFFFF" fontWeight="bold" width="151" id="endPrice"/>
<mx:Label x="22" y="259" text="0" color="#FFFFFF" fontWeight="bold" fontSize="12"/>
<mx:Label x="431" y="259" text="500,000" color="#FFFFFF" fontWeight="bold" fontSize="12" width="71"/>
<mx:Label x="217.5" y="259" text="250,000" color="#FFFFFF" fontWeight="bold" fontSize="12" width="71"/>
<mx:Label x="64" y="225" text="이미지 크기: " color="#FFFFFF" fontSize="12" id="imgSize"/>
</mx:Application>
2. ProgressBar
>>>>> control/src/progressBar.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
public function setProgress():void{
var i:int;
i = int(txtValue.text);
i = i + 10;
if( i > 100 ) i = 0;
prgClick.setProgress(i, 100);
txtValue.text = String(i);
}
]]>
</mx:Script>
<mx:Button x="156" y="173" label="Click" fontSize="12" id="btnClick"
click="setProgress();"/>
<mx:ProgressBar x="104" y="132" width="172" id="prgClick" mode="manual"/>
<mx:Text x="128" y="106" text="0" width="114" id="txtValue"/>
</mx:Application>
3. NumericStepper
>>>>> control/src/stepper.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
public function OnChange():void{
lblChoose.text = String(nsFigure.value);
}
</mx:Script>
<mx:NumericStepper x="46" y="22" minimum="0" maximum="10" stepSize="2" id="nsFigure" fontSize="12" width="77" change="OnChange();"/>
<mx:Label x="46" y="52" text="선택해주세요" id="lblChoose" fontSize="12"/>
</mx:Application>
'flex' 카테고리의 다른 글
[10-D3][notice] DB, ActionScript Class, getter, setter function (0) | 2010.08.06 |
---|---|
[09-D3] Container & Component 배치 (0) | 2010.08.06 |
[07-D2] 기본 콤포넌트(Radio Button, CheckBox, Image, LinkButton, DateField) (0) | 2010.08.06 |
[06-D2] Class, MXML, Array 실습 (0) | 2010.08.06 |
[05-D2] static, interface, extends (0) | 2010.08.06 |