Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „Flash Zeichenprogramm :)“

Reb00t

Aktives Mitglied

Hey Leute :)

Hier mal mein kleines Zeichenprogramm, erstellt mit Flash!

Das "Füllwerkzeug" ist noch nicht gecodet aber ich aktualisier
das noch.

Edit2: UPDATE, siehe Post #7!

lg, Reb00t!

Edit sagt:

Würde mich natürlich über Kommentare/Verbesserungsvorschläge freuen :)

Wer den Code will, einfach PM an mich!
 
Zuletzt bearbeitet:

chris_90

Immer gut drauf.

AW: Flash Zeichenprogramm :)

Hi Reboot,

cool, aber ich kann mit dem Radierer Teile der Werkzeugleiste wegradieren ;)

LG
Chris
 

Reb00t

Aktives Mitglied

AW: Flash Zeichenprogramm :)

Das liegt daran, dass der Radierer die Dinge nicht "wegradiert" sondern
mit weiß übermalt :D und Die Werkzeugleiste liegt in einer Ebene unter
dem "zeichenfeld".

Da muss ich nochmal ran ;)
 

sokie

Mod | Web

AW: Flash Zeichenprogramm :)

das ist mal ein guter Anfang!
was mir gut gefällt ist, dass man sogar das alpha einstellen kann.
Du musst auf jeden Fall noch verhindern, dass man mit grossen Werkzeugeinstellungen die Bedienelemente übermalen/wegradieren kann (depth). Deine Farbpalette muss noch ein wenig erweitert werden (vielleicht ein colorpicker?)
ah, und der "set" button sollte auf Tastenevent reagieren.
 
Zuletzt bearbeitet:
V

villharmonic

Guest

AW: Flash Zeichenprogramm :)

Hi,

echt eine coole Sache.
Habe gerade festgestellt, dass man unterschiedlich weit in die Werkzeugleiste reinmalen kann, je nachdem wie schnell man malt (Anlauf nimmt ;))
20100426-eprxpwp4rkhbn327531jd6esef.preview.jpg
[/url]
Click for full size - Uploaded with plasq's Skitch[/IMG]

Vielleicht hilft das weiter?

Clemens
 

Reb00t

Aktives Mitglied

AW: Flash Zeichenprogramm :)

Das ist leicht zu erklären:

Mit einer onEnterFrame Funktion wird geprüft wie groß die xKoordinate der Maus ist. Ist sie kleiner als 40, wird die onEnterFrame Funktion des "Zeichnen"-Codes abgebrochen.
Wenn man jetzt schneller zeichnet, als die Frames abgespielt werden,
kann man auf die Leiste draufmalen.

Wie gesagt, dass ist alles ne Einstellungssache der Ebenen. Ich muss
die Depths noch richtig einteilen, dass man praktisch "unterhalb" der
Menüleiste und des Textfeldes (welches sagt, welches Werkzeug man
grade benutzt) malt.

lg, Reb00t
 

Reb00t

Aktives Mitglied

AW: Flash Zeichenprogramm :)

UPDATE

Jetzt mit ColorPicker, Textfeld zur Anzeige des Farbcodes
und korrektur der Ebeneneinstellung (kein übermalen mehr der
Menüleiste!) + nützliche Resetfunktion (Am linken unteren Rand)!

Have Fun!

Be inspired!

lg, Reb00t

Edit 1:
Bin jetzt dabei einen "Ebenenmanager" zu coden, damit man auf unterschiedlichen Ebenen malen kann.
Ist leichter als gedacht. Denke mal dass ich morgen gegen Mittag fertig bin.
 
Zuletzt bearbeitet:
A

ad86

Guest

AW: Flash Zeichenprogramm :)

HI,

nicht schlecht.

Aber mal eine Frage,
1. Wie hast Du das mit dem Colorpicker hinbekommen.
2. Wie lange hast Du gebraucht es zu programmieren (inklusive der Recherche, welche Methoden, was benutzen)?

MFG ad86
 

Reb00t

Aktives Mitglied

AW: Flash Zeichenprogramm :)

Habe gestern und heute so insgesamt ca. 8h gecodet...

