How to make a label with two different Fonts

Beatzeps08 · 2008-11-03 17:28

Hey,
I just started to "learn" skinning with the Skinning Engine of XBMC.
Now I already have my first problems.
I think it is the mosy easiest way if I just show what I mean with Images:

At first how I arranged it in Photoshop
[Image: ShouldBe.jpg]

Now an example where the text is centered good
[Image: GoodOne.jpg]

And here an example which shows the opposit^^
[Image: BadOne.jpg]

And here is the Code for the WrapList:

Code:

<control type="wraplist" id="300">

    <description>HomeMainMenu</description>

    <posx>390</posx>

    <posy>647</posy>

    <width>500</width>

    <height>200</height>

    <onup>301</onup>

    <ondown>300</ondown>

    <onright>300</onright>

    <onleft>300</onleft>

    <focusposition>1</focusposition>

    <scrolltime>350</scrolltime>

    <orientation>horizontal</orientation>

    <animation effect="fade" start="0" end="100" time="500">Visible</animation>

    <animation effect="fade" start="0" end="100" time="300">WindowOpen</animation>

    <itemlayout width="200">

        <control type="label">

            <posx>0</posx>

            <posy>0</posy>

            <label>[UPPERCASE]$INFO[ListItem.Label][/UPPERCASE]</label>

            <align>center</align>

            <font>menu_middle</font>

            <textcolor>FF999999</textcolor>

            <shadowcolor>50000000</shadowcolor>

        </control>

    </itemlayout>

    <focusedlayout width="200">

        <control type="group">

            <width>200</width>

            <align>center</align>

            <posx>0</posx>

            <control type="label">

                <width>200</width>

                <label>[UPPERCASE]$INFO[ListItem.Label2][/UPPERCASE]</label>

                <align>right</align>

                <font>menu_large2</font>

                <textcolor>FFFFFFFF</textcolor>

                <shadowcolor>50000000</shadowcolor>

            </control>

            <control type="label">

                <label>[UPPERCASE]$INFO[ListItem.Label][/UPPERCASE]</label>

                <align>left</align>

                <font>menu_large</font>

                <textcolor>FFFFFFFF</textcolor>

                <shadowcolor>50000000</shadowcolor>

            </control>

        </control>

    <content>...</content>

</control>

Okay, you see the Labels (thin and bold) are not really centered and I don't know how to do it. My first problem was even to add two diffrent fonts and let them (independet from the width which depents on the shown text) show up side by side. I made it then as you can see with "<align>right</align>" for the first thin label and "<align>left<align>" for the second main-label. Isn't there any easier method to format two diffrent fonts in one label?

Maybe someone has some nice help for me =). Thank you.

**jmarshall** · 2008-11-03 21:41

No, you can't have 2 different fonts in the same label. You can have bold vs non-bold in a single label (and different colours) but not a different font altogether.

You could do the centering manually if you insist on different fonts I think, by using conditional slide animations to move things over based on which listitem is visible?

Beatzeps08 · 2008-11-04 14:28

Okay thank you.
I know that it is much to "complicated" to make two labels because I only use one font with diffrent bold-settings. But when I use only the Bold-Formatting Syntax of the Skinning Engine, it looks really bad, because its not the right height and not bold enought etc.
Nevertheless, thank you and maybe I try it first without the second label.

skunkm0nkee · 2008-11-04 18:35

You could edit the font so that the bold chars are a different font, that way you could use bold/non-bold in the same label to produce 2 different fonts on screen.

Beatzeps08 · 2008-11-04 19:35

I thought that XBMC uses his own "Bold-Making-Engine" and only extend in this way the normal font with some pixels. And how can I add a bold characters to an existing font? Do you know a programm?

Another idea would be maybe because I only use the Caps of the font, that I delete all the small chars from the font and replace them with my bold Caps...

Thank you.

**jmarshall** · 2008-11-04 22:08

Correct, XBMC boldify's the font ourselves. Caps/non-caps could be an option as you say. One thing to watch here is non-ascii characters though!

Beatzeps08 Member Posts: 75 Joined: Oct 2008 Reputation: 0	2008-11-04 14:28 Post: #3 Okay thank you. I know that it is much to "complicated" to make two labels because I only use one font with diffrent bold-settings. But when I use only the Bold-Formatting Syntax of the Skinning Engine, it looks really bad, because its not the right height and not bold enought etc. Nevertheless, thank you and maybe I try it first without the second label.
	find quote

skunkm0nkee Team Razorfish Posts: 1,887 Joined: Aug 2007 Location: London	2008-11-04 18:35 Post: #4 You could edit the font so that the bold chars are a different font, that way you could use bold/non-bold in the same label to produce 2 different fonts on screen.
	find quote

Beatzeps08 Member Posts: 75 Joined: Oct 2008 Reputation: 0	2008-11-04 19:35 Post: #5 I thought that XBMC uses his own "Bold-Making-Engine" and only extend in this way the normal font with some pixels. And how can I add a bold characters to an existing font? Do you know a programm? Another idea would be maybe because I only use the Caps of the font, that I delete all the small chars from the font and replace them with my bold Caps... Thank you.
	find quote