GLBasic forum

Main forum => GLBasic - en => Topic started by: DmitryK on 2010-Dec-20

Title: Fonts deal
Post by: DmitryK on 2010-Dec-20
Hi all

Tryind to use fonts produced with a native GLBasic font tool DiNGSFont and after some external font builders usage I finally IMHO descovered a good solution to get nice looking fonts:
1. Make a font in DiNGSFont with ANY proper background color,  with anti alias (and shadow or outline if you want)
2. Save a file as .png
3. Open the file in GIMP (I have 2.6.6) and convert your image's background color to alpha (color\color to alpha-channel), save it to the same .png (or another if you like :) )

that's all :)

Dmitry
Title: Re: Fonts deal
Post by: DmitryK on 2010-Dec-20
maybe..., but I'm not a theorist and my goal was a result (good looking fonts inside GLBasic) and I've got it :)
Title: Re: Fonts deal
Post by: MrTAToad on 2010-Dec-20
I dont see why just enabling anti-aliasing wouldn't work...
Title: Re: Fonts deal
Post by: erico on 2010-Dec-20
I figure saving a TGA+alpha (32bits) from photoshop does not work on glbasic, either mask.
Using one layer with no background, saving png will work.

You usually have 2 types of alphas, premultiplied with a color or straight.
I guess glbasic does better on the premultiplied with white...
...but I will have to check it.
Title: Re: Fonts deal
Post by: Moru on 2010-Dec-20
Try the fonts on both a black and a white background, if both looks smooth, you have found a simple way of making the alphachannel work properly.
Title: Re: Fonts deal
Post by: Moebius on 2010-Dec-21
From my experience it works.  I've done it in Photoshop though so it's a bit more complicated than "Click convert colour to alpha"  :(
With Photoshop at least you should must use white text on a black background for the alpha to come out right, but you can effectively choose your font colour later.  GIMP might scale the alpha to a 0-100% range depending on what the background and foreground colours are, but I don't have it so I can't know...
...Anyway this is how I do it - a long way of effectively using the image as a mask to a coloured layer (because I have trouble using masks):

-> Open antialiased font image in Photoshop.
-> Select all (Ctrl-A) then Copy (Ctrl-C).
-> Go into channels.  Create a new channel.
-> Select the channel.  Paste.
-> Click on RGB in channels to return to normal editing.
-> Go back to layers.  Create a new layer.  Fill layer with whatever colour you want your text to be.
-> Delete the font image layer that you opened at the beginning (Double click it to turn it from a background layer into normal layer then delete).
-> In the menu, click "Select" >> "Load Selection"
-> Change the channel to the channel you created (again, probably 'Alpha 1').
-> Tick the box 'Invert'.  Make sure it's set to create a new selection.
-> Hit OK.
-> Click on your white layer.  You should now have a selection that is the opposite of the font you want.
-> Press delete.
-> Marvel.

Every time I've done this I've also pasted the boxes that are originally at the top of the image back on to the finished transparent text, so I'm not sure if it will work without it.

Anyway, GIMP = 1 step, Photoshop > 10 steps.
Title: Re: Fonts deal
Post by: DmitryK on 2010-Dec-22
Serpent, thank you for sharing your experience
I didn't try your way before since GIMP and Paint.net are usually enough for me
But I will try and this way to compare results
Title: Re: Fonts deal
Post by: Moebius on 2010-Dec-22
Your way sounds a lot easier, and it seems like GIMP does the same thing.
Title: Re: Fonts deal
Post by: BdR on 2011-Jun-12
Some interesting info in this thread, thanks I found it very usefull :good:. I'm busy finishing my second big iphone game, working on better fonts at the moment. Btw the kerning option added to the PRINT function is great (helpfile says "kernel"?). Anyway, I wanted to try to get a font with alpha channel so it will look good on any background color.

I found that it's very easy when you use Paint Shop Pro:

1) Open a PNG file in Paint Shop Pro (preferably white font on black background)
2) Select from the menu "Layer" -> "New Mask Layer" -> "From Image"
3) Select the "Source luminance" option and uncheck "Invert mask data", press OK

And the font is ready to use. Works perfectly for white font on black background, but not so well for other colors fonts, especially blue becomes semi-transparant. But if you start with white, then you can adjust it to a different color later. I don't know PhotoShop or paint.net, but in Paint Shop Pro it's "Adjust" -> "Color balance" -> "Red/green/blue". For example set Red -100%, Green +100%, Blue -100% for a green font.

Still, I think alpha channel support in DiNGSFont would certainly be a nice-to-have.
Title: Re: Fonts deal
Post by: BdR on 2011-Jun-12
Just now, I also tried Photoshop and there's an easier way to convert black-white font to alpha channel transparency, I found an explanation here (http://www.bigresource.com/Tracker/Track-photoshop-jkvYgzPk/)

1) In Photoshop, open smallfont.png
2) In the Layers tab, double click on Background layer and press OK to make it a new layer
3) Again double click on the new layer to open layer style
4) In Blending options, look for a slide that says "This Layer"
5) Hold ALT and click once on the left slider (the black one) to split it into two sliders
6) Drag the right part of the slider all the way to the right, and press OK
Title: Re: Fonts deal
Post by: blastar on 2011-Jun-19
two weeks ago i shared my app to create bitmap-fonts in the german forum (GLBasic forum » Deutsch » GLBasic - de). i call it UO_DingsFont because it is an unofficial replacement. it can do alpha (antialiasing & shadow), gradients and texture...

UO DiNGSFont (http://www.glbasic.com/forum/index.php?topic=6421.0)

Edit: Fixed URL, is working now :-) /Moru
Title: Re: Fonts deal
Post by: spicypixel on 2011-Jun-19
If you don't mess with the background colour in DingsFont it's transparent anyway. Why all the hassle?
Title: Re: Fonts deal
Post by: Moru on 2011-Jun-19
Spicypixel: what you describe is one bit transparency. Not very useful if you have more than one background-color and use antialias or cleartype on the font.

Blastar: I can't get Antialias working in your tool, the characters still have sharp edges. And cleartype is missing too, is it because I have XP?
Title: Re: Fonts deal
Post by: blastar on 2011-Jun-19
Quote from: Moru on 2011-Jun-19Blastar: I can't get Antialias working in your tool, the characters still have sharp edges. And cleartype is missing too, is it because I have XP?

it's like official dingsfont, you have to increase the fontsize because it uses window-api for antialiasing but you're right, there is a better function if you run >=winxp - i will add this with next update.
Title: Re: Fonts deal
Post by: spicypixel on 2011-Jun-20
Quote from: Moru on 2011-Jun-19
Spicypixel: what you describe is one bit transparency. Not very useful if you have more than one background-color and use antialias or cleartype on the font.

Blastar: I can't get Antialias working in your tool, the characters still have sharp edges. And cleartype is missing too, is it because I have XP?

I get full alpha transparency here with the normal dingsfont too?
Title: Re: Fonts deal
Post by: Moru on 2011-Jun-20
This is what I mean with alpha-transparency, does it work in the latest font-tool that comes with GLBasic?
http://www.glbasic.com/forum/index.php?topic=4099.msg30154#msg30154