Flash/ActionScript: Zeichnen Sie ein Objekt anzeigen "auf" andere
Wie kann ich richtig zeichnen einer Vektor-Objekt auf eine bestimmte position des anderen in ActionScript, Buchhaltung für die Positionierung, Transparenz, etc?
Meine Idee (wie vorgeschlagen z.B. hier) zu nutzen, um die beginBitmapFill
() und drawRect
() zum zeichnen einer bitmap kopieren (mit BitmapData.draw
()) von einem MovieClip auf der .graphics
Eigentum der anderen MovieClip, doch dies erwies sich als schwieriger, als ich dachte, vor allem aus diesen Gründen:
-
Transparenz nicht beibehalten: wo die Quell-MovieClip transparent ist, wird der Ziel-Grafik wird weiß. Ich habe versucht, mit einerEs scheint, das problem war, dass die Unterlagen für dieBlendMode
, aber es hilft nicht. Es scheint weiße Pixel sind tatsächlich kopiert in das BitmapData. Ich muss etwas fehlen, aber ich weiß nicht, was.BitmapData
Konstruktor ist falsch: Transparenz standardmäßig nicht wahr, aber false. Also, wenn Sie erstellen einnew BitmapData(x, y, true)
Transparenz bleibt erhalten, sonst nicht. -
Positionierung. Wenn die Quell-MovieClip zentriert ist (mit dem Mittelpunkt (0, 0), müssen Sie eine Matrix, um es zu verschieben, wenn das kopieren auf ein BitmapData-oder bitmap enthält nur unten rechts in der Quell-MovieClip. Herauszufinden, wie viel zu bewegen, ist es schwierig, und ich nehme an, es beteiligten immer die Grenzen irgendwie. (Wenn das source-Objekt ist perfekt zentriert innerhalb seiner Leinwand, Sie können einfach kompensiert werden, indem die Hälfte seiner Breite und Höhe, natürlich.)
-
beginBitmapFill
Fliesen. Es scheint, wenn Sie nicht starten Sie diedrawRect
() (0, 0), die bitmap-Füllung nicht starten von (0, 0) innerhalb der bitmap entweder. Dies bedeutet, dass Sie eine Verschiebung der Quell-bitmap wieder, basierend auf, wo Sie wollen zu zeichnen beginnen.
(Dann gibt ' s andere Sachen, wie dass lineStyle(0,0,0), so dass die drawRect() nicht in einen Rahmen zeichnen etc.)
All diese kniffligen Probleme führt mich zu glauben, ich werde über dies der falsche Weg. Gibt es ein einfacher Weg, dies zu tun? Gibt es eine Bibliothek irgendwo, die mir helfen kann? Hat jemand erfolgreich getan? Vielleicht ist meine Zeichnung Leinwand sollte kein Sprite, sondern ein Bitmap? Aber dann weiß ich nicht, wie zu zeichnen, um es mit lineTo
() etc.
Hier ist die situation: ich habe eine Sprite, die ich zum zeichnen benutzen sein .Grafiken, mit lineTo (), etc. Jetzt will ich mit einem MovieClip als Pinsel beim zeichnen (oder legen Sie einfach eine Kopie von einem anderen MovieClip auf der Zeichenfläche), so dass die anderen MovieClip Teil der Grafik auf den ersten ein. Ich kann nicht addChild
() weil dann die Vektor-Grafik würde nicht die Interaktion mit den Grafiken erstellt.
BEARBEITEN: Theo hat eine funktionierende Lösung, die perfekt funktioniert außer für die Tatsache, dass es nicht gilt die rotation und Skalierung angewendet, um die DisplayObject-gezogen wird auf die Grafik-Oberfläche. Dies ist Theo ' s Lösung:
private function drawOntoGraphics(source : IBitmapDrawable, target : Graphics, position : Point = null) : void
{
position = position == null ? new Point() : position;
var bounds : Rectangle = DisplayObject(source).getBounds(DisplayObject(source));
var bitmapData : BitmapData = new BitmapData(bounds.width, bounds.height, true, 0x00000000);
bitmapData.draw(source, new Matrix(1, 0, 0, 1, -bounds.x, -bounds.y), null, null, null, true);
target.beginBitmapFill(bitmapData, new Matrix(1, 0, 0, 1, bounds.x + position.x, bounds.y + position.y));
target.drawRect(bounds.x + position.x, bounds.y + position.y, bounds.width, bounds.height);
}
Unterstützen, rotation und Skalierung, ich nehme an, das Folgendes geändert werden:
- Die
Matrix
verwendet indraw()
kopieren sollten Sie die Skalierung und die rotation aus der QuelleDisplayObject
? - Die
Matrix
verwendet inbeginBitmapFill()
kopieren sollten diese Skalierung und rotation wie auch? Oder vielleicht schaffen würde, die "doppelte" rotation und Skalierung? - Die
drawRect()
Koordinaten geändert werden sollte, um die Größe des skalierten und gedrehtenDisplayObject
? Was bedeutetgetBounds()
wird nicht genau sein?
BEARBEITEN: Hier ist eine funktionierende Implementierung, die unterstützt die Skalierung und rotation, von allen das feedback:
static function DrawOntoGraphics(source:MovieClip, target:Graphics,
position:Point = null):void {
var sourceClass:Class = getDefinitionByName(getQualifiedClassName(source))
as Class;
var sourceCopy:MovieClip = new sourceClass();
sourceCopy.rotation = source.rotation;
sourceCopy.scaleX = source.scaleX;
sourceCopy.scaleY = source.scaleY;
sourceCopy.graphics.clear();
var placeholder:MovieClip = new MovieClip();
placeholder.addChild(sourceCopy);
if (!position)
position = new Point();
var bounds:Rectangle = placeholder.getBounds(placeholder);
var bitmapData:BitmapData = new BitmapData(bounds.width, bounds.height,
true, 0x00000000);
var drawMatrix:Matrix = new Matrix(1, 0, 0, 1, -bounds.x, -bounds.y);
bitmapData.draw(placeholder, drawMatrix);
placeholder.removeChild(sourceCopy);
var fillMatrix:Matrix = new Matrix(1, 0, 0, 1, bounds.x + position.x,
bounds.y + position.y);
target.beginBitmapFill(bitmapData, fillMatrix);
target.lineStyle(0, 0x00000000, 0);
target.drawRect(bounds.x + position.x, bounds.y + position.y,
bounds.width, bounds.height);
target.endFill();
}
Etwas verwandt, aber doch nicht so heiß Frage: Wie man ein Bild (z.B. PNG) auf eine Grafik, die in Flex 3?
Du musst angemeldet sein, um einen Kommentar abzugeben.
Mithilfe der display-Objekte getBounds-Funktion können Sie eine zuverlässige Lösung zu übersetzen, die Koordinaten beim zeichnen :
Zusätzlich auf Eure Kommentare... Unter dem gleichen Methode unter Verwendung eines BitmapData - statt das Graphics-Objekt als canvas:
So wie ich es sehe, haben Sie mehrere Möglichkeiten, dies zu nähern:
Verwenden Sie die graphics-Eigenschaft ein "canvas" - Form
Vorteile: Schön und einfach
Nachteile: Sehr begrenzt, vor allem, wenn Sie benötigen, Dinge zu entfernen, da müssten Sie neu zu zeichnen, die gesamte Leinwand.
Verwenden Sie ein Bitmap und die .draw () - Methode
Vorteile: Auch schön und einfach, und Sie können tun, Vervielfältigung von Dingen leichter.
Nachteile: hat im Grunde die gleichen Probleme wie der Vorherige Ansatz, löschen, alles andere würde auf eine vollständige Neueinteilung. Auch ist es nicht skalierbar sein, da es eine bitmap.
Verwenden Sie ein Sprite-Objekt und hinzufügen primitive, die als Kinder
Vorteile: Sehr flexibel.
Nachteile: Dies ermöglicht Ihnen, zu verschieben, zu skalieren und löschen Sie die Objekte einzeln. Es wird jedoch ein wenig komplizierter als die vorherigen zwei Optionen.
Mit dem letzten Ansatz (was ich empfehlen würde, wenn du gehst nichts mehr zu machen, als etwas sehr kleines mit dieser) dein problem kann gelöst werden durch die Verwendung von Bitmaps, die Sie hinzufügen, um Ihre "Zeichnung", diese Transparenz unterstützen (wie du ihn gefunden hast) und sind ein bisschen einfacher als die Verwendung bitmapFill (das ist ein bisschen schwierig zu bekommen rechts).
Habe ich ein Beispiel von mit einem bitmap-Klon, und zeichnen Sie andere DisplayObjects neu auf meinem blog. Es ist nicht genau das, was Sie wollen, aber der code könnte von nutzen sein, mindestens die matrix Teil für die draw-Methode.
bzlm - Sie konnte immer machen die Start-X-position eine Konstante, und kombinieren drawRect mit einer Matrix übersetzen.