2

Flex で、 http: //www.freeimagehosting.net/uploads/f14d58b49e.jpg にアップロードされた画像に似た 3 つのボタンをデザインしようとしてい ます。

画像のマウスオーバー/クリックは、ボタンの赤色の領域でのみ機能する必要があります。Flex でマウス クリックまたは不規則なボタン形状を管理するにはどうすればよいですか?

Thnx ... アトゥール

4

3 に答える 3

1

これをチェックしてください：flexlib > ImageMap。

stackOverflowから取得

于 2010-03-01T20:33:00.620 に答える
0
  1. Canvas から継承して ArrowButtonsHolder クラスを作成する

  2. Canvas から継承した 3 つの子クラスを作成します。たとえば、LeftArrowButton、MiddleArrowButton、RightArrowButton など

    public class LeftArrowButton:Canvas { protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth, unscaledHeight);

        // draw your arrow here
    // use graphics to do it 
    graphics.beginFill(0xFF0000);
    graphics.lineStyle(1, 0x000000);
    graphics.moveTo(0, 0);
    graphics.lineTo(30, 0);
    graphics.lineTo(50, 25);
    graphics.lineTo(30, 50);
    graphics.lineTo(0, 50);
    graphics.lineTo(0, 0);
    graphics.endFill();
}

    }

    また、一般的なクラス ArrowButton を作成し、そのクラスから別の 3 つを継承して描画機能をオーバーライドすることもできます

  3. createChildren():void メソッドをオーバーライドして、この 3 つの子ボタン オブジェクトを ArrowButtonsHolder に追加します。

    public class ArrowButtonsHolder:Canvas {

// ...

private var leftArrowButton:LeftArrowButton;
private var middleArrowButton:MiddleArrowButton;
private var rightArrowButton:RightArrowButton;

// ...

protected override function createChildren():void {
    super();

    // create buttons
    leftArrowButton = new LeftArrowButton();
    middleArrowButton = new LeftArrowButton();
    rightArrowButton = new LeftArrowButton();

    // add them to canvas
    addChild(leftArrowButton);
    addChild(middleArrowButton);
    addChild(rightArrowButton);

    // position these button by adjusting x, y
    leftArrowButton.x = 0; 
    middleArrowButton.x = 50; 
    rightArrowButton.x = 100; 

    // assign event listeners
    leftArrowButton.addEventListener(MouseEvent.CLICK, onLeftArrowButtonClick);
    middleArrowButton.addEventListener(MouseEvent.CLICK, onMiddleArrowButtonClick);
    rightArrowButton.addEventListener(MouseEvent.CLICK, onRightArrowButtonClick);
}

private onLeftArrowButtonClick(event:MouseEvent):void
{
    trace("Left button clicked");
}

// .. etc for another 2 methods implemented here

    }

PS: 私のコードにはたくさんの構文ミスがあるかもしれませんが、それを行う方法の一般的なアイデアを得る必要があります

于 2010-03-02T06:37:02.820 に答える
0

ベクトル グラフィック (Illustrator で作成したものなど) に基づくボタン スキンを使用し、各状態を名前付きシンボルとしてドキュメントに保存してから、SWF としてエクスポートします。次のようにスキンを参照します。

.stepButton {
        upSkin: Embed(source="myfile.swf", symbol="StepButton"); 
        downSkin: Embed(source="myfile.swf", symbol="StepButtonDown");
        overSkin: Embed(source="myfile.swf", symbol="StepButtonOver");
        disabledSkin: Embed(source="myfile.swf", symbol="StepButtonDisabled");
}

Flash は、可視部分からヒット領域を自動的に決定します。この例 (「myfile.swf」とは呼ばれません) は、現在、アプリケーションで機能しています。

于 2010-03-01T20:38:16.783 に答える