Fonts: Difference between revisions

From Official Kodi Wiki
Jump to navigation Jump to search
>Theuni
No edit summary
 
(33 intermediate revisions by 12 users not shown)
Line 1: Line 1:
There's one special file called font.xml. This file contains a list of all fonts the skin uses. XBMC
{{mininav|[[Development]]|[[Skinning]]}}
will load all the fonts mentioned in this file from the /myskin/fonts directory first, and if that fails,
<section begin="main content" />
will attempt to load them from XBMC/media/fonts. In the event that XBMC is unable to locate the specified font, it will default to "font13". You can modify this file as you like and
There's one special file called Font.xml. This file contains a list of all fonts the skin uses.  
add/delete/change fonts. The user friendly font name is referenced by the other xml files mentioned
kodi will load all the fonts mentioned in this file from the /myskin/fonts directory first, and if that fails,
below.  
will attempt to load them from Kodi/media/fonts. In the event that Kodi is unable to locate the specified font, it will default to "font13".  
==Format of the Font.xml File==
It is required that every skin has a font13 definition in their Font.xml file.
The font.xml file is divided into font sets, which includes a set of fonts used by the skin. Every
Apart from that, you can modify this file as you like and add/delete/change fonts. The user friendly font name is referenced by the other xml files mentioned
below.
 
== Format of the Font.xml File ==
The Font.xml file is divided into font sets, which includes a set of fonts used by the skin. Every
font set must contain the same font names in order for the skin to work with all font sets.
font set must contain the same font names in order for the skin to work with all font sets.
<source lang="xml">
<syntaxhighlight lang="xml" enclose="div">
   <fontset id="Latin" unicode="false">
   <?xml version="1.0" encoding="UTF-8"?>
  <fonts>
    <fontset id="Default" idloc="31390">
       <font>
       <font>
       ....
       ....
Line 16: Line 22:
       </font>
       </font>
       ....
       ....
  </fontset>
    </fontset>
  <fontset id="Arial" unicode="true">
    <fontset id="Arial" idloc="31391">
       <font>
       <font>
       ....
       ....
       </font>
       </font>
       ....
       ....
   </fontset>
    </fontset>
</source>
   </fonts>
</syntaxhighlight>
A font set has the following attributes:
A font set has the following attributes:


; id
; id
: Name of the font set. Displayed to the user. Can have any value.
: Name of the font set. Displayed to the user. Can have any value.
; unicode
; idloc
: Whether or not a font set supports unicode characters. Supported values are “true” or “false”
: Refers to a string in the Skins' language file, so font names can be localized.
 
It is possible to use includes (eg. <include>MonoSpace</include>) in Font.xml
There has to be at least one font set with the unicode attribute set to true else languages like Chinese or Korean will not display properly. There is a font called Arialuni.TTF with a size of 20MB. It is a unicode True Type Font and works with all languages Kodi supports.
 


There has to be at least one font set with the unicode attribute set to true else languages like Chinese or Korean will not display properly. There is a font called Arialuni.TTF with a size of 20MB. It is a unicode True Type Font and works with all languages xbmc supports.
'''Note:''' Kodi will automatically switch to the first available unicode font set if the user selects a language that needs one. This switch will not be made if the currently loaded font set already supports unicode.


== Supported Font Types ==
=== True type Fonts ===
True type fonts must have a .ttf suffix. For a true type font it is possible to define the size (default 20)
and a style ''normal'', ''bold'', ''italics'', or ''bolditalics''. Frodo also includes ''lowercase'' or ''uppercase''. Isengard includes ''capitalize''. Jarvis includes ''lighten''.


'''Note:''' XBMC will automatically switch to the first available unicode font set if the user selects a language that needs one. This switch will not be made if the currently loaded font set already supports unicode.
Note: Multiple styles can be used by separating them with a space.


==Supported Font Types==
Example:
===Bitmap Fonts===
<syntaxhighlight lang="xml" enclose="div">
Bitmap fonts must have a .xpr suffix. Instructions for how to generate them will follow. Example:
<xml>
   <font>
   <font>
     <name>font12</name>
     <name>font12</name>
     <filename>myfont12.xpr</filename>
     <filename>arial.ttf</name>
    <size>12</size>
    <style>uppercase lowercase capitalize bold lighten</style>
    <aspect>0.75</aspect>
    <linespacing>1.0</linespacing>
   </font>
   </font>
