Slick Forums

Discuss the Slick 2D Library
It is currently Sat May 18, 2013 3:36 pm

All times are UTC




Post new topic Reply to topic  [ 11 posts ] 
Author Message
 Post subject: Font rendering problem
PostPosted: Sat Aug 04, 2012 3:47 pm 
Offline

Joined: Sat Jun 23, 2012 4:14 pm
Posts: 74
Location: Germany
Hello, I'm working on a pause screen, but the problem is that the font is somehow "smoothed".

Image

Why is it not completely pixelated? is there a way to turn anti-aliasing off? The font size is 13 and my code looks like this: (It looks smoothed even if I change it to 13 or any other size)

Code:
         FONT = new UnicodeFont("res/font/orange kid.ttf", 26, false, false);
         FONT.addAsciiGlyphs();
         FONT.addGlyphs(400, 600);
         FONT.getEffects().add(new ColorEffect(Color.WHITE));
         FONT.loadGlyphs();
and
Code:
         if (this.isUpdatePaused())
         {
            Res.FONT.drawString(16 * 6, 16, "Pause");
         }


Also note that I call g.scale in my StateBasedGame whereby SCALE is 3:
Code:
   @Override
   protected void preRenderState(GameContainer container, Graphics g)
         throws SlickException
   {
      g.scale(SCALE, SCALE);
   }


secondary issue: How can I make the whole screen darker (except for the "Pause" text)?

Thank you very much for your help!


Top
 Profile  
 
PostPosted: Mon Aug 06, 2012 2:04 pm 
Offline
Slick Zombie

Joined: Sat Jan 27, 2007 7:10 pm
Posts: 1466
UnicodeFont does not support "pixel fonts" very well. It's better to use AngelCodeFont -- export as text with TWL's Font Tool and select nearest-neighbour filtering when creating your image:

Code:
Image fontImage = new Image("res/font.png", false, Image.FILTER_NEAREST);
new AngelCodeFont("res/font.def", fontImage);


Top
 Profile  
 
PostPosted: Mon Aug 06, 2012 5:11 pm 
Offline
Slick Zombie

Joined: Fri Jan 29, 2010 7:02 pm
Posts: 1171
You may also want to use FREETYPE2 renderer and disable anti aliasing while creating the font - this will create a font with hard edges (no half transparent pixels).

_________________
TWL - The Themable Widget Library


Top
 Profile  
 
PostPosted: Wed Aug 08, 2012 11:48 am 
Offline

Joined: Sat Jun 23, 2012 4:14 pm
Posts: 74
Location: Germany
davedes wrote:
UnicodeFont does not support "pixel fonts" very well. It's better to use AngelCodeFont -- export as text with TWL's Font Tool and select nearest-neighbour filtering when creating your image:

Code:
Image fontImage = new Image("res/font.png", false, Image.FILTER_NEAREST);
new AngelCodeFont("res/font.def", fontImage);


When I use this code, I get this:
Code:
org.newdawn.slick.SlickException: Invalid character '256': SpriteFont does not support characters above 255
   at org.newdawn.slick.AngelCodeFont.parseChar(AngelCodeFont.java:350)
   at org.newdawn.slick.AngelCodeFont.parseFnt(AngelCodeFont.java:234)
   at org.newdawn.slick.AngelCodeFont.<init>(AngelCodeFont.java:93)
   at org.nogodnobed.data.Res.initalize(Res.java:83)
   at org.nogodnobed.game.Game.initStatesList(Game.java:50)
   at org.newdawn.slick.state.StateBasedGame.init(StateBasedGame.java:170)
   at org.newdawn.slick.AppGameContainer.setup(AppGameContainer.java:433)
   at org.newdawn.slick.AppGameContainer.start(AppGameContainer.java:357)
   at org.nogodnobed.game.Game.main(Game.java:39)
Tue Aug 07 16:45:36 CEST 2012 ERROR:null

So, I can't use AngelCodeFont or SpriteFont for Unicode stuff.. what a shame!

MatthiasM wrote:
You may also want to use FREETYPE2 renderer and disable anti aliasing while creating the font - this will create a font with hard edges (no half transparent pixels).

How can I use this? Do I have to download somethin' from http://freetype.sourceforge.net/index2.html?


Top
 Profile  
 
PostPosted: Wed Aug 08, 2012 4:51 pm 
Offline
Slick Zombie

Joined: Fri Jan 29, 2010 7:02 pm
Posts: 1171
It's an option in the TWL Theme Editor - you can select which font renderer it should use.

As for the unicode issue - just deselect all Unicode blocks except "Basic Latin" and maybe "Latin 1 Supplement".

_________________
TWL - The Themable Widget Library


Top
 Profile  
 
PostPosted: Thu Aug 09, 2012 1:28 pm 
Offline

Joined: Sat Jun 23, 2012 4:14 pm
Posts: 74
Location: Germany
MatthiasM wrote:
It's an option in the TWL Theme Editor - you can select which font renderer it should use.

As for the unicode issue - just deselect all Unicode blocks except "Basic Latin" and maybe "Latin 1 Supplement".


Thank you for your help!

