Flex の Button にマウスオーバーした時のマウスカーソルを変える

Flex で Button コントロールを使用していると、ボタン上にマウスカーソルを持って行っても変化がないことに気づいた。
クリックできる部分では指カーソル(pointer,handCursor)になって欲しいので方法をメモ。

目的

Flex の Button コントロール上にマウスカーソルを重ねた時に、マウスカーソルを指カーソルにする。

細かいことかもしれないけど、普段HTMLでアプリケーションを作成する場合、ボタンに

button { cursor: pointer; }

というスタイルをあてることが多いので、Flexで作ったSWFを組み込んだ際に、そこだけ指カーソルにならないのは気持ち悪い。

試行錯誤：useHandCursor プロパティを使ってみる

Button クラスは Sprite クラスを継承しているので useHandCursor プロパティが存在する。このプロパティはリファレンスによると

buttonMode プロパティが true に設定されたスプライト上にマウスが移動したときに、指差しハンドポインタ (ハンドカーソル) を表示するかどうかを示すブール値です。

となっている。素直にそれを信じて属性で明示的にしてみる。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:Button label="Button" useHandCursor="true" />
</mx:Application>

結果は矢印カーソルのまま。Adobe に騙された……。

結論：buttonMode プロパティを使う

Button コントロールなのに、buttonMode プロパティが false だなんてそんな訳が……ありました。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:Button label="Button" buttonMode="true" />
</mx:Application>

こうやってみると指カーソルになった！！思い込みって怖いなぁ。

余談

ちなみに、buttonMode プロパティの説明を読んでみると……

このスプライトのボタンモードを指定します。true の場合、このスプライトはボタンとして動作します。この場合、このスプライトは、マウスがこのスプライト上を通るとハンドカーソルの表示をトリガし、このスプライトにフォーカスがあるときに Enter キーまたは Space キーが押されると click イベントを受け取ることができます。useHandCursor プロパティを false に設定することにより、ハンドカーソルの表示を抑制することができます。この場合はポインタが表示されます。

つまり、useHandCursor プロパティは buttonMode プロパティが true の場合に、指カーソルにしないためのプロパティってことになる。useHandCursor プロパティの方にも buttonMode プロパティについて書いておいてくれないとわかりにくすぎるだろ……。