</xml>
</syntaxhighlight>
====How to Generate XPR Font Files====
 
To generate XPR fonts, you require the programs “FontMaker" and “Bundler” from the Xbox Developers Kit. The steps required are as follows:
The <aspect> tag specifies the aspect ratio of the font. An aspect of 0.75 means that the width of the font will be 0.75 of the height. By default the aspect is 1.0 for all but the SD 16x9 modes (PAL16x9, NTSC16x9 and 480p16x9) where the aspect ratio is 0.75, due to the stretched pixels.
 
The <linespacing> tag defines height of each line (sometimes called leading or inteline spacing). By default linespacing is set to 1.0.


*Load FontMaker.
== How to add a new Font ==
*Load in the Truetype font of the size you wish to convert to XPR.
*Apply any styles (outline, bold, italics, shadow etc.) that you wish the font to have.
*Select the range of characters (Glyphs) that you want the font to contain.
*Size the output texture so that all the characters are displayed.
*Save the fonts. This will create a .tga and .abc file (eg Arial_24.tga and Arial_24.abc)
*Create a text file in the same folder as your font files from 6 with the following content.
<xml>
  Texture Font
  {
  Source Arial_24.tga
  Format D3DFMT_A4R4G4B4
  Levels 1
  }
  UserData FontData
  {
  DataFile Arial_24.abc
  }
</xml>
*Open a command prompt, and cd to the folder containing your font files.
*Run “Bundler Arial_24.txt" to create Arial_24.xpr.


As a second option, you can download the Media X Menu Accessory “Font Bundle” (from the Usual Places).
Font files go in in .kodi/media/fonts (to make them available to all skins), or in the .kodi\addons\skin.myskin\fonts folder
if the font file is to be used with your skin only.


1. Run Font Bundle.
# Place the TTF ( such as verdana.ttf from your PC (C:\Windows\Fonts)) files in .kodi\media\fonts.
2. Click the “Font Maker” button and follow the above Font Maker instructions to create your font(s).
# Edit the file .kodi\addons\skin.myskin\1080p\Font.xml and duplicate the "Default" section.
3. Click the “Load” button in Font Bundle and select your new font.
# Change the 'id' to the name of your new font
4. Click the “Build”.
# change the filename for each <font> definition to the filename of your name font file.
# Finally go to settings > interface > skin > fonts and select the new font.


Your new Font.xpr file should be saved in the same folder as your font files.
'''Example Font.xml'''
<source lang="xml">
<fonts>
<fontset id="Default" idloc="31390" unicode="true">
<!-- Normal Fonts -->
<font>
<name>font12</name>
<filename>DejaVuSans.ttf</filename>
<size>16</size>
</font>
<font>
<name>font12caps</name>
<filename>DefaultCaps.ttf</filename>
<size>16</size>
</font>
<font>
<name>font13</name>
<filename>DejaVuSans.ttf</filename>
<size>20</size>
</font>
...
</fontset>


===True type Fonts===
<fontset id="MyFont" idloc="31392" unicode="true">
True type fonts must have a .ttf suffix. For a true type font it is possible to define the size (default 20)
<!-- Normal Fonts -->
and a style (normal, bold, italics or bolditalics). Example:
<font>
<xml>
<name>font12</name>
  <font>
<filename>Arial.ttf</filename>
    <name>font12</name>
<size>16</size>
    <filename>arial.ttf</name>
</font>
    <size>12</size>
<font>
    <style>bold</style>
<name>font12caps</name>
    <aspect>0.75</aspect>
<filename>Arial.ttf</filename>
  </font>
<size>16</size>
</xml>
</font>
<font>
<name>font13</name>
<filename>Arial.ttf</filename>
<size>20</size>
</font>
...
</fontset>
</fonts>
</source>


The <aspect> tag specifies the aspect ratio of the font.  An aspect of 0.75 means that the width of the font will be 0.75 of the height.  By default the aspect is 1.0 for all but the SD 16x9 modes (PAL16x9, NTSC16x9 and 480p16x9) where the aspect ratio is 0.75, due to the stretched pixels.
<section end="main content" />


[[category:Inner Workings]]
[[Category:Development]]
[[category:Development]]
[[Category:Skin development]]
[[category:Skin Development]]
[[Category:Languages]]
[[category:Languages]]

Latest revision as of 22:31, 22 September 2020

