Comment créer un Skin

16.10.2009

I) Les Ustensiles

Il vous faudra un logiciel de retouche d'image, pour cela je propose Paint.NET (prononcez PaintDotNet), gratuit et simple mais nécessite d'avoir installer .NET FrameWork qui lui est long à installer...
Le petit Paint, qui parfois est très utile!
Un resizer d'image peut s'avérer pratique.
La dernière version de MoonShell pour pouvoir utiliser les fichier d'un skin existant.
L'indispensable bloc note, pour les codes RGB.
Et pis un générateur de code RGB bien pratique.
Une banque de sons pour modifier le son de démarage (pour prendre un son : clique droit, enregistrer la cible sous...)

Maintenant, les ingrédients :
Prenez une idée,
Les images associées à cette idée,
Un peu de créativité,
Du courage,
et du temps!

Méthode :

La fabrication d'un skin consiste à modifier le fichier skin.ini de façon à changer les codes RGB (couleur) correspondant aux paramètres (couleur de fond, de polices...). On peut aussi créer des images, selon certaines restrictions (taille, couleurs et extension de fichier) afin de créer un skin plus personalisé. On peut même changer le fichier startup.mp3 afin de changer le son de démarage.

II) Modification du fichier skin.ini

Tout d'abord allez dans le dossier skin de MoonShell pour récupérer le fichier Skin.ini, ouvrez-le avec le bloc note et modifiez les codes RGB en vous aidant du générateur de code RGB .
Voici à quoi correspondent ces valeurs :

Citation:

DesktopBG : couleur du fond de l'écran inférieur

TitleA_Bright : couleur des barres de gauche et du haut encadrant la barre de titre de la fenêtre active
TitleA_Dark : couleur des barres du bas et de droite encadrant la barre de titre de la fenêtre active
TitleA_BG : couleur du fond de la barre de titre de fenêtre active
TitleA_Text : couleur de la police de la barre de titre de fenêtre active
TitleA_TextShadow : couleur de l'ombre de la police de la barre de titre de fenêtre active

TitleD_Bright : couleur des barres de gauche et du haut encadrant la barre de titre de la fenêtre inactive
TitleD_Dark : couleur des barres du bas et de droite encadrant la barre de titre de la fenêtre inactive
TitleD_BG= : couleur du fond de la barre de titre de fenêtre inactive
TitleD_Text : couleur de la police de la barre de titre de fenêtre active

ScrollBar : couleur de la barre de défilement

FrameBright : couleur des barres de gauche et du haut encadrant la fenêtre de sélection de fichier
FrameDark : couleur des barres du bas et de droite encadrant la fenêtre de sélection de fichier

ClientBG : couleur de fond de la barre d'options de lecture (volume, piste suivante...) et des fenêtres de renseignements

d'ID3Tag...
ClientText : couleur de police de la barre d'options de lecture (volume, piste suivante...) et des fenêtres de renseignements

ID3Tag...

FileSelectBG : couleur du fond de la fenêtre de sélection de fichier
FileSelectText : couleur de la police de la fenêtre de sélection de fichier
FileSelectCursor : couleur du curseur de la fenêtre de sélection de fichier
FileSelectPlay : couleur du fichier en cours de lecture de la fenêtre de sélection de fichier

TextViewBG : couleur du fond de la fenêtre de lecture de fichiers texte
TextViewText : couleur de la police de la fenêtre de lecture de fichiers texte

ProgressEnd : couleur de la barre de progression de lecture de fichier audio (durée écoulée)
ProgressLast : couleur de la barre de progression de lecture de fichier audio (durée restante)

III) Remplacement de certaines parties du skin.

Citation:

c_file.bmp : 256x192 pixels au format Bitmap 24Bits. Correspond à l'image affiché en fond de la fenêtre de sélection de fichier.

c_text.bmp : 256x192 pixels au format Bitmap 24Bits. Correspond à l'image affiché en fond de la fenêtre de lecture de fichiers texte.

client.bmp : 256x192 pixels au format Bitmap 24Bits. Correspond à l'image affiché en fond de la barre d'options de lecture (volume, piste suivante...) et des fenêtres de renseignements ID3Tag...

desktop.bmp : 256x192 pixels au format Bitmap 24Bits. Correspond à l'image affiché en fond de l'écran inférieur.

prgbara.bmp : 256x16 pixels au format Bitmap 24Bits. Correspond la barre de progression de lecture de fichier audio (durée écoulée).

pgrbard.bmp : 256x16 pixels au format Bitmap 24Bits. Correspond la barre de progression de lecture de fichier audio (durée restante).

sb_bg.bmp : 8x8 pixels au format Bitmap 24Bits. Correspond au fond de la barre de défilement.

sb_body.bmp : 8x8 pixels au format Bitmap 24Bits. Correspond au motif de la barre de défilement.*

sb_part.bmp : 8x8 pixels au format Bitmap 24 Bits. Correspond aux extrémités de la barre de défilement.*

titlea.bmp : 256x16 pixels au format Bitmap 24Bits. Correspond à la barre de titre de la fenêtre active.

titled.bmp : 256x16 pixels au format Bitmap 24Bits. Correspond à la barre de titre de la fenêtre inactive.

Le fichier sb_body.bmp est mis bout à bout et le fichier sb_part.bmp est divisé deux (2 fois 8x4 pixels) et la partie

supérieur est placé en haut de la barre de défilement (ou à gauche pour les barres horizontales) et l'autre moitié est placé à l'autre bout de la barre.

Je vais juste détaillé la création de la barre de progression de lecture de fichier audio.

Annexe : Création de la barre de progression de lecture.

-Trouver une image (sur Google par exemple).
-Extraire une bande de 192x16 pixels (pensez aussi à prendre des barres verticalement, en faisant une rotation après, celà va de soi!).
-Ouvrez-la avec Paint.NET et ouvrez en parallèle le prgbara.bmp du skin WindowsLike de MoonShell.
-Observez les lignes plus foncés du prgbara.bmp et sélectionnez les lignes correspondantes sur VOTRE prgbara.bmp puis Calques/Réglages/Luminosités_contrastes et foncés les lignes pour donner une impréssion de relief.
-Répétez l'opération en modifiant à chaque fois la luminosité corespondant plus ou moins à celle du skin WindowsLike.
-Une fois fini, ouvrez une copie de votre fichier prgbara.bmp Calques/Réglages/Désaturation
-Enregistrez ce deuxième fichier sous prgbard.bmp
-Si c'est réussi, vous obtiendrez un bel effet de relief sur votre barre de progression de lecture.

Enfin, pour la finition, créer un petit preview.bmp en copiant les deux fichiers scrcap.bmp et scrcap.nds (ces deux fichiers sont dans le dossier "Skin image preview making tool" du dossier Skin de MoonShell) à la racine de votre CF/SD/EXFS. Il suffit ensuite de lancer scrcap.nds à partir de MoonShell. Surprise! scrcap.bmp est maintenant une capture d'écran de votre Skin!!

Merci M@cZéro pour ce Magnifique tutoriel !