SVG/PNG Fancy Text and Logo Generator

For discussions about programming, programming questions/advice, and projects that don't really have anything to do with Puppy.
Message
Author
User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

SVG/PNG Fancy Text and Logo Generator

#1 Post by vovchik »

Dear all,

I programmed this little app just now to generate fancy text and logos. The attached binary is Tahr 32-bit. I hope it works for you. The BaCon source is included. I used the latest bacon (www.basic-converter.org) and the latest HUG (also available at the site).

When saving, the program will deposit your time-stamped images (svg and png) in ~/txt2svg (a txt2svg dir in you home dir). There isn't really any help (yet), but the tool-tips explain pretty much everything you need to know. Experiment and have fun!

Let me know whether (or how) it works for you. :)

With kind regards,
vovchik

UPDATED: 5 May 2017 to take into account MochiMoppel's comments.
UPDATED: 5 May 90 (evening(, to fix sefault issue and added radial gradient in simple color select (select Radial) and then set gradient colors.
UPDATED: 5 May 2015 (late evening) Added additional filters (Bevel, Distort, Shadow Drop and Warp). Warp is weird. :)
UPDATED: 6 May (afternoon) Added a spinbox for stroke-width (thanks MochiMoppel!)
UPDATED: 6 May (late afternoon) Added LC_NUMERIC=C to source code, to ensure that SVGs get generated with periods as decimal separators. Thanks musher0!
UPDATED: 6 May (early evening) Added pattern handing. Accessed via simple named color combo box and then choosing two gradient colors.
UPDATED 7 May (just past midnight) Added another pattern (Diagonal) and included a very useful mod by Alexfish at the BaCon forum that prevents accidental exit from the program by clicking the close button in the image preview window.
UPDATED 7 May (evening) Added hatch, crosshatch and candystripe patterns.
UPDATED 8 May (afternoon) Added new filters (glass, icy, metal,)
UPDATED 8 May (evening) Added more filters, including slick shadow. :)
UPDATED 10 May (morning) A few more filters and a fix for the bounding rectangle - which now fits and transparency when bbox is checked. Also think I understood MochiMoppel's request for stroke and fill='none'. Will work on that.
UPDATED 10 May (early afternoon) I think I have implemented what MochiMoppel has asked for. Select "Stroke only" in the Simple color select combobox.
UPDATED 12 May (evening) I added template saving and loading and made a few little enhancements.
UPDATED 14 May (evening) Added 10 new filters.
UPDATED 17 May (evening) Added 7 filters, made some changes to filter vars (now use an array).
UPDATED 21 May (evening) more filters/patterns, some code reorganization - some nice effects
UPDATED 24 May (morning) more patterns/filters, some code reorganization, better grad fills in patterns
UPDATED 25 May (after midnight) Added more filters/patterns and a tiny launch script to prevent locale problems associated with decimal delimiters in generated svg files.
UPDATED 25 May (evening) More patterns and better fills. Also no need for script launcher as SFR has kindly solved the locale problem (decimal separator) and the fix is now in the code.
UPDATED 27 May (afternoon) Added all sorts of interesting pattern fills
UPDATED 30 May (afternoon) Added more pattern fills and did some code optimization/golfing. Took into account step's suggestions.
UPDATED 30 May (early evening) Fixed a few bugs - some wrong filters being selected due to naming "conflicts" after code golfing.
UPDATED 31 May (midnight) More little bug fixes in patterm/filter naming/lookup.
UPDATED 1 June (afternoon) Fixed a few naming bugs in patterns, improved patterns, added patterns.
UPDATED 1 June (evening) Fixed/debugged some code that could have caused problems in future with added filters/patterns. Added more patterns.
UPDATED 3 June (afternoon) A few bug fixes. Additional patterns and filters.
UPDATED 5 June (evening) More patterns, some of them useful and nice. :)
UPDATED 7 June (evening) A few patterns and added rotation and X/Y axis skewing (still working out p[lacement and autoscaling bits, but it works)
UPDATED 10 June (afternoon) Did a bit of work on calculating the bounding box after rotation. More work needed, but a start was made.
Attachments
tahr-32-bit-txt2svg.tar.gz
UPDATED 10 June: Bit of work done on the size of the bounding box after roation. More work needed.
(167.54 KiB) Downloaded 186 times
txt2png2b1.png
(138.41 KiB) Downloaded 1148 times
txt2png2a1.png
(152.2 KiB) Downloaded 1160 times
Last edited by vovchik on Sat 10 Jun 2017, 13:46, edited 38 times in total.

User avatar
MochiMoppel
Posts: 2084
Joined: Wed 26 Jan 2011, 09:06
Location: Japan

#2 Post by MochiMoppel »

Well done :D . So far works as advertised in my old Slacko 5.6.

Only 2 points:
- There are a lot of "Droid" fonts in the list that shouldn't be there. I don't have these fonts installed.
- I found it irritating when, after pushing the Save button, nothing seemed to happen. I expected the Apply dialog to close.

musher0
Posts: 14629
Joined: Mon 05 Jan 2009, 00:54
Location: Gatineau (Qc), Canada

#3 Post by musher0 »

HI vovchik.

I'll have a look at it.

BFN.
musher0
~~~~~~~~~~
"You want it darker? We kill the flame." (L. Cohen)

User avatar
SFR
Posts: 1800
Joined: Wed 26 Oct 2011, 21:52

#4 Post by SFR »

Hey Vovchik, very nice app!

Here's x86_64 build compiled in FD64-710, with one small modification, to preserve consecutive whitespaces:

Code: Select all

# diff -Naur a/txt2svg.bac b/txt2svg.bac 
--- a/txt2svg.bac	2017-05-03 21:13:27.000000000 +0200
+++ b/txt2svg.bac	2017-05-04 14:54:08.264041179 +0200
@@ -905,7 +905,7 @@
 		"<svg xmlns='http://www.w3.org/2000/svg' version='1.1' " & NL$  & \
 		"  width='" & STR$(xsize) & "' height='"  & \
 		STR$(ysize) & "' " & \
-		"preserveAspectRatio='none' overflow='visible' " & NL$ & \
+		"preserveAspectRatio='none' xml:space='preserve' overflow='visible' " & NL$ & \
 		"  viewBox='0 0 " &  STR$(xsize) & " " & \
 		STR$(ysize) & "' " \
 		"opacity='" & opacity$ & "'>" & NL$ & ff$
# 
FYI: for an unknown reason the binary I built used to segfault after clicking "Apply" button, until I tuned on optimizations ('-O1' or higher).
I ended up with '-Os' + strip + UPX.

Also, having txt2svg binary in HOME and trying to save a logo produces another segfualt, because the output dir shares the same name as the binary.

EDIT: Txt2Svg is now available in Fatdog's repo.

Greetings!
Attachments
txt2svg-2017.06.01-x86_64-1.txz.gz
Remove fake .gz!
MD5: b33864d9bc66fd609ae9f2ed68914c36 txt2svg-2017.06.01-x86_64-1.txz
(97.23 KiB) Downloaded 197 times
txt2svg.jpg
(58.8 KiB) Downloaded 1087 times
Last edited by SFR on Thu 01 Jun 2017, 17:30, edited 10 times in total.
[color=red][size=75][O]bdurate [R]ules [D]estroy [E]nthusiastic [R]ebels => [C]reative [H]umans [A]lways [O]pen [S]ource[/size][/color]
[b][color=green]Omnia mea mecum porto.[/color][/b]

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#5 Post by vovchik »

Thanks guys.

@MochiMoppel: You are right about Droid. Not everybody has it and I have already implemented a parser that will chose a default from among a few common ttf fonts in this order:
Droid Sans|DejaVu Sans|Liberation Sans|Ubuntu|Sans|Arial|FreeSans
I will post an update soon. I also think I should dismiss the image window after a save, so I will implement that in the same update. :)