Das Programm besteht hauptächlich aus den Zeichnenmethoden
(sprich: creatEmptyMovieclip, lineTo, moveTo, lineStyle etc.),
for-Schleife, if-Abfragen etc.

Der ColorPicker ist mit diesen Bitmap Befehlen gecodeded.

Hier hasste sneakpeak ;)

PHP:
        srcMC = _root.farbauswahl.colors;
        var colorBitmap:BitmapData = new BitmapData(srcMC._width, srcMC._height, true, 0x00000000);
        colorBitmap.draw(srcMC);
        colorValue = "0x"+colorBitmap.getPixel(srcMC._xmouse, srcMC._ymouse).toString(16);
        _root.newColor = colorValue;
        _root.samplecolor.setRGB(colorValue);

lg, Reb00t
 
A

ad86

Guest

AW: Flash Zeichenprogramm :)

Hi,

Danke Reb00t für die Informationen und Danke für die Idee eines Flash-zeichenprogramms. So hab ich abends immer etwas an dem ich arbeiten und entspannen kann.
Wobei ich den Sneakpeak gar nicht brauche, da ich erstens kaum AS2 kann, und zweitens mein kleines Programm in AS3 schreibe.
Wie wäre es noch mit weiteren Werkzeugen (Linie, Rechteck, Ellipse)?

Ach ja, was mich bei Deinem Programm etwas stört, ist dass der Mauszeiger beim Zeichnen verschwindet. Ich weiß, Du siehst ja anhand der Linie, die Du zeichnest, wo er sein müsste. Schön wäre es (für mich, andere Meinungen darf es geben), wenn man trotzdem einen Mauspfeil sieht, wobei er nicht der Standardpfeil sein sollte. In meinem Beispiel habe ich ein Kreuzmauspfeil benutzt, wenn man zeichnet.

MFG ad86
 

Reb00t

Aktives Mitglied

AW: Flash Zeichenprogramm :)

Aha! Ja ich hatte das schonmal reingecoded und der Mauszeiger wurde NICHT angezeigt. Habe die Höhe und die Breite mit den Daten aus meiner Variable, die die Stiftbreite festlegt, festgesetzt.

Es würde mich freuen, wenn du dich in diesem Artikel auch mit deinem Projekt einbringen würdest.

BtW.: Habe bereits einen Ebenenmanager mit dem man auf mehreren Ebenen zeichnen kann ;) Derweil sind's 3 aber ich mach das vllt. noch
dynamisch. Ist auf jedenfall nicht so viel aufwand wie ich gedacht hatte.

lg, Reb00t (der sehr erfreut ist das sein Projekt bei dir auf soviel Resonanz gestoßen ist :) )

p.S. Wie hast du den Radierer gecoded? Mit weiß übermalen ist auf mehreren Ebenen besch............eiden...
 
A

ad86

Guest

AW: Flash Zeichenprogramm :)

Hi,

Also einen Radierer hab ich bisher nicht gemacht, dafür hatte ich einen "Farbtopf" genutzt, der die gesamte Fläche einfärbt (als Radierer eben weiße Farbe auswählen). Kam bis jetzt (Dank Dir) gar nicht auf die Idee, mehre Ebenen zu nutzen. Mal gucken wie ich das in AS3 umsetze. Möglich wäre es, eine Maske zu erstellen für die jeweilige Ebene. Problem ist aber, wenn ich über der selben Stelle mit dem Pinsel male, muss sich die Maske wieder anpassen.

Ich werde heute Abend wohl aber sowieso erst mal gucken, ob ich (erst einmal) ein einfaches Gradient-Tool hinbekomme, und werde dann noch ein Rechteck- und Ellipsen-Tool erstellen, wenn Ich die Zeit dafür habe. Sollte ja so ähnlich sein wie mein Linien-Tool.

MFG ad86

Edit: In meiner Suche hab ich das gefunden:
-
- Http://www.flashandmath.com/basic/mousedraw2/index.html
-
- AS2 gutes Beispiel: http://www.senocular.com/flash/source.php?id=0.175