I can't find the rendering setting in this. (Maybie it's an old version)

I disabled anti-aliasing though and it works, but it unfortunetely doesn't solve the problem that I can't use Unicode properly. (e.g. using all these special characters)
And by using AngelCodeFont I have to create a new font everytime I need a new color or font size, which is also not a good solution.


Top
 Profile  
 
PostPosted: Thu Aug 09, 2012 5:25 pm 
Offline
Slick Zombie

Joined: Sat Jan 27, 2007 7:10 pm
Posts: 1466
snapy666 wrote:
MatthiasM wrote:
It's an option in the TWL Theme Editor - you can select which font renderer it should use.

As for the unicode issue - just deselect all Unicode blocks except "Basic Latin" and maybe "Latin 1 Supplement".


Thank you for your help!

I can't find the rendering setting in this. (Maybie it's an old version)

I disabled anti-aliasing though and it works, but it unfortunetely doesn't solve the problem that I can't use Unicode properly. (e.g. using all these special characters)
And by using AngelCodeFont I have to create a new font everytime I need a new color or font size, which is also not a good solution.

UnicodeFont "creates a new font" every time you request a different size (i.e. generates a new bitmap/angel code font). For colours, you don't need to create a new AngelCodeFont/UnicodeFont -- instead, just use the "color" filter when drawing the font, or use g.setColor and g.drawString.

The FREETYPE2 setting is in the combo box "Generator".

I could perhaps add a fix that allows unicode in AngelCodeFont. For a more robust font solution than what Slick provides, I'd suggest using TWL.


Top
 Profile  
 
PostPosted: Thu Aug 09, 2012 6:56 pm 
Offline
Slick Zombie

Joined: Fri Jan 29, 2010 7:02 pm
Posts: 1171
If you don't see the option "FREETYPE2" in the list then it may be caused by either missing native library (the file is included only for windows) or some incompatibility. Can you give me the info displayed in the Help -> About dialog (there is a copy link) ?

_________________
TWL - The Themable Widget Library


Top
 Profile  
 
PostPosted: Sun Aug 19, 2012 1:26 pm 
Offline

Joined: Sat Jun 23, 2012 4:14 pm
Posts: 74
Location: Germany
MatthiasM wrote:
If you don't see the option "FREETYPE2" in the list then it may be caused by either missing native library (the file is included only for windows) or some incompatibility. Can you give me the info displayed in the Help -> About dialog (there is a copy link) ?


This might be the reason. I'm using Linux Mint so it cannot find the library.

The copy to clipboard function copies the whole html-code. Would be better to copy something like this to the clipboard: (btw. your copyright notice is outdated)
Code:
TWL Theme Editor (c) 2010 Matthias Mann

Java                         1.6.0_26 (Sun Microsystems Inc.)
Platform                    linux
OS                           Linux amd64 Version 3.2.0-2-amd64
LWJGL                       2.8.2
OpenGL                      4.2.0 NVIDIA 295.20 NVIDIA Corporation
java.library.path           /usr/lib/jvm/java-6-sun-1.6.0.26/jre/lib/amd64/server:/usr/lib/jvm/java-6-sun-1.6.0.26/jre/lib/amd64:/usr/lib/jvm/java-6-sun-1.6.0.26/jre/../lib/amd64:/usr/java/packages/lib/amd64:/usr/lib64:/lib64:/lib:/usr/lib
jna.library.path           null
org.lwjgl.librarypath       null
Webstart                    javaws-1.6.0_26


Regarding the secondary issue (make the whole screen darker): I figured it out myself :D (was much simpler than expected)

Code:
g.setColor(PAUSE_OVERLAY_COLOR); // FYI this is a transparent color
g.fillRect(0, 0, container.getWidth(), container.getHeight());


Last edited by snapy666 on Mon Aug 20, 2012 11:02 am, edited 1 time in total.

Top
 Profile  
 
PostPosted: Sun Aug 19, 2012 6:01 pm 
Offline
Slick Zombie

Joined: Fri Jan 29, 2010 7:02 pm
Posts: 1171
On linux try installing the freetype2 package - then it should be visible to the theme editor. At least on Ubuntu it can directly access the system libfreetype.so

_________________
TWL - The Themable Widget Library


Top
 Profile  
 
PostPosted: Mon Aug 20, 2012 11:39 am 
Offline

Joined: Sat Jun 23, 2012 4:14 pm
Posts: 74
Location: Germany
davedes wrote:
UnicodeFont "creates a new font" every time you request a different size (i.e. generates a new bitmap/angel code font).

So I can use UnicodeFont which than creates AngelCodeFont internally? How do I do this?

davedes wrote:
For a more robust font solution than what Slick provides, I'd suggest using TWL.

I will try this out later. Does this not have the limitations of using AngelCodeFont or UnicodeFont?

MatthiasM wrote:
On linux try installing the freetype2 package - then it should be visible to the theme editor. At least on Ubuntu it can directly access the system libfreetype.so

It works :D. Does this still work on other systems where the library isn't installed?


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 11 posts ] 

All times are UTC


Who is online

Users browsing this forum: No registered users and 3 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
Powered by phpBB® Forum Software © phpBB Group