Texture Attributes - Revision history

RogueScholar: Fix broken wikilink from Archive-a-palooza 2020

2021-11-11T02:03:51Z

Fix broken wikilink from Archive-a-palooza 2020

← Older revision		Revision as of 02:03, 11 November 2021
Line 1:		Line 1:
	~~===Image Size and Type Restrictions===~~		For the <code><texture></code> tags, and for all <texture> tags in other controls, there are a small set of rules concerning their attributes that you should follow if at all possible. They are explained below.
	For the <texture> tags, and for all <texture> tags in other controls, there is a small set of rules that you should follow if at all possible:
	~~==== Size ====~~
	Images should be as close as possible to the nearest highest power of 2 in width and height. The reason for this is Kodi uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.xbt file. Note that the image does not need to be square, and will not be scaled into a power of 2 size. Rather, any pixels outside of a power of two size will simply be dead space (wasted memory). If you cannot manage this, then [[TexturePacker]] will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels in the horizontal, but has no restrictions in the vertical direction. ~~These~~ are '''slightly''' slower to load and render, but for the most part there's not a lot of difference. The [[TexturePacker]] program that does the image injection into Textures.xbt will tell you what format it's using, and how much pixel wastage (memory waste) is contained in each image.

	==== ~~Formats~~ ====		== Restrictions ==
	~~If you wish~~ to ~~use full 8 bit transparency, then use PNG. If you only need a single transparent colour, then you can specify this in~~ the <~~colorkey~~> ~~tag, so any image will be fine~~. It is ~~suggested~~ that ~~you use PNG~~ and ~~JPG as much as possible~~. Note that ~~once~~ the ~~images are injected~~ into ~~Textures~~.~~xbt~~, ~~they are not stored as JPG or PNG – rather they are stored in~~ a ~~format~~ for ~~faster loading. The size of the images~~ (~~in kb~~) ~~is therefore not as important as~~ the ~~size of~~ the ~~images in pixels – so feel free~~ to ~~store them in~~ a ~~lossless~~ (~~eg PNG~~) ~~manner if you wish~~.		=== Size ===
			Image dimensions should be as close as they can be to the highest n<sup>2</sup>px in width and height possible without upscaling. The reason for this is that Kodi uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.xbt file. Note that the image does not need to be square, and will not be scaled into an n<sup>2</sup> size. Rather, any pixels outside of a n<sup>2</sup> size will simply be dead space (and more importantly, wasted memory). If you cannot manage this, then [[TexturePacker]] will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels on the x-axis, but has no restrictions on the y-axis. These are ''slightly'' slower to load and render, but for the most part there's not a lot of difference. As TexturePacker does the image injection into Textures.xbt it will tell you what format it's using, and how much pixel waste (i.e. extra memory) is created by each one.

	~~The~~ only ~~exception to~~ this is if you ~~require an animated texture~~. ~~In this case~~, ~~we only support animated GIF~~. ~~There are also SOME animated gifs that may~~ not ~~work~~. ~~Use ImageReady CS and make sure~~ you ~~set the gif-anim to “restore to background” and they should work fine~~.		=== Format ===
			If you wish to use full 8-bit transparency, then use the PNG file format. If you only need a single transparent colour, then you can specify this in the <colorkey> tag, so any image will be fine, but it is suggested that you use PNG and JPEG as much as possible. Be aware that once the images are injected into Textures.xbt, they are no longer stored as a JPEG or PNG—rather they are stored in a format for faster loading. The size of the images (in KiB) is therefore not as important as the size of the images in pixels—so feel free to store them in a lossless (e.g. PNG) container format if you wish.

	===~~= Restrictions =~~===		The only exception to this is when you require an animated texture. In this case, Kodi only supports animated GIFs. There are also '''''some''''' animated GIFs that may not work. If issues arise, use software such as [[w:Adobe Photoshop#CS3 (version 10)\|Adobe Photoshop CS3]] or later ([[w:Adobe ImageReady\|Adobe ImageReady]] prior to that), or [http://x.photoscape.org/ Mooii PhotoScape X] and make sure you set the file's <code>gif-anim</code> attribute to <var>restore to background</var> and they should work fine.
	For [[TexturePacker]] to ~~works~~ correctly, make sure your images:
	* are at least ~~4px x 4px~~ in size		=== TexturePacker ===
	* use a RGB colorspace (do not use grayscale or indexed ~~colors~~)		For TexturePacker to work correctly, make sure your images:
			* are at least 4x4px in size
			* use an RGB colorspace (do not use grayscale or an indexed color palette)
	* use 8-bit integer bit depth		* use 8-bit integer bit depth

	=== Attributes ~~of the texture tags =~~==		== Attributes ==
	The following attributes can be used to alter how a texture is rendered. These apply to all texture tags (for example <texturefocus> and so on). Note that they're all lower-case, as XML is case-sensitive.		The following attributes can be used to alter how a texture is rendered. These apply to all texture tags (for example <texturefocus> and so on). Note that they're all lower-case, as XML is case-sensitive.
	{\| class="prettytable"		{\| class="prettytable"
	! Attribute !! Description		! Attribute !! Description
	\|-		\|-
	\| '''border'''		\| style="padding: 0.75em; text-align: right;" \| '''border'''
	\| Used to specify a region of the texture to be considered a border that should not be scaled when the texture is scaled to fit a control's dimensions. The portion in the border region will remain unscaled. Particularly useful to achieve rounded corners that do not change size when a control is resized. Note that zoom animations and GUI rescaling will still affect the border region - it is just the scaling of the texture to the control size which is unaffected. Using border="5" will give a 5 pixel border all around the texture. You can specify each of the border amounts on each edge individually using border="left,top,right,bottom".		\| style="padding: 0.25em 0.75em;" \| Used to specify a region of the texture to be considered a border that should not be scaled when the texture is scaled to fit a control's dimensions. The portion in the border region will remain unscaled. Particularly useful to achieve rounded corners that do not change size when a control is resized. Note that zoom animations and GUI rescaling will still affect the border region - it is just the scaling of the texture to the control size which is unaffected. Using border="5" will give a 5 pixel border all around the texture. You can specify each of the border amounts on each edge individually using border="<var>left</var>,<var>top</var>,<var>right</var>,<var>bottom</var>".
	\|-		\|-
	\| '''flipx'''		\| style="padding: 0.75em; text-align: right;" \| '''flipx'''
	\| Specifies that the texture should be flipped in the horizontal direction~~. Useful~~ for reflections.		\| style="padding: 0.25em 0.75em;" \| Specifies that the texture should be flipped in the horizontal direction, useful for reflections.
	\|-		\|-
	\| '''flipy'''		\| style="padding: 0.75em; text-align: right;" \| '''flipy'''
	\| Specifies that the texture should be flipped in the vertical direction~~. Useful~~ for reflections.		\| style="padding: 0.25em 0.75em;" \| Specifies that the texture should be flipped in the vertical direction, useful for reflections.
	\|-		\|-
	\| '''background'''		\| style="padding: 0.75em; text-align: right;" \| '''background'''
	\| Used on the <imagepath> tag. When set to "true", this forces the image to be loaded via the large texture manager (except for textures located in Textures.xbt). [[Background Image Loader\|~~See here for more information~~]]		\| style="padding: 0.25em 0.75em;" \| Used on the <imagepath> tag. When set to "true", this forces the image to be loaded via the large texture manager (except for textures located in Textures.xbt). {{Nowrap\|''See: '''[[Archive:Background Image Loader\|Background Image Loader]]'''''}}
	\|-		\|-
	\| '''diffuse'''		\| style="padding: 0.75em; text-align: right;" \| '''diffuse'''
	\| Specifies a diffuse texture which is "modulated" or multiplied with the texture in order to give specific effects, such as making the image gain transparency, or tint it in various ways. As it's applied per-pixel, many effects are possible, the most popular being by a transparent reflection which slowly gets more and more opaque. This is achieved using a WHITE image where the transparency increases as you move down the texture.		\| style="padding: 0.25em 0.75em;" \| Specifies a diffuse texture which is "modulated" or multiplied with the texture in order to give specific effects, such as making the image gain transparency, or tint it in various ways. As it's applied per-pixel many effects are possible, the most popular being by a transparent reflection which slowly gets more and more opaque. This is achieved using a WHITE image where the transparency increases as you move down the texture.
	\|-		\|-
	\| '''colordiffuse'''		\| style="padding: 0.75em; text-align: right;" \| '''colordiffuse'''
	\| This specifies the color to be used for the texture basis. It's in ~~hex~~ AARRGGBB format. If you define <code><texture colordiffuse="FFFFAAFF">texture.png</texture></code> (magenta), the image will be given a magenta tint when rendered. You can also specify this as a name from the [[Colour themes\|colour theme]] or you can also use $VAR and $INFO for dynamic values.		\| style="padding: 0.25em 0.75em;" \| This specifies the color to be used for the texture basis. It's is specified in hexadecimal notation using the AARRGGBB format. If you define <code><texture colordiffuse="FFFFAAFF">texture.png</texture></code> ({{Color\|#ffaaff\|magenta}}), the image will be given a magenta tint when rendered. You can also specify this as a name from the [[Colour themes\|colour theme]], or you can also use $VAR and $INFO for dynamic values.
	\|}		\|}

Line 43:		Line 44:
	* [[Add-on development]]		* [[Add-on development]]
	* [[Skinning]]		* [[Skinning]]


	[[Category:Skin development]]		[[Category:Skin development]]

Ronie: /* Attributes of the texture tags */

2020-07-13T00:38:00Z

Attributes of the texture tags

← Older revision		Revision as of 00:38, 13 July 2020
Line 36:		Line 36:
	\|-		\|-
	\| '''colordiffuse'''		\| '''colordiffuse'''
	\| This specifies the color to be used for the texture basis. It's in hex AARRGGBB format. If you define <code><texture colordiffuse="FFFFAAFF">texture.png</texture></code> (magenta), the image will be given a magenta tint when rendered. You can also specify this as a name from the [[Colour ~~Themes~~\|colour theme]] or you can also use $VAR and $INFO for dynamic values.		\| This specifies the color to be used for the texture basis. It's in hex AARRGGBB format. If you define <code><texture colordiffuse="FFFFAAFF">texture.png</texture></code> (magenta), the image will be given a magenta tint when rendered. You can also specify this as a name from the [[Colour themes\|colour theme]] or you can also use $VAR and $INFO for dynamic values.
	\|}		\|}

Ronie at 14:18, 17 March 2019

2019-03-17T14:18:43Z

← Older revision		Revision as of 14:18, 17 March 2019
Line 11:		Line 11:
	==== Restrictions ====		==== Restrictions ====
	For [[TexturePacker]] to works correctly, make sure your images:		For [[TexturePacker]] to works correctly, make sure your images:
	- are at least ~~4pix~~ x ~~4pix~~ in size		* are at least 4px x 4px in size
	- use a RGB colorspace (do not use grayscale or indexed colors)		* use a RGB colorspace (do not use grayscale or indexed colors)
	- use 8-bit integer bit depth		* use 8-bit integer bit depth

	=== Attributes of the texture tags ===		=== Attributes of the texture tags ===

Ronie at 14:18, 17 March 2019

2019-03-17T14:18:13Z

← Older revision		Revision as of 14:18, 17 March 2019
Line 8:		Line 8:

	The only exception to this is if you require an animated texture. In this case, we only support animated GIF. There are also SOME animated gifs that may not work. Use ImageReady CS and make sure you set the gif-anim to “restore to background” and they should work fine.		The only exception to this is if you require an animated texture. In this case, we only support animated GIF. There are also SOME animated gifs that may not work. Use ImageReady CS and make sure you set the gif-anim to “restore to background” and they should work fine.

			==== Restrictions ====
			For [[TexturePacker]] to works correctly, make sure your images:
			- are at least 4pix x 4pix in size
			- use a RGB colorspace (do not use grayscale or indexed colors)
			- use 8-bit integer bit depth

	=== Attributes of the texture tags ===		=== Attributes of the texture tags ===

Ronie at 14:05, 17 March 2019

2019-03-17T14:05:26Z

← Older revision		Revision as of 14:05, 17 March 2019
Line 2:		Line 2:
	For the <texture> tags, and for all <texture> tags in other controls, there is a small set of rules that you should follow if at all possible:		For the <texture> tags, and for all <texture> tags in other controls, there is a small set of rules that you should follow if at all possible:
	==== Size ====		==== Size ====
	Images should be as close as possible to the nearest highest power of 2 in width and height. The reason for this is Kodi uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.xbt file. Note that the image does not need to be square, and will not be scaled into a power of 2 size. Rather, any pixels outside of a power of two size will simply be dead space (wasted memory). If you cannot manage this, then TexturePacker will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels in the horizontal, but has no restrictions in the vertical direction. These are '''slightly''' slower to load and render, but for the most part there's not a lot of difference. The TexturePacker program that does the image injection into Textures.xbt will tell you what format it's using, and how much pixel wastage (memory waste) is contained in each image.		Images should be as close as possible to the nearest highest power of 2 in width and height. The reason for this is Kodi uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.xbt file. Note that the image does not need to be square, and will not be scaled into a power of 2 size. Rather, any pixels outside of a power of two size will simply be dead space (wasted memory). If you cannot manage this, then [[TexturePacker]] will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels in the horizontal, but has no restrictions in the vertical direction. These are '''slightly''' slower to load and render, but for the most part there's not a lot of difference. The [[TexturePacker]] program that does the image injection into Textures.xbt will tell you what format it's using, and how much pixel wastage (memory waste) is contained in each image.

	==== Formats ====		==== Formats ====

Ronie at 14:03, 17 March 2019

2019-03-17T14:03:57Z

← Older revision		Revision as of 14:03, 17 March 2019
Line 5:		Line 5:

	==== Formats ====		==== Formats ====
	If you wish to use full 8 bit transparency, then use PNG. If you only need a single transparent colour, then you can specify this in the <colorkey> tag, so any image will be fine. It is suggested that you use PNG and JPG as much as possible. Note that once the images are injected into Textures.xbt, they are not stored as JPG or PNG – rather they are stored in a ~~xbox native~~ format for faster loading. The size of the images (in kb) is therefore not as important as the size of the images in pixels – so feel free to store them in a lossless (eg PNG) manner if you wish.		If you wish to use full 8 bit transparency, then use PNG. If you only need a single transparent colour, then you can specify this in the <colorkey> tag, so any image will be fine. It is suggested that you use PNG and JPG as much as possible. Note that once the images are injected into Textures.xbt, they are not stored as JPG or PNG – rather they are stored in a format for faster loading. The size of the images (in kb) is therefore not as important as the size of the images in pixels – so feel free to store them in a lossless (eg PNG) manner if you wish.

	The only exception to this is if you require an animated texture. In this case, we only support animated GIF. There are also SOME animated gifs that may not work. Use ImageReady CS and make sure you set the gif-anim to “restore to background” and they should work fine.		The only exception to this is if you require an animated texture. In this case, we only support animated GIF. There are also SOME animated gifs that may not work. Use ImageReady CS and make sure you set the gif-anim to “restore to background” and they should work fine.

Ronie at 14:02, 17 March 2019

2019-03-17T14:02:25Z

← Older revision		Revision as of 14:02, 17 March 2019
Line 2:		Line 2:
	For the <texture> tags, and for all <texture> tags in other controls, there is a small set of rules that you should follow if at all possible:		For the <texture> tags, and for all <texture> tags in other controls, there is a small set of rules that you should follow if at all possible:
	==== Size ====		==== Size ====
	Images should be as close as possible to the nearest highest power of 2 in width and height. The reason for this is Kodi uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.~~xpr~~ file. Note that the image does not need to be square, and will not be scaled into a power of 2 size. Rather, any pixels outside of a power of two size will simply be dead space (wasted memory). If you cannot manage this, then ~~XBMCTex~~ will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels in the horizontal, but has no restrictions in the vertical direction. These are '''slightly''' slower to load and render, but for the most part there's not a lot of difference. The ~~XBMCTex~~ program that does the image injection into Textures.~~xpr~~ will tell you what format it's using, and how much pixel wastage (memory waste) is contained in each image.		Images should be as close as possible to the nearest highest power of 2 in width and height. The reason for this is Kodi uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.xbt file. Note that the image does not need to be square, and will not be scaled into a power of 2 size. Rather, any pixels outside of a power of two size will simply be dead space (wasted memory). If you cannot manage this, then TexturePacker will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels in the horizontal, but has no restrictions in the vertical direction. These are '''slightly''' slower to load and render, but for the most part there's not a lot of difference. The TexturePacker program that does the image injection into Textures.xbt will tell you what format it's using, and how much pixel wastage (memory waste) is contained in each image.

	==== Formats ====		==== Formats ====
	If you wish to use full 8 bit transparency, then use PNG. If you only need a single transparent colour, then you can specify this in the <colorkey> tag, so any image will be fine. It is suggested that you use PNG and JPG as much as possible. Note that once the images are injected into Textures.~~xpr~~, they are not stored as JPG or PNG – rather they are stored in a xbox native format for faster loading. The size of the images (in kb) is therefore not as important as the size of the images in pixels – so feel free to store them in a lossless (eg PNG) manner if you wish.		If you wish to use full 8 bit transparency, then use PNG. If you only need a single transparent colour, then you can specify this in the <colorkey> tag, so any image will be fine. It is suggested that you use PNG and JPG as much as possible. Note that once the images are injected into Textures.xbt, they are not stored as JPG or PNG – rather they are stored in a xbox native format for faster loading. The size of the images (in kb) is therefore not as important as the size of the images in pixels – so feel free to store them in a lossless (eg PNG) manner if you wish.

	The only exception to this is if you require an animated texture. In this case, we only support animated GIF. There are also SOME animated gifs that may not work. Use ImageReady CS and make sure you set the gif-anim to “restore to background” and they should work fine.		The only exception to this is if you require an animated texture. In this case, we only support animated GIF. There are also SOME animated gifs that may not work. Use ImageReady CS and make sure you set the gif-anim to “restore to background” and they should work fine.
Line 24:		Line 24:
	\|-		\|-
	\| '''background'''		\| '''background'''
	\| Used on the <imagepath> tag. When set to "true", this forces the image to be loaded via the large texture manager (except for textures located in Textures.~~xpr~~). [[Background Image Loader\|See here for more information]]		\| Used on the <imagepath> tag. When set to "true", this forces the image to be loaded via the large texture manager (except for textures located in Textures.xbt). [[Background Image Loader\|See here for more information]]
	\|-		\|-
	\| '''diffuse'''		\| '''diffuse'''

Ned Scott: /* Attributes of the texture tags */

2017-05-31T07:37:19Z

Attributes of the texture tags

← Older revision		Revision as of 07:37, 31 May 2017
Line 28:		Line 28:
	\| '''diffuse'''		\| '''diffuse'''
	\| Specifies a diffuse texture which is "modulated" or multiplied with the texture in order to give specific effects, such as making the image gain transparency, or tint it in various ways. As it's applied per-pixel, many effects are possible, the most popular being by a transparent reflection which slowly gets more and more opaque. This is achieved using a WHITE image where the transparency increases as you move down the texture.		\| Specifies a diffuse texture which is "modulated" or multiplied with the texture in order to give specific effects, such as making the image gain transparency, or tint it in various ways. As it's applied per-pixel, many effects are possible, the most popular being by a transparent reflection which slowly gets more and more opaque. This is achieved using a WHITE image where the transparency increases as you move down the texture.
	\|- ~~{{gotham row}}~~		\|-
	\| '''colordiffuse'''		\| '''colordiffuse'''
	\| This specifies the color to be used for the texture basis. It's in hex AARRGGBB format. If you define <code><texture colordiffuse="FFFFAAFF">texture.png</texture></code> (magenta), the image will be given a magenta tint when rendered. You can also specify this as a name from the [[Colour Themes\|colour theme]] or you can also use $VAR and $INFO for dynamic values.		\| This specifies the color to be used for the texture basis. It's in hex AARRGGBB format. If you define <code><texture colordiffuse="FFFFAAFF">texture.png</texture></code> (magenta), the image will be given a magenta tint when rendered. You can also specify this as a name from the [[Colour Themes\|colour theme]] or you can also use $VAR and $INFO for dynamic values.
	~~'''(v13 Gotham addition)'''~~
	\|}		\|}

Ronie: /* Attributes of the texture tags */

2015-05-11T00:29:09Z

Attributes of the texture tags

← Older revision		Revision as of 00:29, 11 May 2015
Line 22:		Line 22:
	\| '''flipy'''		\| '''flipy'''
	\| Specifies that the texture should be flipped in the vertical direction. Useful for reflections.		\| Specifies that the texture should be flipped in the vertical direction. Useful for reflections.
	\|-
	~~\| '''align'''~~
	~~\| Specifies that the texture should be aligned in the horizontal direction. Valid values are "left" "right "center".~~
	\|-
	~~\| '''aligny'''~~
	~~\| Specifies that the texture should be aligned in the Vertical direction. Valid values are "top" "bottom" "center".~~
	\|-		\|-
	\| '''background'''		\| '''background'''

NedBot: Bot: Automated text replacement (- XBMC + Kodi )

2015-05-04T08:54:35Z

Bot: Automated text replacement (- XBMC + Kodi )

← Older revision		Revision as of 08:54, 4 May 2015
Line 2:		Line 2:
	For the <texture> tags, and for all <texture> tags in other controls, there is a small set of rules that you should follow if at all possible:		For the <texture> tags, and for all <texture> tags in other controls, there is a small set of rules that you should follow if at all possible:
	==== Size ====		==== Size ====
	Images should be as close as possible to the nearest highest power of 2 in width and height. The reason for this is ~~XBMC~~ uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.xpr file. Note that the image does not need to be square, and will not be scaled into a power of 2 size. Rather, any pixels outside of a power of two size will simply be dead space (wasted memory). If you cannot manage this, then XBMCTex will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels in the horizontal, but has no restrictions in the vertical direction. These are '''slightly''' slower to load and render, but for the most part there's not a lot of difference. The XBMCTex program that does the image injection into Textures.xpr will tell you what format it's using, and how much pixel wastage (memory waste) is contained in each image.		Images should be as close as possible to the nearest highest power of 2 in width and height. The reason for this is Kodi uses swizzled textures which are quicker to render and quicker to load once they're compressed into the Textures.xpr file. Note that the image does not need to be square, and will not be scaled into a power of 2 size. Rather, any pixels outside of a power of two size will simply be dead space (wasted memory). If you cannot manage this, then XBMCTex will opt for a linear (non-swizzled) texture format which must be aligned to 64 pixels in the horizontal, but has no restrictions in the vertical direction. These are '''slightly''' slower to load and render, but for the most part there's not a lot of difference. The XBMCTex program that does the image injection into Textures.xpr will tell you what format it's using, and how much pixel wastage (memory waste) is contained in each image.

	==== Formats ====		==== Formats ====