Author Topic: UILabel: Scaling font by screen width  (Read 3962 times)

Dalediko

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 10
    • View Profile
UILabel: Scaling font by screen width
« on: April 18, 2014, 02:24:23 PM »
Hey there,

I'm starting to get a grasp on this new NGUI 3.5.5 thing, and it's really nice!   ;D
Using custom anchoring, I've manage to scale my sprites according to screen width
(e.g., make a sprite take always 30% of the screen width).

How can I do the same with labels and fonts?

I want my fonts to look the same on all screen sizes, relatively to screen width.
For example, if screen width is 480 - font size will be 40, if screen width is 720, font size will be 60.
I've tried to explicitly change the fontSize property in code, but it doesn't seem to work -
I get all kinds of weird proportions of the font which I cannot explain.
(tried it in all overflow modes: shrink/clamp/resize-freely/resize-height - it doesn't work.)

Any ideas?

TNX

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: UILabel: Scaling font by screen width
« Reply #1 on: April 18, 2014, 05:19:18 PM »
Set UIRoot to be Fixed Size.

Dalediko

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 10
    • View Profile
Re: UILabel: Scaling font by screen width
« Reply #2 on: April 19, 2014, 05:21:56 AM »
TNX, but UIRoot is already fixed size :-)

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: UILabel: Scaling font by screen width
« Reply #3 on: April 19, 2014, 07:08:34 PM »
Then the labels will already be the same size relative to screen height, and I'm not sure what you're asking. Update to the latest version first, and post some pics to explain better, might help.

Dalediko

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 10
    • View Profile
Re: UILabel: Scaling font by screen width
« Reply #4 on: April 22, 2014, 08:30:37 AM »
TNX for the reply. I'll try to explain it better.

I'm developing an app for mobile.
I want to have a box of text, which takes 40% of the screen's WIDTH, and located
10% from the left.
The size of font in the box should be proportional to the screen's WIDTH, regardless of
screen height. That is, it would look the same both on shorter and longer screens.

Attached are illustrations of two such text boxes.
As you can see, all sizes are relative to the screen's width,
and the screen's height is meaningless.

Any ideas?

TNX!!

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: UILabel: Scaling font by screen width
« Reply #5 on: April 23, 2014, 06:41:27 AM »
Use the anchoring system. Anchor the box using advanced anchoring, specifying relative values for left and right (0.1 for left, 0.4 for right). Anchor top to where you want it to be. Leave bottom empty (not anchored). Specify the desired aspect ratio on the widget, and it will adjust the bottom for you.

Dalediko

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 10
    • View Profile
Re: UILabel: Scaling font by screen width
« Reply #6 on: April 23, 2014, 09:08:54 AM »
My problem is not the size of the box - I managed to do that already.
The problem is the size of the font - how to make it relative to the
box's width.

TNX

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: UILabel: Scaling font by screen width
« Reply #7 on: April 24, 2014, 01:01:24 AM »
The font size is not something you an anchor, but you can write a script that will use the box's dimensions to change the size of the font on the label. It would be just simple math.