ActionScript 3 Visualizationのスクロール可能領域
-
03-07-2019 - |
質問
Flash.display.Spriteを拡張し、低レベルのDisplayObject(Sprite'a、Shape's、TextField)の階層を利用するActionScript 3ビジュアライゼーションでいくつかのスクロール可能な領域を作成する最良の方法は何ですか?
メインのSpriteの子として追加された3つのmx.containers.Canvasオブジェクトを使用しようとしましたが、メインのSpriteをCanvasに変換しようとしましたが、いずれの方法でも何も表示できません。 Canvas.addChildとCanvas.rawChildren.addChildの両方を使用してDisplayObjectsを追加しようとしました。
mx。*コンポーネントを使用するために全体を書き直す必要がありますか、それともCanvasオブジェクト内にもっとプリミティブなオブジェクトを表示するトリックがありますか?
スプライトを使用して動作する方法のサンプルコードを次に示します。リンクされたスクロールバーを使用して、_colSprite、_rowSprite、および_mapSpriteをスクロールさせます。それらをCanvasオブジェクトに変換すると、表示オブジェクトが描画される前にコードがサイレントにハングします(正しくリコールした場合、addChild行で)。
以下はコードの抜粋です。これはすべて、スプライトを拡張する単一のactionscriptクラスからのものです。
スクロールする3つの領域を設定する:
this._log("Creating Sprites");
this._colSprite = new Sprite();
this._colSprite.y=0;
this._colSprite.x=this._rowLabelWidth + this._rowLabelRightPadding + this._horizontalPadding;
this._rowSprite = new Sprite();
this._rowSprite.y=this._columnLabelHeight+this._columnLabelBottomPadding + this._verticalPadding;
this._rowSprite.x=this._horizontalPadding;
this._mapSprite = new Sprite();
this._mapSprite.y=this._columnLabelHeight+this._columnLabelBottomPadding+ this._verticalPadding;
this._mapSprite.x=this._rowLabelWidth + this._rowLabelRightPadding+this._horizontalPadding;
this._log("adding kids");
addChild(this._mapSprite);
addChild(this._rowSprite);
addChild(this._colSprite);
描画関数のサンプル:
private function _drawColumLabels(colStartIndex: int): void {
for (var col : int = colStartIndex; col < myData.g.length; col++) {
var colName : String = this.myData.g[col].label;
var bottomLeftPoint : Object = this._getCellXYTopLeft(0, col);
bottomLeftPoint.y = this._columnLabelHeight + this._verticalPadding;
var centerX : int = Math.round(this._cellWidth / 2 + (this._fontHeight / 2) - 1);
var colLabel : TextField = new TextField();
colLabel.defaultTextFormat = this._labelTextFormat;
colLabel.width = this._columnLabelHeight+this._columnLabelBottomPadding;
colLabel.text = colName;
colLabel.embedFonts = true;
var colSprite : Sprite = new Sprite();
colSprite.addChild(colLabel);
colSprite.x = bottomLeftPoint.x;
colSprite.y = bottomLeftPoint.y;
colSprite.rotation = -45;
this._colSprite.addChild(colSprite);
}
}
解決
各Canvasに子を追加した後、Canvas.invalidateSize()を(それぞれに対して)呼び出して、サイズを再計算させる必要があります。
これを行う必要があるかどうかは、コンポーネントライフサイクルのどの段階で子を追加するか、つまり '_drawColumLabels'を呼び出すときによって異なります。
_colSprite(および_rowSprite)に表示される領域よりも多くのラベルがある場合、_colSprite(および_rowSprite)にscollbarを表示したいのでしょうか?この場合、SpriteはスクロールをサポートしていないためCanvasのように、Sprite以外のものを使用する必要があります。
各コンポーネントのx / y / width / height値をデバッグして、それらが期待どおりであることを確認することもできます-レイアウトを行うのに役立つと思うのは、紙にレイアウトを描き、書き始めることです計算が正しいことがわかるようにサイズと座標を調整します。