Centered Fonts Watch Face issue...

I'm in the process of creating a watch face that utilizes center THAI_HOT font size but I noticed that the center justification is positioned different for numbers starting with 0, 1 and 2. They don't seem to be monospaced so double-digit numbers starting with 1 seem offset messing up the aesthetics of my layout.

I'm using a layout file for the positioning but there doesn't seem to be an easy way to override the layout position.

I have tried creating an alternative label entry with a different x offset when numbers are between 9-20 but then I don't see a way to hide the other label and they end up getting overlapped.

<label id="HourLabel" x="center" y="0" font="Gfx.FONT_NUMBER_THAI_HOT" justification="Gfx.TEXT_JUSTIFY_CENTER" color="Gfx.COLOR_WHITE" />

<label id="HourLabelAlt" x="104" y="0" font="Gfx.FONT_NUMBER_THAI_HOT" justification="Gfx.TEXT_JUSTIFY_CENTER" color="Gfx.COLOR_WHITE" />

I thought I could use drawables but then there's the annoying blocky background around text characters that doesn't let you get elements close to each other.

Any suggestions on how one can do this?

Nikeow over 9 years ago

I'm in the process of creating a watch face that utilizes center THAI_HOT font size but I noticed that the center justification is positioned different for numbers starting with 0, 1 and 2. They don't seem to be monospaced so double-digit numbers starting with 1 seem offset messing up the aesthetics of my layout.

I'm using a layout file for the positioning but there doesn't seem to be an easy way to override the layout position.

I have tried creating an alternative label entry with a different x offset when numbers are between 9-20 but then I don't see a way to hide the other label and they end up getting overlapped.

<label id="HourLabel" x="center" y="0" font="Gfx.FONT_NUMBER_THAI_HOT" justification="Gfx.TEXT_JUSTIFY_CENTER" color="Gfx.COLOR_WHITE" /> <label id="HourLabelAlt" x="104" y="0" font="Gfx.FONT_NUMBER_THAI_HOT" justification="Gfx.TEXT_JUSTIFY_CENTER" color="Gfx.COLOR_WHITE" />

I thought I could use drawables but then there's the annoying blocky background around text characters that doesn't let you get elements close to each other.

Any suggestions on how one can do this?

May not fully comprehend ur question but yeah it's not monospaded so it will be like that.
Like u said u can position it differently based on the number and layout accordingly.

If u wanna "hide" it, I suggest not calling for it.

Eg : pseudo code

If hour > 10 {

Layout id = hour1. Settext(10);

} else {

Layout I'd = hour2.settext(1)

}

Something like that I hank would help u

jim_m_58 over 9 years ago

The way I do this with a non mono-spaced font that I want to make look mono-spaced, is to display one digit at a time. If you are using dc.xxx() calls, that's 4 calls, vs 1, but if you're in low power mode, that only is an extra 3 calls per minute. Using layouts, that would be 4 fields vs 1. (the time that displays the worst without doing this is "11:11", while something like "20:00" would be the other extreme)

With layouts, you may want to try "JUSTIFY_RIGHT" ( or LEFT), and see if you like the look, vs JUSTIFY_CENTER.

Here's a wf where I wanted the non-monospaced digit's to all line up, and I display it one digit at a time, right justified (I want the segments of the "1" to be in the same place as a the long side of the "3"...

groovc over 9 years ago

I think I may have come up with a "hacky" solution that I didn't consider before. When I mentioned earlier that there wasn't an easy way to hide a label, I realized I could set setText("") to essentially hide it from the view. It seems to be working.

So, basically I did this:

if (hours > 9 && hours < 20) {

        	hr = View.findDrawableById("HourLabel");

        	hr.setText("");

        	hr = View.findDrawableById("HourLabelAlt");

		hr.setText(hourString);

        } else {

        	hr = View.findDrawableById("HourLabelAlt");

        	hr.setText("");

        	hr = View.findDrawableById("HourLabel");

		hr.setText(hourString);

        }