Home icon grey.png   ▶ Development ▶ Skinning ▶ Fonts

There's one special file called Font.xml. This file contains a list of all fonts the skin uses. kodi will load all the fonts mentioned in this file from the /myskin/fonts directory first, and if that fails, will attempt to load them from Kodi/media/fonts. In the event that Kodi is unable to locate the specified font, it will default to "font13". It is required that every skin has a font13 definition in their Font.xml file. Apart from that, you can modify this file as you like and add/delete/change fonts. The user friendly font name is referenced by the other xml files mentioned below.

Format of the Font.xml File

The Font.xml file is divided into font sets, which includes a set of fonts used by the skin. Every font set must contain the same font names in order for the skin to work with all font sets.

  <?xml version="1.0" encoding="UTF-8"?>
  <fonts>
    <fontset id="Default" idloc="31390">
      <font>
       ....
      </font>
      <font>
      ....
      </font>
      ....
    </fontset>
    <fontset id="Arial" idloc="31391">
      <font>
      ....
      </font>
      ....
    </fontset>
  </fonts>

A font set has the following attributes:

id
Name of the font set. Displayed to the user. Can have any value.
idloc
Refers to a string in the Skins' language file, so font names can be localized.

It is possible to use includes (eg. <include>MonoSpace</include>) in Font.xml There has to be at least one font set with the unicode attribute set to true else languages like Chinese or Korean will not display properly. There is a font called Arialuni.TTF with a size of 20MB. It is a unicode True Type Font and works with all languages Kodi supports.


Note: Kodi will automatically switch to the first available unicode font set if the user selects a language that needs one. This switch will not be made if the currently loaded font set already supports unicode.

Supported Font Types

True type Fonts

True type fonts must have a .ttf suffix. For a true type font it is possible to define the size (default 20) and a style normal, bold, italics, or bolditalics. Frodo also includes lowercase or uppercase. Isengard includes capitalize. Jarvis includes lighten.

Note: Multiple styles can be used by separating them with a space.

Example:

  <font>
     <name>font12</name>
     <filename>arial.ttf</name>
     <size>12</size>
     <style>uppercase lowercase capitalize bold lighten</style>
     <aspect>0.75</aspect>
     <linespacing>1.0</linespacing>
  </font>

The <aspect> tag specifies the aspect ratio of the font. An aspect of 0.75 means that the width of the font will be 0.75 of the height. By default the aspect is 1.0 for all but the SD 16x9 modes (PAL16x9, NTSC16x9 and 480p16x9) where the aspect ratio is 0.75, due to the stretched pixels.

The <linespacing> tag defines height of each line (sometimes called leading or inteline spacing). By default linespacing is set to 1.0.

How to add a new Font

Font files go in in .kodi/media/fonts (to make them available to all skins), or in the .kodi\addons\skin.myskin\fonts folder if the font file is to be used with your skin only.

  1. Place the TTF ( such as verdana.ttf from your PC (C:\Windows\Fonts)) files in .kodi\media\fonts.
  2. Edit the file .kodi\addons\skin.myskin\1080p\Font.xml and duplicate the "Default" section.
  3. Change the 'id' to the name of your new font
  4. change the filename for each definition to the filename of your name font file.
  5. Finally go to settings > interface > skin > fonts and select the new font.

Example Font.xml

<fonts>
	<fontset id="Default" idloc="31390" unicode="true"> 
	<!-- Normal Fonts -->
	 	<font>
			<name>font12</name>
			<filename>DejaVuSans.ttf</filename>
			<size>16</size>
		</font>
	 	<font>
			<name>font12caps</name>
			<filename>DefaultCaps.ttf</filename>
			<size>16</size>
		</font>
	 	<font>
			<name>font13</name>
			<filename>DejaVuSans.ttf</filename>
			<size>20</size>
		</font>
		...
	</fontset>

	<fontset id="MyFont" idloc="31392" unicode="true">
	<!-- Normal Fonts -->
	 	<font>
			<name>font12</name>
			<filename>Arial.ttf</filename>
			<size>16</size>
		</font>
	 	<font>
			<name>font12caps</name>
			<filename>Arial.ttf</filename>
			<size>16</size>
		</font>
	 	<font>
			<name>font13</name>
			<filename>Arial.ttf</filename>
			<size>20</size>
		</font>
		...
	</fontset>
</fonts>