Für Dich wird wohl letztes gut sein. Ich war jetzt aber nicht auf jeder Seite. Werde heute Abend mich wieder an Flash setzen und dann mal gucken, ob eines der Links ok ist.
 

Reb00t

Aktives Mitglied

AW: Flash Zeichenprogramm :)

Ahja!
Habe jetzt ne Idee für nen Radierer!
Man muss nur den MC in dem man zeichnet in eine bitmap umwandeln.
Nur Bitmaps kann man so "radieren".

lg

P.S. lass mal was sehen ;)
 
A

ad86

Guest

AW: Flash Zeichenprogramm :)

Hi Reb00t,

Hier kannst Du meinen aktuelles Zeichenprogramm sehen. Bis auf den Undo &Redo-Button funktioniert eigentlich alles. Und selbst die Beiden funktionieren schon teilweise.

Version1:


Version2:


MFG ad86
 
Zuletzt bearbeitet von einem Moderator:

Reb00t

Aktives Mitglied

AW: Flash Zeichenprogramm :)

Sehr gut!

Nur wenn ich "FillAll" mache, dann füllt er wirklich alles schwarz und
das Menü ist nicht mehr erkennbar ;)

lg, Reb00t
 
A

ad86

Guest

AW: Flash Zeichenprogramm :)

Hi,

Danke, dürfte aber nur beim Undo und redo passieren. Konnte heute auch etwas machen und diesen Fehler dann ausmerzen.

Aktuell ist diese Version:


Zeig dann mal bitte, wie Dein jetziges Programm aussieht mit dem Ebenenmanager.

MFG ad86
 

h_seldon

Aktives Mitglied

AW: Flash Zeichenprogramm :)

Prima, das sind solide Ansätze für ein hübsches Zeichenprogramm. Bin mal gespannt, wo das hinführt :)

Habe mal einiges ausprobiert; dabei ist mir aufgefallen:

rebOOt,

Farbpicker: Farbauswahl sollte erst bei Loslassen der Maus erfolgen, sonst kann es vorkommen, dass man eine Farbe auswählt und unbeabsichtigt an der aktuellen Stelle auf die Bühne malt, weil man die gedrückte Maustaste ungewollt bewegt hat

Wenn man zeichnet und dabei den Stift über die Werkzeugpalette links und anschließend wieder auf die Bühne bewegt, bleibt der Cursor unsichtbar, bis man die Maus loslässt. Besser wäre es, wenn man direkt weiter zeichnen kann, sobald sich die gedrückte Maus wieder über dem Zeichenbereich befindet. Aus Usability-Gründen empfiehlt es sich, während des Zeichnens den Cursor nicht komplett auszublenden, sondern an seiner Stelle ein Symbol für den aktuellen Zeichnungsmodus anzuzeigen. Das ist ganz besonders wichtig für den Radiergummi, da man im momentanen Zustand nur raten kann, welcher Bereich weg radiert wird.

Bei der Auswahl eines Werkzeugs sollte dieses in der Werkzeugpalette irgendwie hervorgehoben werden. Es reicht nicht aus, rechts oben, also auf der gegenüberliegenden Seite, den aktiven Status anzuzeigen, da das Auge ja zuerst auf die Stelle blickt, an der man etwas aktiviert hat (nämlich die Werkzeugpalette).

Der Button Set! kann entfallen, da die eingestellten Werte offenbar ohnehin direkt auf das aktive Werkzeuge übertragen werden. Der Button Dicke sollte in Stärke umbenannt werden (ist die üblichere Bezeichnung).

In den Eingabefeldern sollte eine Kontrolle der eingegebenen Werte erfolgen: sind die Angaben sinnvoll (z.B. Buchstaben statt Zahlen) und werden Grenzwerte überschritten (z.B. Stärke 999)?

Farbeimer funktioniert noch nicht (BitmapData floodFill; bewirkt eine Füllung in vier Richtungen, also nur horizontal und vertikal, nicht jedoch bei diagonal angrenzenden Pixeln gleicher Farbe).

