Les Skins de Maxthon v2.0

De Wiki Francophone de Maxthon

Version: 2.0.4
Last Modified: 2006-07-25 5:21 PM


Vue d'ensemble

Le nouveau système de Skin de Maxthon est constitué de plusieurs fichiers image et d'un fichier texte.

Depuis la version 2.0, nous utilisons des fichiers PNG avec le support complet de la transparence ou des images de la barre d'outils & des autres éléments de l'interface.

Le fichier texte doit avoir l'extension INI. Et le fichier qui se nomme “mskin.ini” sera utilisé comme style par défaut de votre Skin.

Note : Sauvegardez le fichier INI au format Unicode(UTF-8).


Exigences des images

Nous recommendons aux auteurs de Skins d'utiliser le format PNG comme format d'image.

L'ancien format BMP est toujours supporté, mais nous vous recommandons de ne pas l'utiliser car le support du masque de la transparence des BMP n'est plus supporté


Conventions utilisées dans ce document

Mot-clé: Les mots-clé sont les noms des réglages et de ses propriétés. Sensible à la casse.
ex. Version ou version

Drapeau: Les drapeaux sont des alias prédéfinis pour certaines valeurs. Sensible à la casse.
ex. System

Chaîne: Le type de valeur le plus commun.
ex. Ceci est une chaîne

Nombre: Tous les nombres utilisés dans le fichier de définition du Skin sont des entiers.
ex. 32 et 16

Booléen: Représenté par un nombre 1 (Vrai) et 0 (Faux).
ex. 0 et 1

