Aspect Ratio: Difference between revisions

From Official Kodi Wiki
Jump to navigation Jump to search
>Jmarshall
>Jmarshall
Line 9: Line 9:


The values allowed for the aspect ratio are keep, stretch, scale, and center.  These do the following:
The values allowed for the aspect ratio are keep, stretch, scale, and center.  These do the following:
 
In addition to the [[Default_Control_Tags|default control tags]], the following tags are available.  Note that each tag is '''lower case only.''' This is important, as xml tags are case-sensitive.
keep Aspect ratio will be kept, and the image will be scaled down or up so that it fits inside the box, with transparent bars either side if the ratios are not the same.
{| class="dtable"
stretch Aspect ratio is not kept - the image will be stretched so that it exactly fits the box.
|- class="userrow"
scale Aspect ratio is kept, and the image is scaled up so that it fills the box, with any portions that lie outside the box being cropped off.
| class="usercell" | '''keep'''
center Aspect ratio is kept, and the image is left unscaled, centered within the box.  It may be cropped if the image is larger than the box, or may have a transparent border if the image is smaller than the box.
| class="usercell" | Aspect ratio will be kept, and the image will be scaled down or up so that it fits inside the box, with transparent bars either side if the ratios are not the same.
|- class="userrow"
| class="usercell" | '''stretch'''
| class="usercell" | Aspect ratio is not kept - the image will be stretched so that it exactly fits the box.
|- class="userrow"
| class="usercell" | '''scale'''
| class="usercell" | Aspect ratio is kept, and the image is scaled up so that it fills the box, with any portions that lie outside the box being cropped off.
|- class="userrow"
| class="usercell" | '''center'''
| class="usercell" | Aspect ratio is kept, and the image is left unscaled, centered within the box.  It may be cropped if the image is larger than the box, or may have a transparent border if the image is smaller than the box.
|}


The align attributes specify how the image is positioned within the box.  The default is to align to center in both directions.
The align attributes specify how the image is positioned within the box.  The default is to align to center in both directions.
Line 20: Line 30:


The image below shows the various combinations.  The aspect ratios are from left to right: keep, scale, stretch, center.  The top images use scalediffuse="true" and the lower images use scalediffuse="false".
The image below shows the various combinations.  The aspect ratios are from left to right: keep, scale, stretch, center.  The top images use scalediffuse="true" and the lower images use scalediffuse="false".
[[Image:Example.jpg]]
[[category:Skin Development]]

Revision as of 08:16, 5 October 2009

Aspect ratio for Image and MultiImage controls

The <aspectratio> tag allows the aspect ratio of images (and multiimages) to be defined, and in addition, on how the image should be aligned within the standard <width>,<height> box.

The tag format is: <xml>

 <aspectratio scalediffuse="false" align="left" aligny="top">keep</aspectratio>

</xml>

The values allowed for the aspect ratio are keep, stretch, scale, and center. These do the following: In addition to the default control tags, the following tags are available. Note that each tag is lower case only. This is important, as xml tags are case-sensitive.

keep Aspect ratio will be kept, and the image will be scaled down or up so that it fits inside the box, with transparent bars either side if the ratios are not the same.
stretch Aspect ratio is not kept - the image will be stretched so that it exactly fits the box.
scale Aspect ratio is kept, and the image is scaled up so that it fills the box, with any portions that lie outside the box being cropped off.
center Aspect ratio is kept, and the image is left unscaled, centered within the box. It may be cropped if the image is larger than the box, or may have a transparent border if the image is smaller than the box.

The align attributes specify how the image is positioned within the box. The default is to align to center in both directions.

Finally, the scalediffuse="false" attribute means the diffuse texture is not scaled to the image size. i.e. the diffuse image effectively uses aspectratio stretch in this case. This is especially useful when using the diffuse image to trim the main image in a particular way, such as to round off the corners. The default is scalediffuse="true".

The image below shows the various combinations. The aspect ratios are from left to right: keep, scale, stretch, center. The top images use scalediffuse="true" and the lower images use scalediffuse="false". Example.jpg