メソッド | プロパティ | エフェクト | イベント | スタイル | フレームあり | フレームなし

mx.controls
Button クラス

継承を示す線継承を示す線継承を示す線
直接の既知のサブクラス
           mx.containers.accordionclasses.AccordionHeader, mx.controls.CheckBox, mx.controls.Link, mx.controls.RadioButton

Button クラス
mx.controls.SimpleButton の拡張

Button コントロールはよく使用される長方形のボタンです。Button コントロールは押し下げ可能に見えます。表面には、テキストラベル、アイコンのいずれか、または両方を表示できます。通常、Button コントロールはクリックされたときにアクションを実行します。ただし、トグルボタン形式の Button コントロールはクリックされると押されたままの状態になり、ラジオボタンのように機能します。ユーザーが Button コントロールをクリックすると、click イベントがブロードキャストされます。Button コントロールは、外観をカスタマイズしたり、プッシュボタンからトグルボタンに機能を変更したりできます。

Button コントロールは SimpleButton クラスを拡張します。レイアウトされたラベルとテキストを追加し、スキンを歪めずにサイズを変更する機能を追加します。

メモ : Button コントロールは、UIComponent クラスで定義されている場合も、valueChanged イベントに対して反応しません。MXML では、SimpleButton コントロールから継承されるスキンプロパティを設定できません。

MXML シンタックス

<mx:Button> タグは、親クラスのすべてのプロパティと、次のプロパティを継承します。

 <mx:Button
icon="No default."
label="No default."
labelPlacement="right|left|bottom|top"
repeatInterval="35"
repeatDelay="500"
selected="false|true"
toggle="false|true"
click="Event handler; no default."
/>

を参照するにはここをクリックしてください

メソッド

mx.core.UIComponent クラスから継承されるメソッド
drawFocus   getFocus   getFocusManager   setEnabled   setFocus  

mx.core.UIObject クラスから継承されるメソッド
addEventListener   applyProperties   buildDepthTable   commitProperties   constructObject2   createAccessibilityImplementation   createChildAtDepth   createChildren   createClassChildAtDepth   createClassObject   createEmptyObject   destroyObject   dispatchEvent   doLater   draw   drawRect   executeBindings   fillRect   findNextAvailableDepth   getRepeaterItem   getStyle   handleEvent   init   invalidate   invalidateLayout   invalidateProperties   invalidateSize   invalidateStyle   layoutChildren   measure   move   redraw   removeEventListener   setDepthAbove   setDepthBelow   setMask   setSize   setSizeNoLayout   setStyle   swapDepths  



プロパティ
       icon:String
このボタンに表示されるアイコンのシンボル名です。
       label:String
ボタンに表示されるテキストです。
       labelPlacement:String
指定されたアイコンを基準にしたラベルの向きです。
staticversion:String
このクラスのバージョンを表すストリングです。

mx.controls.SimpleButton クラスから継承されるプロパティ
falseDisabledSkin   falseDownSkin   falseOverSkin   falseUpSkin   selected   toggle   trueDisabledSkin   trueDownSkin   trueOverSkin   trueUpSkin   version  

mx.core.UIComponent クラスから継承されるプロパティ
enabled   errorString   tabEnabled   tabIndex   version  

mx.core.UIObject クラスから継承されるプロパティ
alpha   baselinePosition   className   depth   documentDescriptor   height   heightFlex   id   instanceIndices   isDocument   kStretch   layoutHeight   layoutWidth   maxHeight   maxWidth   minHeight   minWidth   mouseX   mouseY   nestLevel   oldHeight   oldWidth   oldX   oldY   parent   parentApplication   parentDocument   percentHeight   percentWidth   preferredHeight   preferredWidth   repeaterIndices   scaleX   scaleY   styleName   tabEnabled   toolTip   version   visible   width   widthFlex   x   y  



エフェクト

mx.core.UIComponent クラスから継承されるエフェクト
focusInEffect   focusOutEffect  

mx.core.UIObject クラスから継承されるエフェクト
creationCompleteEffect   hideEffect   mouseDownEffect   mouseOutEffect   mouseOverEffect   mouseUpEffect   moveEffect   resizeEffect   showEffect  



イベント
clickユーザーがボタンをクリックしたときにブロードキャストされます。このイベントオブジェクトの target プロパティには、イベントをトリガしたコンポーネントへの参照が含まれます。type プロパティには、イベントの名前 click が含まれます。

mx.controls.SimpleButton クラスから継承されるイベント
buttonDown  buttonDragOut  click 

mx.core.UIComponent クラスから継承されるイベント
focusIn  focusOut  invalid  keyDown  keyUp  valid  valueCommitted 