@SFR: I am really glad you caught that. One of the GNU Colbol developers had exactly the same problem with txt2svg and you solved it. Thanks. The reason I did not notice is that I always use the following command line for everything BaCon:
bacon -o -Os -o -fdata-sections -o -ffunction-sections -o -Wl,--gc-sections "$mybacfile"
so it did not occur to me that others may not be using those arguments (bad me :)).

In any case, I am glad that you got it to work and posted the binary. I have also included your "preserve" for whitespace. Thanks.

Those changes will be in the update (in the first post), as soon as I do a few more tests and think about rotation and some additional filters. Soon, I think.:)

With kind regards,
vovchik

PS. Relief and Solidify do some incredible things. If you have some nice filters on hand, please post.

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#6 Post by vovchik »

Dear all,

I have updated the app, taking into account MochiMoppel's comments. Default font handling is now better, and combo lists are now alphabetized. Also, the display window closes after a save. Next in line is the inclusion of axis scaling and skewing and matrix transforms.

With kind regards,
vovchik

User avatar
greengeek
Posts: 5789
Joined: Tue 20 Jul 2010, 09:34
Location: Republic of Novo Zelande

#7 Post by greengeek »

Excellent. Very useful.
Should I be concerned about the following message when I run from terminal? -

Code: Select all

** (txt2svg:5073): WARNING **: Invalid borders specified for theme pixmap:
        /usr/share/themes/ShallowThought/gtk-2.0/radio5.png,
borders don't fit within the image

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#8 Post by vovchik »

Dear greengeek,

