TextField & Fonts

Running on a non-retina iMac and 2015 r2.4.

I’ve noticed when setting up my user interface that when selecting some of the built-in fonts in OSX for use in a textfield, that not all of them have proper vertical alignment. Some appear more at the top of the textfield, some more at the bottom.

I can mitigate this to a small degree by altering the font size or the height of the textfield, but this often results in having to use a tiny font size or an over sized textfield.

Is there a way to get any selected font to center vertically in a textfield ? Or even a simple way to modify the font file itself to make this happen ?

I have some really nice looking fonts here but can’t use them because of this. The height of my text fields is normally 22 or 23.

Remember that YOU having the font does not turn into users of your app having the font and then you get whatever fall backs OS X uses

For UI using System & Small System means you follow apples hig

I understand what you are saying; but this is for my own use. I would still like to be able to use them.

Stephen, you do not explain fully what you want to do. Each character has a different color, that’s it ?

Such thing is easy to do with a Canvas.

[quote=212700:@Michel Bujardet]Stephen, you do not explain fully what you want to do. Each character has a different color, that’s it ?

Such thing is easy to do with a Canvas.[/quote]

No, not the color.

Its the vertical alignment with some fonts when used in a textfield.

System and Small align perfectly. Others align too far to the top or bottom of the textfield. It may be to do with Xojo, or the way the fonts themselves are created, I’m not sure.

Different fonts have different amounts of leading and other metics which affect how they align vertically
You’d have to make you control larger or smaller based on the font they use

This demonstrates it :

The top 2 lines are System and SystemSmall.

The others are all Andale Mono in this example; see on the middle 3 lines how they align vertically ?

To get them vertically aligned (Centered) you have to either use a small size or increase the textfield height as shown on the bottom 3. They don’t look great at all.

As Norman aluded above, it may be down to the font metrics, or something in Xojo, or both.

I’m looking to see if there is a way to get any chosen font centered vertically, which looks far batter.

Heres another example using ‘Avenir Next’ font :

Norman already told you. Fonts are designed with different ascenders and descenders. There is no way to change that.

There could be a way to have a custom TextField that centers vertically by placing a TextField on a ContainerControl. If you use a higher TextField, say 30 points, you can vary its position relative to the ContainerControl top, so the instance of the ContainerControl will show the text in different vertical positions.

To obtain a border, use a Canvas over that.

Here is a sample project :

VerticalCenter.xojo_binary_project

Because the TextField is higher than the ContainerControl, do not use the regular Focus Ring, which would look odd. You can change the color of the border in the canvas instead.

[quote=212710:@Stephen Thomas]
I’m looking to see if there is a way to get any chosen font centered vertically, which looks far batter.[/quote]

[quote=212705:@Norman Palardy]Different fonts have different amounts of leading and other metics which affect how they align vertically
You’d have to make you control larger or smaller based on the font they use[/quote]
There you go
Thats how

Ok, all received. Thanks guys.

You also need to test with a Retina display, with Yosemite font rendering was never quite the same on a non-retina display, some other system metrics are also a little funky on a non-retina screen. Look at the X in the close box of a window.

Well the app is for my own use at this time and I don’t have a retina mac nor do I have access to one. My current model is the 27 inch late 2013 iMac.

If the rumours are true, Apple is planning to release a 4K 23 inch iMac model some time soon; apparently code for it has been spotted in recent Apple releases. If they do, it is a model I will definitely be interested in.

The rumor was that it was going to be released yesterday. We have to wait a bit more, now. It would make sense that something smaller than 27" be available with Retina.

I’ve read somewhere that Apple will be holding another event, that announces iMac/Macbook/Mac Pro type stuff; this has happened previously if I remember correctly, after the usual iPhone event.

Retina on a smaller screen size will be really good for my uses. I would happily have 2 of these in exchange for my 27 inch iMac.

Yes, that’s the precedent and it looks likely we’ll see another smaller event in the next few weeks. Either that or they’ll just quietly announce a few updates on the website which they’ve also often done.