73.
Java to go (Java-portable) und HTML 5 Canvas Erstellung mit der
Freeware LeonardoSketch
Einleitung
Coffee
to go ist Trend in Deutschland. Java to go von PortableApps.com
hingegen eher ein Geiheimtipp! Was hat das mit
Leonardo zu tun? Nein, damit ist nicht da Vinci gemeint, aber
diese Software (Freeware) hat die Fähigkeit einfache Canvas-zeichnungen
in HTML-5 Code zu erstellen. Die Software benötigt dazu eine
Javaumgebung. Damit schließt sich der Kreis und der erstellte
"Da-Vinci-Code" ist die Grundlage von Javascriptcode, der dann wie durch Zauberhand zu einer PNG-Grafik im Browser
"umgesetzt wird". Das Bild kann dann heruntergeladen werden. Hinter
einem Bild steht also ein "mathematischer Code" in Javascript.
Inhaltsverzeichnis
Installation
von Java Portable und Launcher
Grundgedanke
Download
von Java_Portable_6_Update_22_online.paf.exe und
JavaPortableLauncher_1.1.paf.exe
Voraussetzungen
für den USB-Stick
Installation
von Java auf den USB-Stick
Wie
benutze ich die Javaumgebung
Leonardo
zur Erstellung für Quellcode von Canvas (Html 5)
Leonardo installieren
Grundbeschreibung von Leonardo
HTML Canvas
Installation
von Java Portable und Launcher
Grundgedanke
Viele Freeware benötigt eine
Java-Laufzeitumgebung, die ein wenig anspruchsvoller ist, als die
rudimentären Elemente in den Webbrowsern. Der Vorteil einer festen
Installation ist die Erschließung vieler Software wie Teile von Open
Office - oder dessen Abschaltung Libre Office - das nach Meinung des
Sternenhimmelstuermers die "wahre" Alternative ist. Eine Javaumgebung
ist betriebssystemunabhängig, d. h. die Anwendungen innerhalb der
Javaumgebung können von Programmierern einmal programmiert, auf jedem
System laufen. Viele Windowsuser laden sich deshalb Javaumgebungen
runter. Diese müssen ständig aktualisiert werden - alte Umgebungen sind
ein dankbarer Entmüllfaktor per Hand oder besser per Freeware, da Sie meistens als
Dateileichen auf dem System bleiben - , und die
Laufzeitumgebung ist ein dankbares Einfallstor für Viren, die sich in
so einer Umgebung auch sichtlich wohl fühlen. Deshalb findet man bei
vielen Usern keine fest installierte Umgebung.
Ab
und zu kommen Sie aber vielleicht nicht um Java herum und dann ist es
schön die eigene Javaumgebung auf dem USB- Stick zu haben (sind "nur
103 MB") und dann keine Rückstände auf dem Zielsystem zu haben...
Download von Java_Portable_6_Update_22_online.paf.exe
und JavaPortableLauncher_1.1.paf.exe.
Die
Seite ist englisch, zuverlässig und die Urmutterseite vieler portablen
Anwendungen. Daher gibt der Sternenhimmelstuermer diesen Link.
Wichtig
für Sie sind die großen roten Buttons mit weißer Schrift. Hier startet
der Download.
Die Reihenfolge ist egal und Sie
können die Dateien auch gerne auf dem Desktop lagern. Die erste o. a.
Datei hat erstmal 13 MB. Später bei der Installation ist eine
Onlineanbindung nötig und es werden noch einmal um die 90 MB
herruntergeladen.
Installation auf dem USB-Stick
Voraussetzungen:
Formatierung NTFS oder FAT (der Sternenhimmelstuermer hat
FAT-Formatierung getestet). Alte Dateien können Sie auf dem USB-Stick
liegen lassen, aber es sollte noch genügend Platz für die Installation
der Java-Umgebung sein (so um 120 MB mit einkalkulierten Spielraum).
Die fertigen Installationen liegen dann als normale Windowsordner vor
mit jeder Menge vielfältiger kleiner neuen Dateien...
Der
Stick wird an den PC angeschlossen - fertig.
Installation von Java auf den USB-Stick
Als
erstes müssen Sie die Java Portable 6...Datei mit
Administrationsrechten (rechte Maustastenklick und als Administrator
auswählen) gestartet werden. Als installationssprache können Sie
deutsch auswählen, was Ihnen ohne den nächsten Tipp wenig hilft: Zwei
Fenster weiter wird ihnen nämlich der Installationspfad \CommonFiles\Java vorgeschlagen,
den Sie nun gerne anpassen können. Und hier machen viele User einen
Fehler, der ihnen erst am Ende der kompletten Installation zum
Verhängnis wird und mit einer Fehlermeldung bei jedem Versuch quittiert
wird, wenn Sie eine Anwendung starten wollen.
Der
einzig richtige Weg ist wie folgend beschrieben:
1.
Mal kurz start - computer - und dort den Laufwerkbuchstaben des
Wechseldatenträgers herausfinden (Kann E oder F oder ? sein).
2.
Den Laufwerkbuchstaben vor den eingetragenen Pfad im o. a.
Dialogfenster mit Doppelpunkt eingeben, also z. B. bei Laufwerk E, E:\CommonFiles\Java
3. Dann geht es mit der Installation weiter.
Lediglich eine Internetanbindung muss vorhanden sein. Achten Sie auf
Ihre Firewall! Blockiert diese, ist es meist schon zu spät. Einen
Moment später kommt eine Fehlermeldung und die Installation geht weiter
(oder war das bei der anderen Datei, habe ich jetzt vergessen...). Also
professionelle Firewall entweder kurzfristig deaktivieren und Windows
Firewall aktivieren - die ist eher gutmütig.
Dann dasselbe Spiel mit
der Installationsdatei des Launchers. Hier ist der zu veränderne Pfad: \JavaPortableLauncher
in Laufwerk - z. B. E: - in E:\JavaPortableLauncher
Wichtig
ist, dass Sie nicht in irgendwelche Unterverzeichniss oder andere Pfade
kopieren. Merke: die Pfade sind eher halbabsolut und nicht relativ.
Wie
benutze ich die Javaumgebung?
Die
Ordner sind installiert, aber wie startet man denn nun so ein
Javaprogramm. Keine Rosen ohne Dornen. Eine feste Installation auf dem
PC ist ein wenig einfacher. Einige Java- Programme haben zur
Aktivierung ihrer Umgebung Exe oder BAt- Dateien, in denen einzelne
Pfade und Parameter der zu startenden Javadateien (.jar) stehen. Bei
einer festen Installation weiß Windows nun, dass es eine Javaumgebung
hat und kann die Befehle über die Kommandozeile zuordnen. Der Pfad zum
USB-Stick hingegen ist Windows nicht bekannt.
Im
wesentlichen gibt es drei Methoden, um eine reibungslose Installation
zu gewährleisten:
1: Beim u. a. Leonardo gibt es
drei Versionen: Die reine Datei Leonardo.onejar.jar (Javaarchivdatei)
ist eine Datei, die sämtliche Programmdateien enthält. Folglich können
Sie sie über den Ordner JavaPortableLauncher,
den Sie auf den USB-Stick als zweites installierten, die Datei
JavaPortableLauncher.exe (Symbol braune Kaffebohne) durch Doppelklicken
anwenden. Daraufhin öffnet sich ein Dialogfenster, in dem nach Dateien
mit der Endung JAR gesucht wird. Nun hehen Sie im Fenster zu
der Leonardo.onejar.jar
und
wählen diese aus. Die Anwendung startet.
2. Sie
haben eine Exe oder Batchdatei. Die Batch muss man leider anpassen. Bei
einer Batchdatei ist das gar nicht so schwer. Die Pfade zu den
unterschiedlichen Dateien müssen lediglich angepasst werden. Bei einer
Exe-Datei bleibt leider keine Möglichkeit, als eine kleine
Nachforschung im Internet...oder ausprobieren der einzelnen Jar-Archive
(ziemlich fruchtlos, da Parameterangaben fehlen, aber für ein wenig
Übersicht nützlich - also Finger weg. Keine Sorge. Nichts kann
kaputtgehen und bisher klappte es beim Sternenhimmelstuermer mit
Variante 1 gut.
Der folgende Artikel knüpft an
dieser nahtlos Stelle an...
Leonardo
zur Erstellung für Quellcode von Canvas (Html 5)
Leonardo installieren
Downloaden
Sie die Datei Leonardo.onejar.jar
hier (unter den Punkt:
double-clickable jar version for all platforms) auf den PC, wenn Sie
eine portable Version Java von PortableApps wie oben beschrieben
verwenden. Suchen Sie mit der Launcher.exe die Datei wie oben
beschrieben.
Haben Sie eine fest installierte
Javaumgebung, dann können Sie die Version für (for) Windows verwenden
und starten dort die Exe.
Die erste Frage nach
Zählung durch Google Analystik kann verneint werden. Keine Rosen ohne
Dornen: Das Tool hat Onlinefähigkeit. Sicherheitsrisiko? Benutzung wie
immer auf eigene Gefahr.
Grundbeschreibung von Leonardo
Das
Tool ist noch in einer frühen Entwicklungsphase. Das Tool ist
erfreulicher Weise deutsch und die Bedienung ist noch leicht haklig.
Einige
Modi sind schwer veränderbar.
Ansonsten arbeitet
es funktional. Hat zwei kleine Vorlagenbilotheken, die per Drag und
Drop ins ins Bearbeitungsfenster gezogen werden können.
Das
Hauptfenster zur Bearbeitung ist für Menschen auch ohne Corel Draw
Erfahrung leicht zu erlernen, da die Vektorbearbeitungswerkzeuge in der
linken Palette sehr überschaubar sind: Kreise, Linien, Text, Quadrate
und Objekte vom Dreieck bis Achteck. sind anklickbar und können dann im
Hauptfenster frei plaziert werden. Über Einfachklick oder Doppelklick
werden verschiedene Eigenschaften in Fenstern angezeigt. Der gewohnte
Rechtsklick für ein Kontextmenü entfällt.
Die
Menüliste im oberen Bereich ist im Windowsstil. Wenn Sie ein Element
markieren, können Sie unter dem gleichnamigen Menüpunkt auch die ebene
des Elementes in den Vordergrung und Hintergrund bringen. Für Corel
Draw oder ambitionierte Word-Anwender ist das Arbeiten mit mehreren
Ebenen kein Hit, aber für den Normaluser in der Regel ungewohnt. Wichtig ist
dabei die Regel: Neue Elemente sind erstmal auf der obersten Ebene
(Erst z. B. einen Kreis und dann den Text, natürlich geht das auch
umgekehrt, aber dann müssen Sie eines der Elemente auswählen und dann
in den Hintergrund oder Vordergrund bringen).
Bilder
können natürlich auch eingefügt werden (unterstes Symbol anklicken und
danach die Arbeitsfläche anklicken, um das Bild dorthin zu importieren.
Für einen reinen Canvasexport ist das natürlich Quatsch, da nur
Vektorgrafiken als Javascript dargestellt werden können..).
Linien
können wie alle Elemente frei plaziert werden und an den Knotenpukten
zu flächen Verbunden werden, die farblich gefüllt werden können. Kurven
können erstellt werden.
Zu guter ketzt können Sie
das Projekt im eigenen Format speichern. Die erstellte Grafik kann als
PDF, HTML mit Bildern, HTML Canvas, SVG, PNG und zu Java 2 D
konvertiert werden. Ein Hochladen zu Twitter oder Flickr ist aus der
Anwendung möglich, wurde aber vom Sternenhimmelstuermer nicht getestet.
HTML Canvas
Der
Sternenhimmelstuermer erstellte eine Probeseite mit dem Originalcode (Die komplette Canvas-Seite im HTML 5 Code ist gerade mal 8 KB groß, dass ist mehr als vielversprechend!!!), die
mit dem Internet Explorer 9 erstmal nicht angezeigt wird. Vielleicht
klappt es ja mit Google Frame in Verbidung mit dem Internet Explorer 6,7 und 8,
der
Sternenhimmelstuermer testete das nicht, da er überwiegend mit
Firefox im Internet unterwegs ist, mit dem es keine Probleme gibt. Mit Google Chrome werden Sie
ebenfalls keine
Schwierigkeiten haben...
Obwohl eine Vorlage - eine Erdkugel nicht exportiert wurde - ist
alles noch nicht so ausgereift, aber aller Anfang ist schwer...
Canvas ist ein Teil von
Html 5. Schauen Sie sich den Quelltext der Probeseite an und Sie werden
verstehen, was der Sternenhimmelstuermer mit "Da Vinci-Code" meinte. Es
dürfe ebenso eine Mär sein, dass Profis aufwendige Tabellen in HTML
Quellcode schreiben wie Menschen, die behaupten, Canvas-Zeichnungen rein
durch Programmieren zu erstellen.
Wie dem auch sei -
es kommt Bewegung in Canvas und das ist höchste Zeit, damit dieses
unseelige Flash aus dem Internet verschwindet.
Dazu
brauch es weitere Editoren. Dann bitte auch Freeware zur Erstellung von
Animationen. User und Homepagebetreiber wie der Sternenhimmelstuermer
werden dann schnell Canvas multiplizieren und die Ablösung von Flash
wird dann sehr schnell erfolgen.
Auch diese Abhandlung wurde
unter Priorität im Geiste der Canvasbewegung ausführlich geschrieben,
um die Entwicklung zu beschleunigen.
Der
Sternenhimmelstuermer bittet User, die vielleicht andere Freeware oder
billige Software in Verbindung mit Canvas kennen, ihr Wissen an den
Sternenhimmelstuermer zu posten...
Zur
besseren Orientierung auf den über 911 (Din A 4) Tippseiten in Abhandlungen von drei Generationen Windows der Sternenenhimmelstuermerpage die individualisierte Suchmaschine von Google mit Suchergebnissen nur von dieser Homepage: Selbst
der Sternenhimmelstuemer findet sich bei diesem umfassenden Content trotz präziser Sortierung der Abhandlungen nur mit Hilfe von Suchmaschinen zu
recht...
Loading
Disclaimer: Sie geben bei der Suche Daten ein, deren Verwendung nach den Regeln von Google weiterverwendet werden können.
Der Sternenhimmelstuermer hat darauf keinen Einfluss, aber kommt mit diesem Hinweis der Verpflichtung aus dem Datenschutz und Telekommunikationsgesetz nach, auf diesen Umstand aufmerksam zu machen. Mit der Eingabe eines Suchwortes stimmen Sie dieser
Verfahrensweise zu, der Sternenhimmelstuermer kann hierfür nicht haftbar gemacht werden. Der Sternenhimmelstuermer distanziert sich von
den Werbeinhalten.
Beim Betätigen dieses Buttons geben Sie Daten an Google weiter über deren Verwendung der Webmaster keinen Einfluss hat. Nach dem Datenschutzgesetz und Telekommunik ist der Webmasterverpflichtet, Sie darauf aufmerksam zu machen - Der Sternenhimmelstuermer traut Google +