"Nur Bitmaps kann man so "radieren"." Ist so nicht ganz richtig. Tatsächlich kann man auch MCs radieren, ohne sie in Bitmaps umzuwandeln, allerdings ist das ziemlich umständlich (blendMode "erase", in übergeordnetem MC blendMode "layer", einige andere gehen auch, "normal" geht nicht, alles muss in einem MC liegen, mit _root geht es nicht). Immerhin kann man damit notfalls schöne weiche Ränder heraus radieren.


ad86,

Wähle Round Rectangle, Stroke Thickness 5, Farbe beliebig, aber von der Füllfarbe verschieden (hier wäre eine Option für den Grad der Rundung interessant). Zeichne ein Rechteck von links oben nach rechts unten - perfekt. Jetzt von rechts oben nach links unten - Ober- und Unterkante erscheinen gewölbt, die Füllung scheint sich an den Ecken regelrecht in die Umrandung einzugraben. Zeichne von rechts unten nach links oben - ergibt ein Oval. Von links unten nach rechts oben - Wölbung horizontal.

Fill All: eventuell sinnvoller wäre ein Füllwerkzeug, das die Farbe einer bestehenden Füllung ändert (floodFill-Methode der BitmapData-Klasse)

Wenn man als Linienstärke 0 eingibt und zeichnet, erhält man trotzdem eine sehr dünne Linie (Haarlinie). In dem Fall ist es verwirrend, wenn das betreffende Eingabefeld als Wert 0 anzeigt.

Wird erst der Radiergummi und anschließend ein anderes Werkzeug angewählt, übernimmt Letzteres die Linienstärke des Radiergummies, egal was man eventuell vorher für die Linie eingetragen hatte.

Definiert man eine Linienstärke für ein beliebiges Werkzeug, wechselt zu einem anderen und kehrt wieder zurück, wird dort der Standardwert 100 angezeigt. Besser wäre es, den vorher gewählten Wert zu speichern. Zudem sollte eine Kontrolle auf unsinnige Eingaben erfolgen.

Wenn die App startet, ist zwar der Stift aktiv und man kann auch zeichnen, aber die zugehörigen Auswahl-/Eingabefelder in der Werkzeugpalette sind nicht sichtbar.

Wählt man ein Rechteck mit einem deutlich sichtbaren Rand und wählt anschließend Fill All, dann wird der Zeichenbereich oben, unten und rechts mit dem gleichen Rand versehen.

Was bewirkt Redo bzw. wieviel Sinn macht das bei der momentan vorhandenen Funktionalität?

Bezeichnung Ellypse ändern in Ellipse

Cap Style erster und dritter mit identischer Bezeichnung

Hoffe, das hilft bei eurer Arbeit und wünsche noch viel Erfolg.
 
A

ad86

Guest

AW: Flash Zeichenprogramm :)

Hi,

Danke für die Antwort.

Wähle Round Rectangle, Stroke Thickness 5, Farbe beliebig, aber von der Füllfarbe verschieden (hier wäre eine Option für den Grad der Rundung interessant). Zeichne ein Rechteck von links oben nach rechts unten - perfekt. Jetzt von rechts oben nach links unten - Ober- und Unterkante erscheinen gewölbt, die Füllung scheint sich an den Ecken regelrecht in die Umrandung einzugraben. Zeichne von rechts unten nach links oben - ergibt ein Oval. Von links unten nach rechts oben - Wölbung horizontal.

Ja, ich weiß, dass es nicht korrekt gemalt wird. Alles Schuld von Flash! Hab mir aber schon überlegt, wie ich es besser hinbekomme. Und wegen der Rundung: SChau mal links unten (über CapsStyle) da steht etwas von Rundung.;)

Fill All: eventuell sinnvoller wäre ein Füllwerkzeug, das die Farbe einer bestehenden Füllung ändert (floodFill-Methode der BitmapData-Klasse)

Aktueller Farbeimer ist auch noch die erste Version. Werde ich noch bearbeiten.

Wenn man als Linienstärke 0 eingibt und zeichnet, erhält man trotzdem eine sehr dünne Linie (Haarlinie). In dem Fall ist es verwirrend, wenn das betreffende Eingabefeld als Wert 0 anzeigt.

Gut, muss ich selber mal austesten, da ich gestern erst die 0 erlaubt habe (Vorher war es nur über alpha möglich, die LInie aus - bzw. einzublenden)

