23. Feb. 2011

for english readers

Wie häufig würde ich mir auf einem Druckformular gerne Platz sparen und einen Text senkrecht setzen. Mit statischen Texten ist das kein Problem. Statische Texte habe ich bis V2004 einschließlich als JPEG im Formular platziert. In der V12 nehme ich PDF und noch lieber SVG, weil ich dann auf Windows kein Klimmzüge unternehmen muß.

Mit statischen Texten komme ich nicht weit. Häufig möchte ich eine interne Datensatz-ID oder einen Zeitstempel mit dem Dokument ausdrucken. Und die sollen senkrecht stehen, nicht vom Wichtigen ablenken und Platz sparen sollen.

4D kann SVG, hat viele Befehl mit denen ich SVG erzeugen kann, neuerdings die SVG-Area als Komponente und es gibt das schöne hm_Draw. Doch eigentlich bin ich zu faul, mich für so'n bisschen gedrehten Text in eines der Tools einzuarbeiten.

Jetzt habe ich eine einfache Lösung gefunden.

SVG mit 4D HTML-Tag

Als erstes erzeuge ich mir ein Objekt der benötigten Façon in OmniGraffle*. Der gelbe Hintergrund zum Text zum besseren Illustrieren.

Das Objekt ist ausgewählt und nur die Auswahl wird als SVG aus OmniGraffle exportiert. SVG ist Text und BBEdit stellt mir das SVG so dar, wie im linken Bild gezeigt. Der Platzhalter ist ausgewählt.

Den Platzhalter "dies und das" will ich zur Laufzeit mit einem Inhalt aus 4D ersetzen. Dazu verwende ich die Textvariable recordStamp und ersetze den Platzhalter mit dem 4D HTML-Tag <!--4DVAR recordStamp -->.
Das Sie sehen im rechten Bild, der 4D HTML-Tag ist ausgewählt.

Das SVG läßt sich in 4D V12 per Drag&Drop platzieren. Das sieht dann so aus: der feste Text ist zu sehen, das 4D HTML-Tag ist nicht ausgewertet, sein Platz ist leer.

Die Dynamik schreibe ich in die On Load-Phase des Formulares.

// Variable füllen
recordStamp:=String(Current date)+" T "+String(Current time)
// die Pfade zum Template und zum platzierten SVG generieren
$sourceDoc:=Get 4D folder(Current Resources folder)+"recordStampTemplate.svg"
// das Template in einen Blob laden
DOCUMENT TO BLOB($sourceDoc;$read_X)
// aus dem Blob einen Text erzeugen, damit ich mit UTF-8 arbeiten kann
$text:=Convert to text($read_X;"utf-8")
// den 4D HTML-Tag auswerten
PROCESS HTML TAGS($text;$resulttext)
// das Ergebnis des ausgewerteten Templates in ein Blob packen und das Blob auf die Platte sichern
CONVERT FROM TEXT($resulttext;"utf-8";$write_X)
// damit das Template nicht verloren geht, wird das tatsächlich platzierte SVG ersetzt
$useDoc:=Get 4D folder(Current Resources folder)+"recordStamp.svg"
BLOB TO DOCUMENT($useDoc;$write_X)

Nutze ich das Formular durch Klick auf den grünen Run-Button sehe ich das dynamische SVG.

Ist das nicht schön? Ich male mir die Elemente, die ich brauche, mache daraus ein SVG und ersetze die dynamischen Elemente durch 4D HTML-Tags. Das Verfahren läßt sich wunderbar kapseln. Ich liebe die V12 und SVG.

lieber auf deutsch?

Every other day I'd like to have some vertical text on the forms, appropriate for many print-forms. With static text it's easy. I used to have JPEG up to V2004. Nowadays I prefer SVGs, because PDFs are a hassle running Windows.

I don't get far with static text. I need a record-ID or a timestamp on the printed material. That kind of information is not important, putting them vertical does not distract and saves real estate.

Out of the box, there are many commands using SVG in 4D, recentyl we got an SVG-area and there is the nice hm_Draw. Actually I'm much to lazy to use one of those for some vertical text.

Now I found something easy.

SVG and 4D HTML-Tag

First I draw the objects I need in OmniGraffle*. The yellow background of the text is for better illustration only.

The object is selected and only the selection is exported as SVG from OmniGraffle. SVG is Text and BBEdit displays the SVG as shown in the picture on the left. My placeholder is highlighted.

I'll replace the placeholder "dies und das" during runtime with information, 4D knows about. Therefor I use a textvariable named recordStamp and replace the placeholder with this 4D HTML-Tag <!--4DVAR recordStamp -->.
You see that in the picture on the right, the 4D HTML-Tag is highlighted.

You place a SVG by dragging it from the Finder and dropping on the form. Here you see the static text, the dynamic part isn't filled in yet.

The dynamics happen in On Load of the form.

// fill variable
recordStamp:=String(Current date)+" T "+String(Current time)
// concatenate the path
$sourceDoc:=Get 4D folder(Current Resources folder)+"recordStampTemplate.svg"
// load the template into a blob
DOCUMENT TO BLOB($sourceDoc;$read_X)
// convert the blob to text, so 4D can use UTF-8
$text:=Convert to text($read_X;"utf-8")
// process the 4D HTML-Tag
PROCESS HTML TAGS($text;$resulttext)
// convert the result to a blob and save the blob to the disk
CONVERT FROM TEXT($resulttext;"utf-8";$write_X)
// not to loose the template the actually placed SVG gets done new
$useDoc:=Get 4D folder(Current Resources folder)+"recordStamp.svg"
BLOB TO DOCUMENT($useDoc;$write_X)

Run the form by clicking the green arrow and the dynamics work.

Isn't this nice? I draw what I need, make it into a SVG and replace the dynamic parts by 4D HTML-Tags. I love V12 and SVG and that kind of working.

* the code Sketch creates is much less verbose. Those flaws with the SVG-code in 1.1 are easy to enhance in a texteditor. ↵