Valeur de couleur: La valeur de couleur peut être une couleur au format HEXA, des valeurs RGB séparées par des virgules et des noms de couleur système (Cf. [#_Supported_System_Color_Names Appendix: Supported System Color Names]).
ex. #FEFEFE ou 255,210,76 ou $COLOR_HIGHLIGHTTEXT


Structure du fichier INI d'un Skin

Le fichier INI est l'endroit où vous indiquez à Maxthon comment utiliser vos fichiers de skin. Vous pouvez construire votre propre Skin en suivant ce guide ou en modifiant un Skin existant.

Note : Si vous souhaitez utiliser des caractères auttres que ASCII, sauvegardez le fichier INI au format Unicode(UTF-8).

Vous trouverez ci-dessous la description détaillée des tous les éléments du fichier INI d'un Skin.


Section [General]

Cette section est utilisée comme une description sommaire de votre Skin.

Name=Maxthon Default Le nom de votre Skin
Version=1.0.1 Le numéro de version de votre Skin, utilisé pour tester les mises à jour
Le format est #.#.# où # est un entier entre 0-9
Style=Large Icon Sous style de votre Skin, utilisé pour des fichiers INI multiples (Optionnel)


Author=SiC Le nom de l'auteur de ce Skin (Optionnel)
Email=null@null.com L'adresse email de l'auteur (Optionnel)
Website=http://www.null.com/ Le site Web de l'auteur de ce Skin (Optionnel)
UpdateURL=http://www.null.com/skin/ L'adresse URL pour la mise à jour de ce Skin (Optionnel)
License=GPL Information sur la licence de ce Skin (Optionnel)

Section [Global]

Cette section est utilisée pour les réglages communs partagés entre les différents éléments.

BaseTheme=Custom Le thème de base de votre Skin. Les valeurs valides sont :
System – Thème standard de Windows avec le support de style visuel
Custom – Thème entièrement personnalisable
Office2000 – Thème Office 2000
OfficeXP - Thème Office XP
Office2003 – Thème Office 2003

Si vous utilisez un BaseTheme différent de Custom, seul les icônes et quelques parties spéciales des réglages du Skin seront affectées.


DefaultIconSize=24 24 La taille par défaut des images de la barre d'outils, utilisée dans quelques occasions spéciales.


CustomFrame=1 Active le style de frame personnalisable dans le mode No 'Window Frame'.
Ce réglage n'a qu'un effet lorsque BaseTheme=Custom.
CustomFrame.Width=3 La largeur de la fenêtre de la frame principale
CustomFrame.Style=Image Le style de la frame, peut être : GFill, Image (3Image n'est pas disponible pour cette propriété)
Lorsque que Image est définie, derrière la propriété CustomFrame.Image, l'extension de la propriété suivante doit être définie :
CustomFrame.CornerSize=6 La largeur et la hauteur de la taille de coupe du coin de l'image, les deux partagent la même valeur, en Pixel.
La valeur par défaut est .
CustomFrame.CornerRadius=6 Le rayon de courbure du coin de l'image, en Pixel.
La valeur par défaut est .


(Un exemple d'image devrait se trouver ici)

AnimateLoading=control/loading.png L'image de l'icône animée du chargement des menus.
Doit être une série d'images de 16x16 pixels.
La valeur par défaut est : pas d'icône.

Section [Icons]

Cette section contient une liste de toutes les images des icônes qui sont sur la barre d'outils principale.

Toutes les largeurs et les hauteurs des images peuvent être différentes. Maxthon utilisera la taille actuelle des fichiers images pour l'affichage.

Il y a plusieurs extension de propriétés qui peuvent être définies pour chaque icône :

.Hover=toolbar/hover/back.png Image pour l'icône survolé. Si définie, l'arrière plan de survole normal du bouton de la barre d'outils ne sera pas dessiné.
.Disable=toolbar/disable/back.png Image pour l'icône désactivé. N'a un effet que sur les icônes qui ont un état désactivé.
.Offset=0 8 Défini un excentrage de l'îcone par rapport à l'élément de la barre d'outils normale.
Le format de la valeur est XOffset YOffset , relatif au coin en haut à gauche.
.Padding=2 2 2 2 Défini le remplissage autour de l'image du bouton.
La taille de l'image+la taille de l'aire du remplissage=Taille du bouton final
Le format de la valeur est Haut droite bas gauche, comme les CSS.


Icônes communes :
Back=toolbar/32_back.png Navigation > Précédent
Forward=toolbar/32_forward.png Navigation > Suivant
HistoryMenu=toolbar\18_history.png Navigation > Menu historique
C'est une icône spéciale utilisée pour afficher le menu déroulant de l'historique pour Précédent/Suivant.
Générallement, elle est de plus petite taille pour économiser de l'espace.
Refresh=toolbar/32_refresh.png Navigation > Actualiser
Stop=toolbar/32_stop.png Navigation > Arrêter
Home=toolbar/32_home.png Navigation > Accueil
New=toolbar/32_new.png Navigation > Nouvel onglet
Undo=toolbar/32_undo.png Navigation > Annuler Fermer Page
Favorites=toolbar/32_favorites.png Affichage > Barre latérale > Favoris
Aussi la fenêtre des Favoris Ajouter/Supprimer
Feed=toolbar/32_feed.png Affichage > Barre latérale > Flux RSS
Aussi la fenêtre des flux RSS Ajouter/Supprimer
History=toolbar/32_history.png Affichage > Barre latérale > Historique (Optionnel)
Layout=toolbar/32_layout.png Affichage > Disposition
Le bouton de changement de disposition(Plein écran, etc.)
FontSize=toolbar/32_fontsize.png Affichage > Taille du texte (Optionnel)
Encoding=toolbar/32_encoding.png Affichage > Codage (Optionnel)
Zoom=toolbar/32_page_zoom.png Affichage > Zoom (Optionnel)
Proxy=toolbar/32_proxy.png Outils > Proxy
Tools=toolbar/32_tools.png Outils > Utilitaires
Plugins=toolbar/32_plugins.png Outils > Plugins
Security=toolbar/32_security.png Outils > Sécurité (Optionnel)
PageContent=toolbar/32_page_content.png Outils > Contrôle du contenu de la page (Optionnel)
Edit=toolbar/32_edit.png Outils > Editer la page (Optionnel)
Save=toolbar/32_save.png Fichier > Enregistrer sous (Optionnel)
Options=toolbar/32_options.png Outils > Options de Maxthon (Optionnel)

Si vous ne voulez pas afficher certaines icônes listées ci-dessus (comme les icône marquées Optionnel above), vous pouvez définir la valeur de l'image en 16x16.


Icônes spéciales :
TabOptions=control/tab_options.png Bouton de la barre d'onglet > Options de la barre d'onglets
TabToolbar=control/tab_toolbar.png Bouton de la barre d'onglet > Basculer la barre d'outils Web
TabSidebar=control/tab_sidebar.png Bouton de la barre d'onglet > Basculer la barre latérale
TabManager=control/tab_manager.png Bouton de la barre d'onglet > Gestionnaire des onglets
TabNew=control/tab_new.png Bouton de la barre d'onglet > Nouvel onglet


Contrôle des icônes d'une fenêtre sans frame :
SkinSelect=control\16_skin_selector.png Bouton de sélection des Skins
MenuMinimize=control\16_minimize.png Bouton de réduction de la fenêtre
MenuMaximum=control\16_maximum.png Bouton d'agrandissement de la fenêtre
MenuRestore=control\16_restore.png Bouton de restauration de la fenêtre
MenuClose=control\16_close.png Bouton de fermeture de la fenêtre


Section [Icon16]

Les icônes dans cette section sont utilisées dans différentes parties de l'interface de Maxthon.
La taille de chaque icône doit être de 16x16 pixels ou elle sera étirée.

Afin de conserver une présentation constante des petites icônes, l'.Offset et la propriété .Padding qui sont décrites dans la section [Icons] sont désactivés.


Icônes Communes (Obligatoire):
Back=toolbar/16_back.png Navigation > Précédent
Forward=toolbar/16_forward.png Navigation > Suivant
HistoryMenu=toolbar\16_history_menu.png Navigation > Menu historique
Refresh=toolbar/16_refresh.png Navigation > Actualiser
Stop=toolbar/16_stop.png Navigation > Arrêter
Home=toolbar/16_home.png Navigation > Accueil
New=toolbar/16_new.png Navigation > Nouvel onglet
Undo=toolbar/16_undo.png Navigation > Annuler fermer
Favorites=toolbar/16_favorites.png Affichage > Barre latérale > Favoris
Feed=toolbar/16_feed.png Affichage > Barre latérale > Flux RSS
History=toolbar/16_history.png Affichage > Barre latérale > Historique
Layout=toolbar/16_layout.png Affichage > Disposition
FontSize=toolbar/32_fontsize.png Affichage > Taille du texte
Encoding=toolbar/32_encoding.png Affichage > Codage
Zoom=toolbar/32_page_zoom.png Affichage > Zoom
Proxy=toolbar/16_proxy.png Outils > Proxy
Tools=toolbar/16_tools.png Outils > Utilitaires
Plugins=toolbar/16_plugins.png Outils > Plugins
Security=toolbar/16_security.png Outils > Sécurité
PageContent=toolbar/32_page_content.png Outils > Contrôle du contenu de la page
Edit=toolbar/32_edit.png Outils > Editer la page
Save=toolbar/32_save.png Fichier > Enregistrer sous
Options=toolbar/32_options.png Outils > Options de Maxthon


Icônes générales :
Page=toolbar/16_page.png L'icône par défaut pour la page et les liens.
(Gestionnaire des Favoris, Barre des Favoris, Menu des Favoris, etc.)
AddressBar=misc/16_page.png L'icône de la page par défaut sur la barre d'adresse. (Optionnel)
La même icône que Page par défaut.
DefaultTabIcon=misc/16_page.png L'icône de la page par défaut sur la barre la barre d'onglet. (Optionnel)
La même icône que Page par défaut.
Search=misc/16_search.png Icône du moteur de recherche (Menu déroulant de la boîte de recherche)
SearchBar=misc/16_search.png Icône du moteur de recherche par défaut sur la boîte de recherche. (Optionnel)
La même icône que Search par défaut.
FolderOpen=misc/16_folder_open.png Ouvrir un dossier
FolderClose=misc/16_folder_closed.png Fermer un dossier
Group=misc/16_group.png Groupe des Favoris
FeedChannel=misc/16_feed_channel.png Chaîne de flux
FeedItem=misc/16_feed_item.png Elément d'un flux
FeedItemEnclosure=misc/16_feed_item_enclosure.png Elément d'un flux avec inclusion
FeedDiscover=misc/16_feed_discover.png Icône d'un nouveau flux trouvé sur la barre d'adresse
Secure=misc/16_secure.png Icône de sécurité sur la barre d'adresse
Insecure=misc/16_secure.png Icône d'insécurité sur la barre d'adresse Non implémenté
Skin=misc/16_skin.png Icône par défaut du Skin
Plugin=misc/16_plugin.png Icône par défaut du Plugin


Icônes de fonctions :
Go=misc/16_go.png Bouton "Aller" sur la barre d'adresse
UpLevel=misc/16_up_level.png Bouton "vers le haut d'un niveau" sur la barre d'outils
HotFav=misc/16_hot_fav.png Bouton du menu déroulant "Favoris préférés" sur la barre des Favoris
Highlight=misc/16_highlight.png Bouton de "mise en surbrillance" sur la barre de recherche dans la page
Validate=misc/16_validate.png Validation (Tester les URL, Tester les Proxy)
ScriptError=misc/16_script_error.png Indicateur d'erreur de script sur la barre d'état
Profile=misc/16_profile.png Profil utilisateur
Collector=misc/16_collector.png Icône du Post'It sur la barre d'état
AdHunter=misc/16_adhunter.png Icône du tueur de pub sur la barre d'état


Icônes partagées :

Les icônes listées ci-dessous sont utilisées dans différente parties du programme, comme les info-bulles de la barre d'outils.

_Add=shared\16_add.png Ajouter
_Edit=shared\16_edit.png Editer
_Delete=shared\16_delete.png Supprimer
_Save=shared\16_save.png Enregistrer
_Refresh=shared\16_refresh.png Actualiser
_Options=shared\16_options.png Options
_Search=shared\16_search.png Rechercher
_View=shared\16_view.png Afficher bouton
_Execute=shared\16_execute.png Exécuter
_InProgress=shared\16_in_progress.png Indicateur En cours
_Stop=shared\16_stop.png Arrêter
_Question=shared\16_question.png Indicator Question
_dInfo=shared\16_info.png Indicateur Info
_Alert=shared\16_alert.png Indicateur Alerte
_Error=shared\16_error.png Indicateur Erreur
_OK=shared\16_ok.png Indicateur OK


Icônes de contrôle :
Caption=control\caption_icon.png Légende de l'icône dans le mode fenêtre compacte
CloseToolbar=shared\16_close.png Bouton Fermer sur la barre d'outils


Section [Colors]

Cette section définie les styles de couleur pour les boutons sur les barres d'outils, les menus, les panneaux.


Légendes des barrres :

Les réglages suivants ont seulement un effet dans le mode Frame des fenêtres personnalisées.

CaptionBar.Normal.Text=$COLOR_BTNTEXT Couleur du texte de la légende normale de la barre
CaptionBar.Inactive.Text=$COLOR_BTNTEXT Couleur du texte de la légende inactive de la barre


Barres d'outils :
ToolBar L'objet global pour les barres d'outils normale (Attachés)
FloatBar L'objet global pour les barres d'outils flottantes (Détachés)
FavBar L'object pour la barre des Favoris, utilise le style par défaut lorsque non défini (Optionnel)
WebBar L'object pour la barre des pages Web, utilise le style par défaut lorsque non défini (Optionnel)
StatusBar L'object pour la barre d'état, utilise le style par défaut lorsque non défini (Optionnel)


Tous les objects listés ci-dessus peuvent avoir les attributs suivants :

Toolbar.Normal.Text=#000000
Couleur normale pour le texte de la barre d'outils
Toolbar.Disable.Text=#000000 Couleur désactivée pour le texte de la barre d'outils
Toolbar.Gripper.Style=Dashed

Style des gripper de la barre d'outils Non implémenté
[#_Global_Style_Flags Cf. Appendix : Global Style Flags]

Toolbar.Separator.Style=Solid

Style des séparateur de la barre d'outils Non implémenté
[#_Global_Style_Flags Cf. Appendix: Global Style Flags]

Toolbar.Hover.Text=#000000 Texte du bouton survolé
Toolbar.Hover.Border=#83B8F3 Bord du bouton survolé
Toolbar.Hover.Start=#C9E0FA Couleur du début du dégradé du fond du bouton survolé
Toolbar.Hover.End=#83B8F3 Couleur de fin du dégradé du fond du bouton survolé
Toolbar.Checked.Text=#000000 Comme ci-dessus, pour un bouton coché Non implémenté
Toolbar.Checked.Border=#83B8F3 Comme ci-dessus, pour un bouton coché Non implémenté
Toolbar.Checked.Start=#E9DCD0 Comme ci-dessus, pour un bouton coché Non implémenté
Toolbar.Checked.End=#A3A0A0 Comme ci-dessus, pour un bouton coché Non implémenté
Toolbar.Pressed.Text=#000000 Comme ci-dessus, pour un bouton enfoncé
Toolbar.Pressed.Border=#83B8F3 Comme ci-dessus, pour un bouton enfoncéNon implémenté
Toolbar.Pressed.Start=#E9DCD0 Comme ci-dessus, pour un bouton enfoncé
Toolbar.Pressed.End=#A3A0A0 Comme ci-dessus, pour un bouton enfoncé


Barre des menus :
Menu.Normal.Text=#000000 Couleur du texte des éléments du menu normal
Menu.Disable.Text=#000000 Couleur du texte de l'élément du menu désactivé
Menu.Border=#999999 Couleur de la bordure du menu Non implémenté
Menu.Separator.Style=Solid

Style du séparateur du menu Non implémenté
[#_Global_Style_Flags See Appendix: Global Style Flags]

Menu.Hover.Text=#000000 Texte de l'élément du menu survolé
Menu.Hover.Border=#000000 Bordure de l'élément du menu survolé
Menu.Hover.Start=#C9E0FA Couleur de début du dégradé du fond de l'élément du menu survolé
Menu.Hover.End=#83B8F3 Couleur de la fin du dégradé du fond de l'élément du menu survolé
Menu.Checked.Text=#000000 Comme ci-dessus, pour les cases à cocher des élément du menu Non implémenté
Menu.Checked.Border=#000000 Comme ci-dessus, pour les cases à cocher des élément du menu Non implémenté
Menu.Checked.Start=#E9DCD0 Comme ci-dessus, pour les cases à cocher des élément du menu Non implémenté
Menu.Checked.End=#A3A0A0 Comme ci-dessus, pour les cases à cocher des élément du menu Non implémenté


Onglets :
Tab L'object pour les onglets de la barre d'onglets
SidebarTab L'object pour les onglets de la barre latérale


Tous les objects listés ci-dessus peuvent avoir les attributs suivants :

Tab.Normal.Text=$COLOR_BTNTEXT Couleur du texte de l'onglet normal
Tab.Hover.Text=$COLOR_HOTLIGHT Couleur du texte de l'onglet survolé
Tab.Active.Text=$COLOR_BTNTEXT Couleur du texte de l'onglet actif


Base de connaissances de Maxthon 2.0