Thanks. That message is innocuous. It happpens because there might me some oddity in the theme. Txt2svg is not the cause, since it uses for GTK whatever the user has selected as a theme. :) I get the same with some themes, too. Most other GTK2 applications would also give you that error/warning, but you can safely ignore it.

With kind regards,
vovchik

User avatar
SFR
Posts: 1800
Joined: Wed 26 Oct 2011, 21:52

#9 Post by SFR »

@Vovchik: thanks for the update. I've updated the binary for Fatdog in my previous post.

Greetings!
[color=red][size=75][O]bdurate [R]ules [D]estroy [E]nthusiastic [R]ebels => [C]reative [H]umans [A]lways [O]pen [S]ource[/size][/color]
[b][color=green]Omnia mea mecum porto.[/color][/b]

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#10 Post by vovchik »

Dear SFR,

Thanks. As for the naming of the image dir in $HOME, I am open to suggestions. If it is a hidden dir (using a dot), it will require a user to unhide it each time he wants to check on the files produced. In a normal installation and once packaged, as you well know, it would typically be in /usr/bin or /usr/local/bin, $HOME/bin or $HOME/opt, so the conflict wouldn't noramally arise. But, it can happen, so perhaps naming the image dir "txt2svg_img" or something like that might be better. I am wondering...

With kind regards,
vovchik

PS. If we can get skewX, skewY, matrix and scaling incorporated and working nicely, we should be able to generate some pretty amazing texts. I am now playing with those things.

User avatar
SFR
Posts: 1800
Joined: Wed 26 Oct 2011, 21:52

#11 Post by SFR »

Well, I thought of renaming that dir to e.g. "Txt2Svg", but you're right - the binary shouldn't be in HOME in the first place.
So, I did create a regular TXZ package for Fatdog and problem solved. ;)

Greetings!
[color=red][size=75][O]bdurate [R]ules [D]estroy [E]nthusiastic [R]ebels => [C]reative [H]umans [A]lways [O]pen [S]ource[/size][/color]
[b][color=green]Omnia mea mecum porto.[/color][/b]

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#12 Post by vovchik »

Dear all,

There is a new update in the first post. Peter van Eerten, author of BaCon, determined why the segfault was occuring and provided a real fix (source and binary for Tahr updated):
I was able to reproduce this segfault now. It turns out that the function 'pango_layout_get_pixel_size' was (a) wrongly defined and (b) wrongly used :)

The error relates to the way C refers to pointer variables. When the ADDRESS function is used without proper pointer definitions then GC will simply see two large numbers, while it needs addresses to store values. In the latest source code, the following has to be adapted.


Line 380:

IMPORT "pango_layout_get_pixel_size(long,int*,int*)" FROM pango$ TYPE void


Line 503:

pango_layout_get_pixel_size(layout, &l_width, &l_height)


Now the program works also without optimization flags.
I have also implemented radial gradients for text and backtround, but this option is activated by selecting "Radial" in the colors combos. It was easier (faster) to implement this way, without having to rearrange the gui. :) The attached image shows radial gradients for font and background.

With kind regards,
vovchik
Attachments
txt2png3.png
(76 KiB) Downloaded 941 times

jafadmin
Posts: 1249
Joined: Thu 19 Mar 2009, 15:10

#13 Post by jafadmin »

Works on Precise 5.7.1

Very nice hack, as always, vovchik ..

musher0
Posts: 14629
Joined: Mon 05 Jan 2009, 00:54
Location: Gatineau (Qc), Canada

#14 Post by musher0 »

Hi vovchik.

Works on DpupStretch-7.0.0a1... generally.

If you type text on two lines, one line disappears.

BFN.
Attachments
root_20170505_17h00m51s_switzera_adf-56-shine.png
On one line, it's ok.
(10.77 KiB) Downloaded 208 times
Hum...jpg
Here, the 2nd line is lost.
(145.24 KiB) Downloaded 194 times
musher0
~~~~~~~~~~
"You want it darker? We kill the flame." (L. Cohen)

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#15 Post by vovchik »

Dear musher0,

Thanks for testing. The reason that line disappears is that Switzera ADF is a badly behaved font - the size tables were done badly by the designer, most probably. But that is why, at the very bottom right there is a spin box to fix the offsets. Click on the y offset and add some 15 or 20 pixels (or subtract, as the case may be) and you will see the top line. And in those cases where the font spills over or gets clipped, do a manual adjustment of the dimensions (lower left) of the image. Those things happen because something goes awry in the box calculations being done by pango. I assume the pango guys got it right (algorithm based on ttf specs) and the font designers did not striclty adhere to them.

I am about to post an update that contains four additional filters (Bevel, Distort, Shadow Drop and Warp). With fat fonts, such as Switzera ADF, the results are funny and weird.

With kind regards,
vovchik

