Plugin:TabSRMM/Skinning - Revision history

Dart Raiden at 23:07, 27 October 2022

2022-10-27T23:07:51Z

← Older revision		Revision as of 02:07, 28 October 2022
Line 65:		Line 65:
	</translate>		</translate>

	[[Category:Tutorials]]		[[Category:Tutorials{{#translation:}}\|{{#getdisplaytitle:{{FULLPAGENAME}}}}]]

Dart Raiden at 23:39, 26 September 2022

2022-09-26T23:39:11Z

← Older revision		Revision as of 02:39, 27 September 2022
Line 4:		Line 4:
	Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements:		Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements:
	* images (supported are PNG images in 32-bit RGBA format only, this allows full per-pixel alpha blending)		* images (supported are PNG images in 32-bit RGBA format only, this allows full per-pixel alpha blending)
	* a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format.		* a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known <tt>.ini</tt> format.

	<!--T:2-->		<!--T:2-->
Line 24:		Line 24:

	<!--T:8-->		<!--T:8-->
	{{Plugin\|IEView}} is a very popular plugin for Miranda. When it is used and active for a message window, it will replace the default message log. Consequently, TabSRMM themes will not work when IEView is in use. Read the page about the [[../History\|message history]] for further information. Skins will however continue to work, because IEView only replaces the message log area but not the entire message window.		{{Plugin\|IEView}} is a very popular plugin for Miranda. When it is used and active for a message window, it will replace the default message log. Consequently, TabSRMM themes will not work when IEView is in use. Read the page about the [[Plugin:TabSRMM/History\|message history]] for further information. Skins will however continue to work, because IEView only replaces the message log area but not the entire message window.

	<!--T:9-->		<!--T:9-->
Line 39:		Line 39:
	* the status bar background		* the status bar background
	* the status bar panels (the content rectangles which hold the text or icons)		* the status bar panels (the content rectangles which hold the text or icons)
	* the surrounding regions of the 2 text areas ([[../History\|message history]] and message input area)		* the surrounding regions of the 2 text areas ([[Plugin:TabSRMM/History\|message history]] and message input area)

	<!--T:12-->		<!--T:12-->
Line 45:		Line 45:

	<!--T:13-->		<!--T:13-->
	The skin definition is plain text file and uses the .~~INI~~ format. You can use any text editor you want to edit skins. The only valid file name extension is .tsk.		The skin definition is plain text file and uses the <tt>.ini</tt> format. You can use any text editor you want to edit skins. The only valid file name extension is .tsk.

	<!--T:14-->		<!--T:14-->
Line 56:		Line 56:

	<!--T:17-->		<!--T:17-->
	Refer to [[../Using_skins\|installing and loading skins]].		Refer to [[Plugin:TabSRMM/Using_skins\|installing and loading skins]].

	== See also == <!--T:18-->		== See also == <!--T:18-->

	<!--T:19-->		<!--T:19-->
	* [[../Skinning_format\|The skin definition format]] – for skin developers		* [[Plugin:TabSRMM/Skinning_format\|The skin definition format]] – for skin developers
	* [[../Color_themes\|Using color themes]] – alternative to skins, easier to customize with fewer possibilities		* [[Plugin:TabSRMM/Color_themes\|Using color themes]] – alternative to skins, easier to customize with fewer possibilities
	</translate>		</translate>

	[[Category:Tutorials]]		[[Category:Tutorials]]

Dart Raiden at 22:47, 26 September 2022

2022-09-26T22:47:21Z

← Older revision		Revision as of 01:47, 27 September 2022
Line 42:		Line 42:

	<!--T:12-->		<!--T:12-->
	A skin definition can also load a ~~'''~~.tabsrmm~~'''~~ theme definition file which contains font style and color definition for both the message history log and the input area. So it is possible, to load a complete skin by just loading a single file. Skins can be changed at runtime and it is possible to reload the currently selected skin which makes it easier for skin developers to preview their work. However, to load or reload a skin definition, all message windows must be closed.		A skin definition can also load a <tt>.tabsrmm</tt> theme definition file which contains font style and color definition for both the message history log and the input area. So it is possible, to load a complete skin by just loading a single file. Skins can be changed at runtime and it is possible to reload the currently selected skin which makes it easier for skin developers to preview their work. However, to load or reload a skin definition, all message windows must be closed.

	<!--T:13-->		<!--T:13-->
Line 48:		Line 48:

	<!--T:14-->		<!--T:14-->
	Image path names are ~~'''RELATIVE'''~~ to the directory in which the skin file is located. The best way is to put all images and the skin definition file into a single directory.		Image path names are relative to the directory in which the skin file is located. The best way is to put all images and the skin definition file into a single directory.

	<!--T:15-->		<!--T:15-->
	The same applies to the theme file (.tabsrmm theme) – it has to be placed in the skin directory and the filename must be given without a path.		The same applies to the theme file (<tt>.tabsrmm</tt> theme) – it has to be placed in the skin directory and the filename must be given without a path.

	== How to load a skin definition == <!--T:16-->		== How to load a skin definition == <!--T:16-->

Dart Raiden at 22:46, 26 September 2022

2022-09-26T22:46:36Z

← Older revision		Revision as of 01:46, 27 September 2022
Line 19:		Line 19:
	<!--T:6-->		<!--T:6-->
	* Themes are files with the extension <tt>.tabsrmm</tt>. They can be manually written, but the preferred method is to use the '''export message log settings''' feature of TabSRMM. This will collect and export all settings which compose a theme and save them to a <tt>.tabsrmm</tt> file. Such a file can later be imported again.		* Themes are files with the extension <tt>.tabsrmm</tt>. They can be manually written, but the preferred method is to use the '''export message log settings''' feature of TabSRMM. This will collect and export all settings which compose a theme and save them to a <tt>.tabsrmm</tt> file. Such a file can later be imported again.
	* Skin definition files have the extension ~~'''~~.tsk~~'''~~ and basically they define the rules how the various user interface elements should look like. A skin can optionally include a theme which will be imported when the skin is loaded. This allows users to create a complete customization pack, consisting of a skin and a matching theme.		* Skin definition files have the extension <tt>.tsk</tt> and basically they define the rules how the various user interface elements should look like. A skin can optionally include a theme which will be imported when the skin is loaded. This allows users to create a complete customization pack, consisting of a skin and a matching theme.

	== Skins, themes and how they work with other plugins like IEView == <!--T:7-->		== Skins, themes and how they work with other plugins like IEView == <!--T:7-->

Dart Raiden at 22:46, 26 September 2022

2022-09-26T22:46:16Z

← Older revision		Revision as of 01:46, 27 September 2022
Line 18:		Line 18:

	<!--T:6-->		<!--T:6-->
	* Themes are files with the extension ~~'''~~.tabsrmm~~'''~~. They can be manually written, but the preferred method is to use the '''export message log settings''' feature of TabSRMM. This will collect and export all settings which compose a theme and save them to a ~~'''~~.tabsrmm~~'''~~ file. Such a file can later be imported again.		* Themes are files with the extension <tt>.tabsrmm</tt>. They can be manually written, but the preferred method is to use the '''export message log settings''' feature of TabSRMM. This will collect and export all settings which compose a theme and save them to a <tt>.tabsrmm</tt> file. Such a file can later be imported again.
	* Skin definition files have the extension '''.tsk''' and basically they define the rules how the various user interface elements should look like. A skin can optionally include a theme which will be imported when the skin is loaded. This allows users to create a complete customization pack, consisting of a skin and a matching theme.		* Skin definition files have the extension '''.tsk''' and basically they define the rules how the various user interface elements should look like. A skin can optionally include a theme which will be imported when the skin is loaded. This allows users to create a complete customization pack, consisting of a skin and a matching theme.

Dart Raiden at 22:45, 26 September 2022

2022-09-26T22:45:35Z

← Older revision		Revision as of 01:45, 27 September 2022
Line 3:		Line 3:
	<!--T:1-->		<!--T:1-->
	Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements:		Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements:
	* images (supported are PNG images in ~~32bit~~ RGBA format only, this allows full per-pixel alpha blending)		* images (supported are PNG images in 32-bit RGBA format only, this allows full per-pixel alpha blending)
	* a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format.		* a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format.

Dart Raiden: Marked this version for translation

2022-09-25T17:22:31Z

Marked this version for translation

← Older revision		Revision as of 20:22, 25 September 2022
Line 1:		Line 1:
	<languages/>		<languages/>
	<translate>		<translate>
			<!--T:1-->
	Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements:		Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements:
	* images (supported are PNG images in 32bit RGBA format only, this allows full per-pixel alpha blending)		* images (supported are PNG images in 32bit RGBA format only, this allows full per-pixel alpha blending)
	* a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format.		* a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format.

			<!--T:2-->
	Typically, all files must be placed into a single directory. There are basically no restrictions where to put the files, but because the skinning engine is only using relative paths, the images must be at or below the folder in which the skin definition file is placed. The basic rule of '''one skin per physical directory''' is important to understand. You cannot mix files from 2 different skin within the same directory.		Typically, all files must be placed into a single directory. There are basically no restrictions where to put the files, but because the skinning engine is only using relative paths, the images must be at or below the folder in which the skin definition file is placed. The basic rule of '''one skin per physical directory''' is important to understand. You cannot mix files from 2 different skin within the same directory.

			<!--T:3-->
	Advanced skinning techniques allow to use only a single image file. Skin elements are then created by "extracting" rectangular areas from that image file.		Advanced skinning techniques allow to use only a single image file. Skin elements are then created by "extracting" rectangular areas from that image file.

	== Themes vs. skins ==		== Themes vs. skins == <!--T:4-->

			<!--T:5-->
	One thing a user should understand is the difference between a theme and a skin. A theme is a set of font-, template- and color definitions which determine the look and layout of the text areas inside the message window. A theme does not alter the look of other message window elements, like title bar, buttons or the status bar.		One thing a user should understand is the difference between a theme and a skin. A theme is a set of font-, template- and color definitions which determine the look and layout of the text areas inside the message window. A theme does not alter the look of other message window elements, like title bar, buttons or the status bar.

			<!--T:6-->
	* Themes are files with the extension '''.tabsrmm'''. They can be manually written, but the preferred method is to use the '''export message log settings''' feature of TabSRMM. This will collect and export all settings which compose a theme and save them to a '''.tabsrmm''' file. Such a file can later be imported again.		* Themes are files with the extension '''.tabsrmm'''. They can be manually written, but the preferred method is to use the '''export message log settings''' feature of TabSRMM. This will collect and export all settings which compose a theme and save them to a '''.tabsrmm''' file. Such a file can later be imported again.
	* Skin definition files have the extension '''.tsk''' and basically they define the rules how the various user interface elements should look like. A skin can optionally include a theme which will be imported when the skin is loaded. This allows users to create a complete customization pack, consisting of a skin and a matching theme.		* Skin definition files have the extension '''.tsk''' and basically they define the rules how the various user interface elements should look like. A skin can optionally include a theme which will be imported when the skin is loaded. This allows users to create a complete customization pack, consisting of a skin and a matching theme.

	== Skins, themes and how they work with other plugins like IEView ==		== Skins, themes and how they work with other plugins like IEView == <!--T:7-->

			<!--T:8-->
	{{Plugin\|IEView}} is a very popular plugin for Miranda. When it is used and active for a message window, it will replace the default message log. Consequently, TabSRMM themes will not work when IEView is in use. Read the page about the [[../History\|message history]] for further information. Skins will however continue to work, because IEView only replaces the message log area but not the entire message window.		{{Plugin\|IEView}} is a very popular plugin for Miranda. When it is used and active for a message window, it will replace the default message log. Consequently, TabSRMM themes will not work when IEView is in use. Read the page about the [[../History\|message history]] for further information. Skins will however continue to work, because IEView only replaces the message log area but not the entire message window.

			<!--T:9-->
	Similarly, when using {{Plugin\|HistoryPP\|History++}} to display the message history, the same applies.		Similarly, when using {{Plugin\|HistoryPP\|History++}} to display the message history, the same applies.

	== Which elements are skinable? ==		== Which elements are skinable? == <!--T:10-->

			<!--T:11-->
	* tabs (and the tab page itself)		* tabs (and the tab page itself)
	* the container background		* the container background
Line 33:		Line 41:
	* the surrounding regions of the 2 text areas ([[../History\|message history]] and message input area)		* the surrounding regions of the 2 text areas ([[../History\|message history]] and message input area)

			<!--T:12-->
	A skin definition can also load a '''.tabsrmm''' theme definition file which contains font style and color definition for both the message history log and the input area. So it is possible, to load a complete skin by just loading a single file. Skins can be changed at runtime and it is possible to reload the currently selected skin which makes it easier for skin developers to preview their work. However, to load or reload a skin definition, all message windows must be closed.		A skin definition can also load a '''.tabsrmm''' theme definition file which contains font style and color definition for both the message history log and the input area. So it is possible, to load a complete skin by just loading a single file. Skins can be changed at runtime and it is possible to reload the currently selected skin which makes it easier for skin developers to preview their work. However, to load or reload a skin definition, all message windows must be closed.

			<!--T:13-->
	The skin definition is plain text file and uses the .INI format. You can use any text editor you want to edit skins. The only valid file name extension is .tsk.		The skin definition is plain text file and uses the .INI format. You can use any text editor you want to edit skins. The only valid file name extension is .tsk.

			<!--T:14-->
	Image path names are '''RELATIVE''' to the directory in which the skin file is located. The best way is to put all images and the skin definition file into a single directory.		Image path names are '''RELATIVE''' to the directory in which the skin file is located. The best way is to put all images and the skin definition file into a single directory.

			<!--T:15-->
	The same applies to the theme file (.tabsrmm theme) – it has to be placed in the skin directory and the filename must be given without a path.		The same applies to the theme file (.tabsrmm theme) – it has to be placed in the skin directory and the filename must be given without a path.

	== How to load a skin definition ==		== How to load a skin definition == <!--T:16-->

			<!--T:17-->
	Refer to [[../Using_skins\|installing and loading skins]].		Refer to [[../Using_skins\|installing and loading skins]].

	== See also ==		== See also == <!--T:18-->

			<!--T:19-->
	* [[../Skinning_format\|The skin definition format]] – for skin developers		* [[../Skinning_format\|The skin definition format]] – for skin developers
	* [[../Color_themes\|Using color themes]] – alternative to skins, easier to customize with fewer possibilities		* [[../Color_themes\|Using color themes]] – alternative to skins, easier to customize with fewer possibilities

Dart Raiden: Created page with " Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements: * images (supported are PNG images in 32bit RGBA format only, this allows full per-pixel alpha blending) * a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format. Typically..."

2022-09-25T17:22:23Z

Created page with "<languages/> <translate> Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements: * images (supported are PNG images in 32bit RGBA format only, this allows full per-pixel alpha blending) * a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format. Typically..."

New page

<languages/>
<translate>
Beginning with version 1.0, TabSRMM introduced a simple skinning engine. This allows the user to customize the look of the entire message window by using a skin. Usually, a skin consists of the following elements:
* images (supported are PNG images in 32bit RGBA format only, this allows full per-pixel alpha blending)
* a skin definition file. This is an ordinary plain text file. The syntax is compatible with the well-known .ini format.

Typically, all files must be placed into a single directory. There are basically no restrictions where to put the files, but because the skinning engine is only using relative paths, the images must be at or below the folder in which the skin definition file is placed. The basic rule of '''one skin per physical directory''' is important to understand. You cannot mix files from 2 different skin within the same directory.

Advanced skinning techniques allow to use only a single image file. Skin elements are then created by "extracting" rectangular areas from that image file.

== Themes vs. skins ==

One thing a user should understand is the difference between a theme and a skin. A theme is a set of font-, template- and color definitions which determine the look and layout of the text areas inside the message window. A theme does not alter the look of other message window elements, like title bar, buttons or the status bar.

* Themes are files with the extension '''.tabsrmm'''. They can be manually written, but the preferred method is to use the '''export message log settings''' feature of TabSRMM. This will collect and export all settings which compose a theme and save them to a '''.tabsrmm''' file. Such a file can later be imported again.
* Skin definition files have the extension '''.tsk''' and basically they define the rules how the various user interface elements should look like. A skin can optionally include a theme which will be imported when the skin is loaded. This allows users to create a complete customization pack, consisting of a skin and a matching theme.

== Skins, themes and how they work with other plugins like IEView ==

{{Plugin|IEView}} is a very popular plugin for Miranda. When it is used and active for a message window, it will replace the default message log. Consequently, TabSRMM themes will not work when IEView is in use. Read the page about the [[../History|message history]] for further information. Skins will however continue to work, because IEView only replaces the message log area but not the entire message window.

Similarly, when using {{Plugin|HistoryPP|History++}} to display the message history, the same applies.

== Which elements are skinable? ==

* tabs (and the tab page itself)
* the container background
* the info panel background
* the window frame and title bar
* the title buttons
* the status bar background
* the status bar panels (the content rectangles which hold the text or icons)
* the surrounding regions of the 2 text areas ([[../History|message history]] and message input area)

A skin definition can also load a '''.tabsrmm''' theme definition file which contains font style and color definition for both the message history log and the input area. So it is possible, to load a complete skin by just loading a single file. Skins can be changed at runtime and it is possible to reload the currently selected skin which makes it easier for skin developers to preview their work. However, to load or reload a skin definition, all message windows must be closed.

The skin definition is plain text file and uses the .INI format. You can use any text editor you want to edit skins. The only valid file name extension is .tsk.

Image path names are '''RELATIVE''' to the directory in which the skin file is located. The best way is to put all images and the skin definition file into a single directory.

The same applies to the theme file (.tabsrmm theme) – it has to be placed in the skin directory and the filename must be given without a path.

== How to load a skin definition ==

Refer to [[../Using_skins|installing and loading skins]].

== See also ==

* [[../Skinning_format|The skin definition format]] – for skin developers
* [[../Color_themes|Using color themes]] – alternative to skins, easier to customize with fewer possibilities
</translate>

[[Category:Tutorials]]