mx.core.UIObject クラスから継承されるイベント
creationComplete  dragComplete  dragDrop  dragEnter  dragExit  dragOver  draw  effectEnd  effectStart  hide  hideToolTip  initialize  load  mouseChangeSomewhere  mouseDown  mouseDownSomewhere  mouseMove  mouseMoveSomewhere  mouseOut  mouseOver  mouseUp  mouseUpSomewhere  move  resize  show  showToolTip  unload 



スタイル
borderThickness 型 : Number   CSS の継承 : なし
ボタンの境界線のリングの太さです。値が 0 の場合、境界線は描画されません。値が 2 以上の場合、ボタンの周囲に光るリングが作成されます。デフォルト値は 3 です。
cornerRadius 型 : Number   CSS の継承 : なし
ボタンの角に付いている丸みの半径です。デフォルト値は 5 です。
horizontalGap 型 : Number   CSS の継承 : なし
labelPlacement が "left" または "right" のときの、ボタンのラベルとアイコンの間隔です。デフォルト値は 2 です。
textRollOverColor 型 : Number   形式 : Color   CSS の継承 : あり
マウスポインタをボタンに合わせたときのラベルのテキストカラーです。デフォルト値は 0x2B333C です。
textSelectedColor 型 : Number   形式 : Color   CSS の継承 : あり
ラベルを押したときのテキストカラーです。デフォルト値は 0x000000 です。
verticalGap 型 : Number   CSS の継承 : なし
labelPlacement が "top" または "bottom" のときの、ボタンのラベルとアイコンの間隔です。デフォルト値は 2 です。

mx.controls.SimpleButton クラスから継承されるスタイル
repeatDelay   repeatInterval  

mx.core.UIComponent クラスから継承されるスタイル
backgroundAlpha   backgroundColor   backgroundDisabledColor   backgroundImage   backgroundSize   barColor   borderCapColor   borderColor   borderSides   borderStyle   borderThickness   cornerRadius   disabledColor   dropShadow   errorColor   fillColors   highlightColor   modalTransparency   scrollTrackColor   selectedFillColors   shadowCapColor   shadowColor   shadowDirection   shadowDistance   symbolBackgroundColor   symbolBackgroundDisabledColor   symbolBackgroundPressedColor   symbolColor   symbolDisabledColor   themeColor  

mx.core.UIObject クラスから継承されるスタイル
color   fontFamily   fontSize   fontStyle   fontWeight   horizontalGap   leading   marginLeft   marginRight   textAlign   textDecoration   textIndent   verticalGap  



プロパティの詳細

icon

icon:String  

このボタンに表示されるアイコンのシンボル名です。デフォルト値の undefined は、アイコンが表示されないことを意味します。

アイコンは、実行時にサーバーからイメージとしてダウンロードされますが、コンパイル時に SWF ファイルにシンボルとして埋め込む必要があります。SWF ファイルにアイコンを埋め込むには、次の @Embed MXML コンパイラディレクティブを使用します。
icon="@Embed('relativeOrAbsoluteURL')"
URL は、サーバーの JPEG、GIF、PNG、SVG、または SWF イメージの URL を指定できます。MXML コンパイラにより、イメージがシンボルとして埋め込まれ、コンパイラによって生成されたシンボル名によって @Embed ディレクティブが置き換えられます。

ボタンのラベルとアイコンの相対的な配置は、labelPlacement プロパティにより決定します。


label

label:String  

ボタンに表示されるテキストです。デフォルト値は空のストリングです。


labelPlacement

labelPlacement:String  

指定されたアイコンを基準にしたラベルの向きです。指定できる値は、rightleftbottom、および top です。デフォルトは right です。


version

static  version:String  

このクラスのバージョンを表すストリングです。


ButtonExample.mxml
<?xml version="1.0"?>
<!-- Button コントロールの使用方法を示す簡単な例 -->
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" backgroundColor="#FFFFFF"
height="100%" width="100%">

<mx:Script>
<![CDATA[
        
function printMessage(event)
        {
message.text += newline + event.target.label + " pressed";
        }
      
      ]]>
</mx:Script>

<mx:Panel title="Button Panel" height="100%" width="100%">

<!-- このボタンには、"アイコン付きボタン" のように、イメージを含むことができます。 -->
<mx:Button id="iconButton" icon="@Embed('FlexLogo.gif')" label="Button with Icon"
labelPlacement="right" color="#993300" click="printMessage(event)"/>
    
<!-- ボタンのサイズおよびラベル属性はカスタマイズできます。 -->
<mx:Button label="Customized Button" color="#993300" toggle="true" selected="true"
textAlign="left" fontStyle="italic" fontSize="13" width="{iconButton.width}" click="printMessage(event)"/>

<!-- デフォルトでは、カスタマイズしたボタンの外観と操作性は "デフォルトボタン" と似たものになります。  -->
<mx:Button label="Default Button" click="printMessage(event)"/>

<mx:TextArea id="message" text="" editable="false" height="100%" width="100%"
color="#0000FF"/>

</mx:Panel>

</mx:Application>