musher0
Posts: 14629
Joined: Mon 05 Jan 2009, 00:54
Location: Gatineau (Qc), Canada

#16 Post by musher0 »

HI vovchik.

Ok, your offset trick works, but:
-- this example was done using the DejaVu font.
Is that font badly crafted too?

Because I find it a bit too easy to blame the shortcomings of one's app on
the font designer. The font designers at Arkandis Digital Foundry have a
very good reputation. A programmer of your level shouldn't do that.

It may be that I have ticked or not ticked some essential configuration
item because of inexperience. That is entirely possible.

But to say off the bat that a certain font or group of fonts is bad? Then
please provide as much evidence as you can that that font is indeed bad,
according to font standards, not merely out of your opinion.

-- your app still does not place the text in the right order.
Did I forget to tick something in the config panel?

TIA for any pointers.
Attachments
SwitzeraADF-is-OK.jpg
(110.05 KiB) Downloaded 245 times
Hum(2)...jpg
(102.82 KiB) Downloaded 245 times
musher0
~~~~~~~~~~
"You want it darker? We kill the flame." (L. Cohen)

User avatar
MochiMoppel
Posts: 2084
Joined: Wed 26 Jan 2011, 09:06
Location: Japan

#17 Post by MochiMoppel »

Hi vovchik, thank you for the update. My font box looks much cleaner now :lol:

No further issues so far, but one question:
Many of my fonts don't support the setting of font weight. For logos etc. it would be nice to be able to make the fonts a bit fatter.
I looked into the generated svg code and found the line

Code: Select all

<g stroke-width='0' stroke='black'
I appears that this stroke is a king of outline and by giving it a value the font gains weight. For the screenshot I've changed the color to red so that the difference becomes apparent. Leaving it black would result in a nice, bold font. Can these 2 parameters be set from the GUI? Obviously they are in the generated code, but I can't find them in the GUI.
Attachments
fake_font_weight.jpg
(69.44 KiB) Downloaded 256 times

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#18 Post by vovchik »

Dear musher0,

I didn't mean to trash a particular font designer, but I have examined, say, a hundred or so TTFs character by character when making/designing a TTF vector display for open gl canvas (drawing individual glyphs after extracting and analysing the internal vector tables). I converted heaps of fonts glyph-by-glyph and put those into into c header files. In those files I can then see the bounding box info provided for each glyph, plus kerning info, baselines, descenders etc., and have noted that many font designers have gone off a bit on their own. And I wasn't absolutely categorical in that I did say in my commment "most probably". I have attached one of my own test progs that "embeds" a standard ttf (unisans), takes it apart, grabs all the vector and other info and displays the resulting Beziers (Tahr 32-bit, needs openGL).

But your particular problem is vexing, since I simply take the contents of a standard gtk edit box, wrap it in svg syntax and display. Why it is inverting the order of lines on your machine is a mystery, since this hasn't happened to me and I do not see how it can happen programatically, given the very simple code I use in grabbing the text and processing it. Can you post the resulting svg so that I can have a look? And has anybody else experienced this, too? Please report if you have had this problem!

With kind regards,
vovchik
Attachments
ttf-vertex-bezier-svg-unisans_s1.tar.gz
(60.57 KiB) Downloaded 172 times

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#19 Post by vovchik »

Dear MochiMoppel,

Thanks for testing. I am glad that you did not experience musher0's problems (I hope). You are right about the usefulness of having a stroke-width spinbox. Since I am basically lazy (:)), I don't want to redesign the entire gui yet (but I will probably have to once I include skewX/Y and matrix), I could fit a little spinbox after the "Font style" combo box. Would that be OK?

With kind regards,
vovchik

User avatar
souleau
Posts: 148
Joined: Sun 23 Oct 2016, 15:24

#20 Post by souleau »

Great work vovchik!

I wonder, is there perhaps a chance some time in the future to add a filter function to the backround as well? It would make backrounds like these a possiblity:

Code: Select all

<svg xmlns="http://www.w3.org/2000/svg" width="640" height="480">
<defs>
	<filter id="myFilter01" x="0" y="0" width="100%" height="100%">
	<feTurbulence baseFrequency=".005" numOctaves="1" seed="6" type="turbulence"/>
	<feComponentTransfer>
	<feFuncA type="table" tableValues="1 0"/>
	</feComponentTransfer>
	</filter>
	<filter id="myFilter02" x="0" y="0" width="100%" height="100%">
	<feColorMatrix type="hueRotate" values="180" result="A" />
	</filter>
</defs>
<g filter="url(#myFilter02)" >
<g filter="url(#myFilter01)" >
<rect width="640" height="480" />
</g>
</g>
</svg>
I know it's a tall order. I was actually surprised you went anywhere near the filter functions in the first place.

Post Reply