Flexコンポーネントのリサイズ処理

コンポーネントのリサイズ処理実装の際に参考となるサイトと実装例を挙げておきます。

リサイズ

Flex で何かと使える TitleWindow をマウスで普通のウインドウみたいにリサイズを可能にしてみた。

Flex で TitleWindow を resize 可能にする - Enjoi Blog

dragTop/dragBottom/dragLeft/dragRightでそれぞれフラグを持って処理を行っているのが特徴的。この方法なら斜めリサイズもいけます。
ただ、リサイズ時にマウスカーソルが枠外にいったときのことを考慮して、mouseUpはstageのmouseUpイベントをとった方が良さげですね。


~ Flexメモ 其の五~ UIコンポーネントをリサイズ可能にするマネージャクラス: こはるびより(別館)
UIComponentをリサイズ可能とする機能を、UIComponentを引数としたメソッドで付与しています。
この方法なら、どんなコンポーネントでも対応できますね。

マウスカーソルの変更

幅を変更する処理を作成していて、リサイズするときに
マウスカーソルをこんな感じ「←||→」に変更したいと思い調べました。
...
[Embed(source="Assets.swf", symbol="mx.skins.cursor.HBoxDivider")]
private var _hDivClass:Class;
このクラスを使ってマウスカーソルを変更します。
CursorManager.setCursor(_hDivClass,CursorManagerPriority.HIGH, 0, 0);

マウスカーソルを変える CursorManager | 開発日記 〜Doinet〜

上記を参考に、縦横リサイズ時のカーソル変更を実装しました。
斜めリサイズの場合はどうしよう。rotationプロパティを使う?無理なら独自カーソル作成か。

/** 幅変更時カーソル */
[Embed(source="Assets.swf", symbol="mx.skins.cursor.HBoxDivider")]
private static var _resizeWidthClass:Class;

/** 高さ変更時カーソル */
[Embed(source="Assets.swf", symbol="mx.skins.cursor.VBoxDivider")]
private static var _resizeHeightClass:Class;

/**
 * カーソルを設定する
 */
private function setCursor():void {
    if (resizeTop || resizeBottom) {
        //高さ変更時
        CursorManager.removeCursor(CursorManager.currentCursorID);
        CursorManager.setCursor(_resizeHeightClass, CursorManagerPriority.HIGH, 0, 0);
    } else if (resizeLeft || resizeRight) {
        //幅変更時
        CursorManager.removeCursor(CursorManager.currentCursorID);
        CursorManager.setCursor(_resizeWidthClass, CursorManagerPriority.HIGH, 0, 0);
    } else {
        CursorManager.removeCursor(CursorManager.currentCursorID);
    }
}

注意点

CursorManagerとContextMenuが併用できない

Busyカーソルの親はsystemManagerのようです。
systemManagerのcontextMenuを設定したら表示されました。

http://www.fxug.net/modules/xhnewbb/viewtopic.php?viewmode=thread&topic_id=73&forum=2&post_id=3202

まさにこれにはまりました。MouseOverの際に対象オブジェクトのcontextMenuをsystemManager.contextMenuに設定する方法で回避。