Wird erst der Radiergummi und anschließend ein anderes Werkzeug angewählt, übernimmt Letzteres die Linienstärke des Radiergummies, egal was man eventuell vorher für die Linie eingetragen hatte.

Ok, wäre es für Dich besser für jedes Tool seine Linienstärke zu speichern?

Definiert man eine Linienstärke für ein beliebiges Werkzeug, wechselt zu einem anderen und kehrt wieder zurück, wird dort der Standardwert 100 angezeigt. Besser wäre es, den vorher gewählten Wert zu speichern. Zudem sollte eine Kontrolle auf unsinnige Eingaben erfolgen.

Du meinst den Alpha-Wert oder? Linienstärke sollte nur bis 99 gehen. Und Alphawert setze ich immer auf 100, weil mir das in PS auch passiert, dass ich das vergesse. Aber auch hier kann ich ja den Alphawert für das jeweilige Tool abspeichern. Und welches Textfeld hat keine Eingabekontrolle? Also bei mir kann man nur Zahlen in die TXTs eingeben (ohne Punkt/ Komma). Alpha geht von 0 bis 999 (Habe ich jetzt erst gesehen) und Linienstärke bzw. Rundung (beim runden Rechteck) von 0 bis 99.

Wenn die App startet, ist zwar der Stift aktiv und man kann auch zeichnen, aber die zugehörigen Auswahl-/Eingabefelder in der Werkzeugpalette sind nicht sichtbar.

Korrekt. Am Anfang blende ich alle Werkzeugpaletten aus. Habe dabei den Stift vergessen, das er ja aktive ist.:D

Wählt man ein Rechteck mit einem deutlich sichtbaren Rand und wählt anschließend Fill All, dann wird der Zeichenbereich oben, unten und rechts mit dem gleichen Rand versehen.

Links hast Du vergessen!;) Ach ne, da ist ja die Toolbar drüber.
Spaß beiseite. Einer meiner Tester (also Du) hat mir das Problem beschrieben und ich werde es demnächst verbessern.

Was bewirkt Redo bzw. wieviel Sinn macht das bei der momentan vorhandenen Funktionalität?

z.B. Du zeichnest ein Rechteck, dann einen Kreis und dann eine Linie. Nun findest Du die Linie sollte nicht sein, und der Kreis sollte eine andere Farbe haben und größer sein. Also gehst Du zurück. Auf dem Weg dorthin entscheidest Du Dich anders. Also kannst Du wieder zurück (nach vorne) gehen. Oder wenn Du sehen willst, wie viele Arbeitsschritte Du gemacht hast, kannst Du alles nachgucken.
Ist aber hauptsächlich so, weil Du gehst eine Schritt zurück. Möchtest vielleicht was ändern, entscheidest Dich dann doch um. Wäre er nicht da, müsstest Du alles noch einmal zeichnen. Und wer Ihn nicht braucht, muss Ihn ja nicht benutzen. Für mich finde ich ihn gut, so kann ich rückwärts und vorwärts gehen, ohne irgendwelche Formen zu verlieren (es sei denn ich zeichne ein neues Objekt, dann sind Redos nicht mehr möglich.
Werde hier aber wahrscheinlich weg von (internen) Schaltflächen zu MCs gehen, um anzeigen zu können, ob Undo bzw. Redo möglich ist.

Bezeichnung Ellypse ändern in Ellipse

Schreibfehler meinerseits. Ich tendiere immer zum y, keine Ahnung warum.

Cap Style erster und dritter mit identischer Bezeichnung.

Copy and Past- Fehler. Dürfte aber nur passieren entweder, wenn das jeweilige "Tool" aktive ist oder wenn es nicht aktiv ist (bei beidem sich die Maus aber darüber befindet)

So wie oben schon erwähnt, Danke lieber Tester:D.


MFG ad86

EDit:


Aktuelle verbesserte Version Dank h_seldon:
 
Zuletzt bearbeitet von einem Moderator:
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.155
Beiträge
2.581.855
Mitglieder
67.221
Neuestes Mitglied
opaklaus
Oben