Seite 3 von 3
Re: Projektidee Html Formular Code Generator
Verfasst: 19.08.2013 21:22
von derschutzhund
dysti hat geschrieben:....also, wenn ich das richtig verstanden habe:
Mit dem FormDesigner eine Seite erstellen.
Also hat man eine Seite, wo man die Elemente flexible ändern kann.
Nun nur noch ein Klick und die fertige Html-Seite/-Code wird generiert.
Ist das korrekt?
Ja so ist es!
Es wird ein html erzeugt und ein Procedure für das .pb.
In der Procedure können Platzhalter eingebaut werden um veränderbare Ausdrucke zu generieren.
Bin gerade dabei den html-Export zu programmieren.
Re: Projektidee Html Formular Code Generator
Verfasst: 20.08.2013 06:20
von dysti
Ja so ist es!
Nun ist mir nur noch nicht klar, in welche Richtung es gehen soll??????
Soll es am Ende ein "WYSIWYG-Editor" werden
oder
nur ein Hilfsmittel für Purebasic als Ersatz für eine Druckausgabe in HTML,
z.B. für den Formdesigner.
Was soll benutzt werden: reiner HTML-Code oder HTML5-Canvas?
Re: Projektidee Html Formular Code Generator
Verfasst: 20.08.2013 10:04
von derschutzhund
Nun ist mir nur noch nicht klar, in welche Richtung es gehen soll??????
Soll es am Ende ein "WYSIWYG-Editor" werden
oder
nur ein Hilfsmittel für Purebasic als Ersatz für eine Druckausgabe in HTML,
Also "WYSIWYG-Editor" gibt es ja schon richtig gute. Glaube es macht nicht so viel Sinn nochmal einen neuen zu programmieren aber natürlich könnte man meinen "HCGenerator" so verwenden!
Das Ziel war für mich eigentlich, schnell und vor allem ohne HTML-Wissen ein pb-Formular für die html-Ausgabe erstellen zu können.
Also eine Art Template welches als fertige Procedure in das PB-Programm geladen werden kann.
Der Programmierer muss dann nur noch an den gewünschten Stellen Texte durch Variable ersetzen.
Schau dir mal als Beispiel hier ein damit erzeugtes Bewertungsblatt für eine Schülermappe an.
Bestimmte Dinge, hier z.B. Name, Klasse, Fach, Datum, Bemerkung im Kasten, die einzelnen Bemerkungen und die Note werden für jeden Schüler automatisch eingetragen also dynamisch. Der Rest ist statisch und wird einmal mit dem HCGenerator erzeugt.
Code: Alles auswählen
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<!<html><head><title>mappe-Hans Dampf</title>
<!</head><body>
<div style="position:absolute; left:90px; top:30px; text-decoration:underline; font-size:32px;">Kontrolle und Bewertung des Schnellhefters</div>
<div style="position:absolute; left:80px; top:90px; font-size:14px;">Name:</div>
<div style="position:absolute; left:125px; top:90px; font-weight:bold; font-size:14px;">Hans Dampf</div>
<div style="position:absolute; left:300px; top:90px; font-size:14px;">Klasse:</div>
<div style="position:absolute; left:350px; top:90px; font-weight:bold; font-size:14px;">9b</div>
<div style="position:absolute; left:420px; top:90px; font-size:14px;">Fach:</div>
<div style="position:absolute; left:460px; top:90px; font-weight:bold; font-size:14px;">Physik</div>
<div style="position:absolute; left:550px; top:90px; font-size:14px;">Datum:</div>
<div style="position:absolute; left:600px; top:90px; font-weight:bold; font-size:14px;">15.08.2013</div>
<div style="position:absolute; left:90px; top:130px; font-weight:bold; font-size:16px;">Bei der Durchsicht deines Schnellhefters konnte ich folgendes feststellen:</div>
<div style="position:absolute; left:80px; top:160px; height:50px; width:560px; background-color:#FFFFFF; box-shadow:4px 4px #666; border-radius: 10px;border:2px solid #000000; padding:10px;"></div>
<div style="position:absolute; left:90px; top:180px; font-weight:bold; font-size:16px;">Die Mappe hat Fehler die du schnell beheben solltest!</div>
<div style="position:absolute; left:90px; top:250px; font-weight:bold; font-size:17px;">Bei der Verbesserung solltest du besonders auf folgende Punkte achten:</div>
<div style="position:absolute; left:110px; top:300px; font-weight:bold;font-size:14px;">Mappe bitte vorne beschriften mit: Dein Name, Fach, Klasse, Schuljahr, Fachlehrer</div>
<div style="position:absolute; left:90px; top:300px; height:12px; width:12px; background-color:#FFFFFF; box-shadow:2px 2px #666; border:1px solid #000000;"></div>
<div style="position:absolute; left:110px; top:330px; font-weight:bold;font-size:14px;">Deine Mappe hat leider die falsche Farbe! Sie sollte grün sein!</div>
<div style="position:absolute; left:90px; top:330px; height:12px; width:12px; background-color:#FFFFFF; box-shadow:2px 2px #666; border:1px solid #000000;"></div>
<div style="position:absolute; left:60px;top:860px; width: 600px; border-top:2px solid #000000"></div>
<div style="position:absolute; left:80px; top:865px; font-weight:bold; font-size:17px;">Nach dem momentanen Stand bewerte ich deine Mappe mit der Note:</div>
<div style="position:absolute; left:610px; top:865px; font-weight:bold; font-size:17px;">1-2</div>
<div style="position:absolute; left:80px; top:895px; font-weight:bold; font-size:14px;">Kenntnisnahme</div>
<div style="position:absolute; left:80px;top:950px; width: 100px; border-top:2px solid #000000"></div>
<div style="position:absolute; left:300px;top:950px; width: 350px; border-top:2px solid #000000"></div>
<div style="position:absolute; left:100px; top:955px; font-weight:bold; font-size:14px;">Datum</div>
<div style="position:absolute; left:350px; top:955px; font-weight:bold; font-size:14px;">Unterschrift eines Erziehungsberechtigten</div>
<div style="position:absolute; left:80px; top:990px; font-weight:bold; font-size:12px;">Bitte dieses Blatt an der aktuellen Stelle in deinen Schnellhefter einheften!</div>
<div style="position:absolute; left:80px; top:1010px; font-weight:bold; font-size:12px;">Bitte die Seitennummer auf dieses Blatt schreiben und in ROT ins Inhaltsverzeichnis eintragen!</div>
<div style="position:absolute; left:500px; top:1040px; font-weight:bold; font-size:10px;">Stand: 8.2013 erzeugt mit sus2013 W.Schmidt</div>
</body></html>
LG
Wolfgang
Re: Projektidee Html Formular Code Generator
Verfasst: 20.08.2013 12:10
von NicTheQuick
Mal eine blöde Frage: Wieso nutzt du eigentlich Pixel als Positionierungsmöglichkeit? Um unabhängig zu DPI zu bleiben, sollte man doch eher Millimeter oder vergleichbares nutzen. Außerdem sollte man dann als Schriftgröße nicht px, sondern pt verwenden.
Re: Projektidee Html Formular Code Generator
Verfasst: 20.08.2013 12:35
von derschutzhund
NicTheQuick hat geschrieben:Mal eine blöde Frage: Wieso nutzt du eigentlich Pixel als Positionierungsmöglichkeit? Um unabhängig zu DPI zu bleiben, sollte man doch eher Millimeter oder vergleichbares nutzen. Außerdem sollte man dann als Schriftgröße nicht px, sondern pt verwenden.
Das ist eine gute Frage!
Erst mal bin ich kein Fachmann für HTML sondern absoluter Anfänger!
Die ganzen Infos habe ich mir im Internet irgendwie zusammen gesucht.
Das ist auch ein Grund, warum ich das Projekt überhaupt mache. Ohne HTML-Befehle zu kennen hat man natürlich kein Möglichkeit etwas als *.html zu erzeugen.
Mit meinem HCGenerator kann das nun jeder machen ohne sich näher mit HTML beschäftigen zu müssen.
Weiterhin habe ich es in Pixel realisiert damit ich eine wirklich Maßstäbliche Darstellung auf dem Bildschirm hat die dann sehr genau zum 1:1 Ausdruck über das *.html passt.
Es gibt bestimmt eine Möglichkeit das über pt oder mm zu erreichen aber ich kenne sie nicht und wie ich es jetzt programmiert habe funktioniert es halt auch. Es ist kein Programm welches ich verkaufen will und andere möchten ja auch noch ein paar Möglichkeiten habe es zu verbessern
Re: Projektidee Html Formular Code Generator
Verfasst: 20.08.2013 12:59
von NicTheQuick
Naja, ich dachte du willst das später möglichst genau auf einer DIN A4 Seite positioniert haben. Und dafür nimmt man eben Auflösungsunabhängige Maßeinheiten. Da du ja weißt wie große eine DIN A4 Seite ist, kannst du mit der Angabe von Millimetern auch genau festlegen wo ein <div>-Element später auf dem Blatt Papier zu sehen sein soll. Mit der Angabe von Pixeln hast du wieder das bekannte DPI-Problem, wo jeder Drucker mal mehr oder weniger hat.
Re: Projektidee Html Formular Code Generator
Verfasst: 20.08.2013 13:31
von derschutzhund
NicTheQuick hat geschrieben:Naja, ich dachte du willst das später möglichst genau auf einer DIN A4 Seite positioniert haben. Und dafür nimmt man eben Auflösungsunabhängige Maßeinheiten. Da du ja weißt wie große eine DIN A4 Seite ist, kannst du mit der Angabe von Millimetern auch genau festlegen wo ein <div>-Element später auf dem Blatt Papier zu sehen sein soll. Mit der Angabe von Pixeln hast du wieder das bekannte DPI-Problem, wo jeder Drucker mal mehr oder weniger hat.
Ok, vielleicht kann das ja jemand im zweiten Schritt optimieren!
Bis auf die Erstellung des PB-Codes ist der HCGenerator fertig und diese Procedure mach ich heute noch.