[THEMES] Modifier un thème EMUI

flippy12 · 13 janvier 2014

Introduction

J'alimenterai au fur et à mesure le sujet, je ferai peut-être le ménage si le sujet est trop brouillon, ...

Le but de ce sujet est de vous expliquer comment fabriquer un thème pour les ROM de Huawei: EMUI.

Je suis loin d’avoir décrit toutes les possibilités de modifications possibles, je ne les ai pas encore toutes testé (quoi que j’en ai testé beaucoup).

Un thème permet de modifier l’apparence de votre téléphone, c'est-à-dire des fonds d’écrans, des sons, des icônes, de la couleur, du look du système, …

Avec l’interface EMUI que l’on trouve sur les Huawei, on peut appliquer un thème par l’application Thème intégrée dans la ROM officielle (et dans beaucoup de ROM alternative)

Avertissement

Je ne suis pas responsable des modifications que vous ferez sur votre téléphone, ni des erreurs de manipulation de thèmes qui pourraient entraîner l’affichage d’erreurs sur votre téléphone.

Je ne suis pas non plus responsable des fautes de goût, qui pourraient voir créer des thèmes aux éléments sans queue ni tête, avec des icônes farfelues, ou des couleurs trop flashy :P .

Remarque: ne publier pas vos thèmes ici, vous avez un sujet dédié pour les thèmes : https://forum.frandroid.com/topic/179409-themes-emui-et-autres/

Ici, le but sera de tenter de rassembler le maximum d’info sur la personnalisation EMUI, et de répondre aux éventuels questions et problèmes.

Application thème

L’application Thème vous permet de consulter les thèmes qui sont déjà en local (Onglet de gauche), ou les thèmes qui sont disponible sur le site de Huawei (Onglet de droite).

En sélectionnant un thème, vous pourrez consulter le détail du détail, et quelques écrans de présentation du thème. Vous pouvez alors l’appliquer sur votre téléphone.

Vous pouvez même mixer des éléments de plusieurs thèmes. Après avoir appliqué un thème, utiliser le bouton Personnaliser pour accéder aux différents éléments de personnalisation, vous pourrez alors utiliser un thème différent pour le type d’écran de verrouillage, le fond d’écran du bureau, le fond d’écran de verrouillage, les icônes et menus, …

(je suis en version anglaise dans le thème, mais rassurez-vous, le votre est probablement en français)

Un thème peut contenir l’ensemble des personnalisations possibles, ou juste une partie (ex : les icônes uniquement).

Pour vous expliquer ce qu’est un thème, Je prendrais comme exemple le thème Taste, disponible dans les thèmes EMUI.

Structure d’un fichier thème

Un fichier thème porte une extension .hwt. Une fois installé ou copié sur le téléphone, il se trouve sur la mémoire interne, dans le répertoire /HWThemes.

Il peut être ouvert comme un fichier compressé (comme un fichier .zip), par ex. avec 7zip. En fait, vous pouvez considérer que c’est un fichier .zip auquel on a supprimé l’extension .zip.

Une fois ouvert ou décompressé, vous verrez alors des répertoires et des fichiers, qui contiennent les différents éléments de personnalisation :

Petite présentation rapide des répertoires :

audio contient les sons déclenchés par certaines fonctions (alarme, RDV, notification, …)
fonts contient des polices additionnelles
preview contient des copies d’écrans du thème : ce sont celles qui apparaissent dans l’appli Thème
unlock contient les images et le code de l’écran de vérouillage (et oui, on peut le modifier)
wallpaper contient les images-fond d’écran (du bureau et de l’écran de vérouillage) qui seront associées au thème

Petite présentation rapide des fichiers:

description.xml : il contient juste la description affichée de votre thème (titre, auteur, version, résumé)
les fichiers com.android.nom_appli ou com.huawei.android.nom_appli ou com.xxx.xxx sont eux-mêmes des fichiers compressés correspondants à une appli. Ils contiennent uniquement ce que l’on veut voir modifié dans l’appli par le thème (les icônes affichés dans l’appli la plupart du temps)
icons : il s’agit encore d’un fichier compressé, qui contient les icônes des applis que l’on voit sur le bureau ou dans le tiroir (ce ne sont pas les icônes affichés dans les applis, mais uniquement les icônes sur le bureau)

Ajout de fichiers audio (répertoire audio)

Vous aimez certains sons que vous avez ajoutés à la main, et vous voudriez les garder à chaque changement de ROM.

A l’inverse, vous aimez les sons par défaut, et vous n’aimez pas quand ils disparaissent d’une ROM.

C’est ici que ça se passe.

Le principe est simple : dans un répertoire audio, vous y déposer vos fichiers .ogg. Pour qu’ils soient bien appliqués directement avec le thème, ils doivent porter le nom de déclencheur.

Ajout des copies d’écrans du thème (répertoire preview)
Rien de telle qu’une copie d’écran pour mettre en valeur un thème (ou au moins permettre de l’identifier parmi les autres).

Le but est ici de montrer le thème, en déposant les copies d’écrans dans le répertoire preview. Ces copies d’écran doivent porter un nom précis :

- cover.jpg : c’est l’image principale que l’on voit dans l’appli Thème

- preview_launcher_0.jpg et preview_launcher_1.jpg: elle montre le bureau

- preview_widget_0.jpg : elle montre des widgets du bureau (ex : le widget EMUI)

- preview_icons_0.jpg : elle montre une page du bureau avec quelques icônes d’applis

- preview_unlock_0.jpg : elle montre le look de l’écran de verrouillage

- preview_fonts_0.jpg : elle montre le look de la police principale

Toutes ces copies d’écran ne sont bien sûr pas obligatoires, mais conserver au minimum cover et preview_launcher_0 si vous voulez vous y retrouver.

Ajout des fonds d’écran (répertoire wallpaper)
Que serait un thème sans un joli fond d’écran ?

Le principe est simple, mais attention à la taille de vos images.

Les fonds d’écrans sont à placer dans le répertoire wallpaper. On peut y déposer plusieurs fonds d’écran. Seul le 1^er sera appliqué par défaut, mais vous pourrez utiliser les autres dans l’appli Thème en utilisant le menu Personnaliser.

Les noms des copies d’écrans doivent être :

pour le bureau : home_wallpaper_0.jpg, home_wallpaper_1.jpg
è le format de l’image doit être 1440 x 1080 (format large multi-fenêtre)

pour l’écran de verrouillage: unlock_wallpaper_0.jpg, unlock_wallpaper_1.jpg
è le format de l’image doit être 720 x 1280

Ajout de la description du thème (fichier description.xml)

Le fichier description.xml est un fichier .xml, avec quelques balises seulement. Le nom des balises xml ne doit pas changer, seul le libellé (au milieu des 2 balises début/fin) peut être modifié.

La structure est la suivante :

<?xml version="1.0" encoding="UTF-8" ?>

<title>nom_de_votre_theme</title>

<author>nom_de_l’auteur</author>

<designer>nom_du_designer</designer>

<version>le_numero_de_version_du_theme (on commence souvent par 1.0)</version>

<font>default</font>

<briefinfo>un_petit_commentaire_pour_définir_votre_thème</briefinfo>

</HwTheme>

A partir d’ici, ça se complique un peu, mais rien d’insurmontable, rassurez-vous :)

Ajout des icônes d’applis (fichier icons)

Les icônes d’applis décrites ici sont les icônes que l’on voit sur le bureau (launcher) ou le tiroir (drawer).

Toutes ces icônes de bureau se trouve dans le fichier compressé icons (encore un fichier .zip sans son extension).

Si vous ne voulez pas créer de fichier compressé icons, vous pouvez en utiliser un existant. Il vous suffira d’y glisser vos icônes, de supprimer celles que vous ne voulez pas personnaliser.

Le nom de l’image-icône doit correspondre au nom de fichier de l’appli ou de son activité : com.android.nom_appli.png, com.huawei.nom_appli.png. Il peut s’agit aussi bien d’une appli système que d’une appli utilisateur.

C’est peut-être ici la principale difficulté : trouver le nom de l’appli.

Ajout de l’écran de verrouillage (répertoire unlock)

Le répertoire unlock contient les icônes et portions d’images utilisées sur l’écran de verrouillage, ainsi que le code qui permet de structurer cet écran.

Les images se trouvent dans le répertoire drawable-hdpi, le code se trouve dans le répertoire layout-hdpi.

Ce point n’est pas développé en détail pour l’instant, on arrive ici dans des modifications qui sont plus complexes, et qui seront détaillées plus tard, car je n’ai moi-même par encore analysé tout ça.

En attendant, vous pouvez soit :

supprimer ce répertoire si vous ne voulez pas intégrer d’écran de verrouillage dans votre thème (le téléphone utilisera le dernier écran de verrouillage appliqué)
copier/reprendre ce répertoire d’un autre thème, si vous en avez trouvé un écran de verrouillage qui vous convient bien.

Modification d’images affichées dans une appli (fichier com.xxx.xxx)

Si vous aimez la modification des icônes, vous aurez alors souvent des noms de fichier qui porte le nom de fichier d’une appli. Ce fichier sera encore un fichier compressé sans extension.

Prenons l’exemple d’une appli que l’on voit dans le thème Taste : le widget MeWidget, son nom de fichier est com.huawei.android.mewidget.

Il contient les images-icônes de l’appli, dans un répertoire res/drawable-sw360dp-xhdpi.

Ce widget MeWidget peut afficher des contacts, de la météo, des commandes-musique, vous trouverez donc dans ces icônes des icônes contacts, des icônes météo, des icônes musique, …

Pour savoir à quoi correspond chaque image dans une appli, bah c’est un peu le système débrouille.

On le devine par l’image elle-même, par le nom de l’image (par chance, c’est souvent assez explicite), ou alors en utilisant l’appli, et en faisant fonctionner ses yeux pour détecter l’image… en clair, ça n’est pas toujours évident.

ð Attention :

vous pouvez remplacer les images .png sans difficultés, mais garder les mêmes dimensions.
!!! les images avec l’extension .9.png ne sont pas de simples images (elles sont différentes des .png), elles doivent être modifiées comme des images .9.png !!!

J’ai trouvé une petite explication sympa ici : http://supertos.free.fr/supertos.php?page=1342

(en résumé : les images .9.png contiennent des zones de pixels noir, l’image remplaçante devra contenir ces mêmes pixels noirs)

Vérification de votre thème

A la fin de vos modifications, votre fichier thème doit avoir une extension .hwt.

Il doit contenir au mimimum :

Le fichier description.xml
Le répertoire preview (avec quelques copies d’écran)
Au moins une modification (sinon, ça ne sert pas à grand-chose) : audio, wallpaper, icons, ou une appli

Modifications avancées d’un thème

Ici, ça se complique encore ^_^

Barre de notification fermée : transparente

Pour rendre la barre de notification transparente quand elle est fermée (barre du haut en affichage du bureau):

Créer (ou récupérer) un fichier com.android.systemui, correspondant à l’appli systemUI (l’appli système qui gère cette petite barre).

Dans ce fichier compressé, créer/ouvrir le fichier theme.xml.

Exemple :

<?xml version="1.0" encoding="utf-8"?>

</hwthemes>

Modifier ou ajouter la balise translucent_status_bar_background, pour lui affecter le code couleur qui correspond à totalement transparent (#00000000) :

Changer la couleur de la barre de notification ouverte

Créer (ou récupérer) un fichier com.android.systemui, correspondant à l’appli systemUI.

Dans ce fichier compressé, créer/ouvrir le fichier theme.xml.

Exemple :

<?xml version="1.0" encoding="utf-8"?>

</hwthemes>

Modifier ou ajouter les balises suivantes :

<color name="statusBar_expanded_date_network">#ffffffff</color>

<color name="statusBar_expanded_clock">#ffffffff</color>

Changer le fond de la barre d’outils

Il s’agit ici de modifier le fond de la page qui affiche tous les toggles (la barre qui affiche tous les raccourcis du panneau de notification) :

Ici, on va faire simple : ce n’est pas une couleur de fond, mais une image de fond J. Donc la barre n’est pas vraiment transparente, on ne fait qu’afficher l’image l’on veut voir.

Créer (ou récupérer) un fichier com.huawei.android.toolbox, correspondant à l’appli Toolbox.

Dans ce fichier compressé, créer/ouvrir le répertoire res/ drawable-sw360dp-xhdpi, et remplacer l’image toolbox_edit_bg.9.png par celle que vous voulez voir apparaître.

ð Attention : !!! les images avec l’extension .9.png ne sont pas de simples images (elles sont différentes des .png), elles doivent être modifiées comme des images .9.png !!!

Modifier la barre de toggles de la barre d’outils

Tous les interrupteurs que l’on voit dans la barre de menu sont des images, il y a autant d’images que d’état de l’interrupteur : éteint, appuyé, allumé.

Créer (ou récupérer) un fichier com.huawei.android.toolbox, correspondant à l’appli Toolbox.

Dans ce fichier compressé, créer/ouvrir le répertoire res/ drawable-sw360dp-xhdpi, et remplacer l’image de chaque interrupteur à modifier :

On peut imaginer changer simplement la couleur des interrupteurs, ou alors modifier complètement le look des interrupteurs.

Après les interrupteurs, on va s’occuper de chaque fond-carré qui les accueille :

Toujours dans le répertoire res/ drawable-sw360dp-xhdpi du fichier com.huawei.android.toolbox, vous voyez les fichiers suivants (attention, ce sont des fichiers .9.png):

Vous pouvez les rendre semi-transparent (si ça n’est pas déjà le cas), où leur donner une couleur différente selon l’état de l’interrupteur :

Interrupteur appuyé (pressed)
Interrupteur désactivé (disabled)
Interrupteur éteint (off)
Interrupteur éteint appuyé (off pressed)
Interrupteur allumé (on)
Interrupteur allumé appuyé (on pressed)
Interrupteur en cours de changement d’état (turning)

Nous avons vu l’icône-interrupteur, le fond-carré qui les accueuille, il ne faut pas oublier… la barre qui accueille tout ça.

Dans le même répertoire, la barre correspond au fichier status_bar_btn_bg.9.png, et remplacez-là par ce que vous voulez avoir comme résultat.

Remarque : ne recherchez pas la transparence totale de la barre d’outils, vous ne la trouverez pas. Au mieux, vous obtiendrez une barre semi-transparente.

Modifier le fond d’une notification

Modifier la barre de notification c’est bien, mais il vous sera peut-être utile d’avoir le fond d’une notification cohérente avec le look de votre barre.

Créer (ou récupérer) un fichier framework-res, correspondant au framework.

Dans ce fichier compressé, créer/ouvrir le répertoire res/drawable-xhdpi, et remplacer les images de fond de chaque état de la notification :

Remarque : ici aussi, ne recherchez pas la transparence totale d’une notification, vous n’aurez au mieux qu’une notification semi-transparente, comme la barre elle-même.

A venir

Première chose qui sera nécessaire: ajouter une table des matières :D

A compléter: l'écran de verrouillage (il me faudra du tout pour l'analyser)

Ce qu'il manque: j'en connais déjà quelques uns. Sinon, dites-moi, je me ferais un plaisir de combler les manques.

Modifié 14 janvier 2014 par Flippy

flippy12 · 14 janvier 2014

Réservé (probablement pour quelques exemples)

polo_c_moi · 14 janvier 2014

Flippy, tu utilises quelle application thème : celle de huawei ou Xposed spécial Huawei ?

Y-a-t-il moyen d'avoir l'apk de l'application thème de huawei?

Car avec la rom B706 V2.0 de batty, il n'y a pas d'appli thème

Modifié 14 janvier 2014 par polo_c_moi

olivier35 · 14 janvier 2014

Je ne sais pas si l'apk seul fonctionnera, mais sinon tu peux prendre le HwThemeManager de EMUI 2.0 ici (voir liens mega - marche aussi pour les thèmes 1.6).

Les thèmes sont associés au launcher il me semble, il faudra donc que tu installes aussi le launcher Huawei (HwLauncher6, l'install de l'apk marche en direct - par contre pour HwThemeManager je ne sais plus si on peut l'installer directement, peut-être besoin de le mettre dans system/app avec les bons droits) !

Modifié 14 janvier 2014 par olivier35

polo_c_moi · 14 janvier 2014

ok, merci olivier35

flippy12 · 14 janvier 2014

Oui, le Theme manager doit être copié dans system/app je pense.

J'ai aussi pris celui de la EMUI 2.0, par contre, elle est en anglais.

Pour la version officielle en EMUI 1.6, l'apk est dispo dans la B706 V1.0 de batty.

Pour l'affichage des éléments du thème, tout dépend de ce que vous voulez personnaliser. Dans mon cas, je n'utilise pas le launcher de Huawei, j'utilise Nova launcher.

Je ne peux donc pas personnaliser les icônes que je vois sur mon home Nova par un thème Huawei (je dois passer par un thème Nova). Par contre, le reste (barres, paramètres, applis, ...) est bien personnalisé.

flippy12 · 15 janvier 2014

Petit exercice du jour: changer le fond de l'appli Contact:

On pourrait croire que l'on doit jouer avec la transparence du fond, mais en fait, ici encore, il n'y a pas de transparence, on ne fait que remplacer l'image de fond blanche par une belle image.

Donc, dans un 1er temps, choisissez l'image que vous voudrez voir apparaître en fond de l'appli: elle devra être au format 720 x 1280 (même format que pour l'écran de verrouillage).

Maintenant, on y va: créez ou modifiez le fichier compressé com.android.contacts, créez-y le répertoire 'res', et sous ce répertoire, créez:

- le répertoire 'drawable': collez-y votre image, et renommez-la 'people_background.9.png'

- le répertoire 'drawable-hdpi': collez-y votre image, et renommez-la 'dialpad_fragment_bg.9.png'

- le répertoire 'drawable-xhdpi': collez-y votre image, et renommez-la 'dialpad_fragment_bg.9.png'

Voilà, c'est un début pour cette appli: le fond est tout joli. Il restera ensuite à jouer avec la transparence des différents éléments qui sont affichés au-dessus (clavier, barre du bas, ...).

Bon, allez, pour ceux qui ne peuvent pas attendre la prochaine fois:

pour rendre transparent le clavier, il faut jouer avec la transparence des images dial_num_0_wht.9.png à dial_num_9_wht.9.png, avec dial_num_pound_wht.9.png et dial_num_star_wht.9.png: il faut laisser visible les chiffres et lettres, mais rendre transparent le fond blanc de chaque image.

-> Attention, ici, on est dans de la retouche d'image. Ceux qui connaissent n'auront pas de difficulté. Pour les autres, je pourrais vous aider, mais pas tout de suite.

flippy12 · 16 janvier 2014

Changer les barres du haut et du bas de l'appli Contact:

Hier, j'ai modifié le fond de l'appli Contact avec une belle image, mais lorsque je suis dans la liste des contacts, j'ai la barre du haut (des onglets sur fond noir) et la barre du bas (des boutons sur fond blanc) qui étaient d'une autre couleur, et ça ne rendait pas bien.

Aujourd'hui, je suis parti à la recherche de ces 2 barres, et ça n'est pas toujours évident de trouver ces petits éléments.

Avec ces infos, vous pourrez donc modifier la transparence de ces barres de façon à ne plus les voir du tout (transparence totale), ou les voir à moitié (transparence partielle), ou à les remplacer par une image.

-> à savoir: les éléments de l'appli concerné (framework-res-hwext) concerne plusieurs applis de Huawei. C'est notamment le cas des Contacts, des paramètres du tel, de Musique.

Nous allons créer/modifier le fichier compressé framework-res-hwext (appelons ça l'extension Huawei du framework):

créez-y un répertoire res, sous ce répertoire, créez le répertoire drawable-xhdpi. Les images qui doivent être modifiées ou remplacées dans ce répertoire sont:

.pour la barre du haut:

- tab_selected_pressed_emui.9.png

- tab_selected_emui.9.png

- tab_unselected_emui.9.png

- tab_unselected_pressed_emui.9.png

.pour la barre du bas:

- ab_bottom_emui.9.png

Remarques:

sur les images tab_selected_pressed_emui.9.png et tab_selected_emui.9.png, il y a un indicateur qui montre l'onglet courant: ne passer pas l'indicateur en full transparent si vous voulez continuer à voir quel est l'onglet courant ;)
comme toujours, attention à respecter la taille de chaque image

Pour ma part, j'ai tenté la semi-transparence et la transparence totale (barre du haut et barre du bas) pour montrer ce que ça donne:

Modifié 16 janvier 2014 par Flippy

flippy12 · 16 janvier 2014

Changer l'icône Batterie (dans la barre d'état)

Vous aimez les icônes batterie de votre voisin ?

Vous utilisiez un module Xposed pour changer cette icône ? (désolé, je me reconnais ici)

Voyons comment remédier à cela...

L'icône Batterie est une succession de petites icônes correspondant à chaque % de batterie:

vous avez donc 203 icônes (101 en décharge et 102 en charge).

De nombreux thèmes d'icônes-batterie sont disponible sur internet, vous pourrez facilement les inclure dans votre thème (attention, je ne dis pas que vous pouvez les distribuer).

Ces icônes doivent s'appeler:

- stat_sys_battery_0.png à stat_sys_battery_100.png (pour le % en décharge), en passant par chaque step (0 à 100)

- stat_sys_battery_charge_anim0.png à stat_sys_battery_charge_anim100.png (pour le % en charge) en passant par chaque step (0 à 100), et stat_sys_battery_charge_animfull.png (quand c'est plein et en charge)

Ouvrez le fichier compressé com.android.systemui que vous avez sûrement dû déjà créé.

Dans le répertoire res/drawable-xhdpi, collez-y toutes ces icônes.

Remarque [root obligatoire]:

vous pouvez avoir une icône avec le chiffre à l'intérieur, ou une icône sans chiffre, selon ce que vous voulez.

A côté de l'icône, le système affiche tout de même le %batterie, ce qui ne rend pas forcément bien.

Si vous ne voulez plus voir apparaître le %batterie du système, vous devez éditer le fichier system/build.prop pour passer la ligne suivante à false (à la place de true) :

ro.config.hw_battery_percent=false

polo_c_moi · 21 janvier 2014

Oui, le Theme manager doit être copié dans system/app je pense.

J'ai aussi pris celui de la EMUI 2.0, par contre, elle est en anglais.

Pour la version officielle en EMUI 1.6, l'apk est dispo dans la B706 V1.0 de batty.

Pour l'affichage des éléments du thème, tout dépend de ce que vous voulez personnaliser. Dans mon cas, je n'utilise pas le launcher de Huawei, j'utilise Nova launcher.

Je ne peux donc pas personnaliser les icônes que je vois sur mon home Nova par un thème Huawei (je dois passer par un thème Nova). Par contre, le reste (barres, paramètres, applis, ...) est bien personnalisé.

Bonjour,

Je récapitule, Flippy tu utilises le l'application thème de EMUI 2.0 associé à nova launcher

flippy12 · 21 janvier 2014

Oui, c'est bien ça, c'est un choix personnel:

- j'utilise Nova launcher parce qu'il est fortement paramétrable, et assez fluide en même temps.

Il est possible de lui appliquer un thème, mais le thème ne concernera que le launcher Nova (look, icône sur le launcher).

- Pour le reste, ce sera avec l'application thème de EMUI (1.6 ou 2.0 selon ce que l'on veut utiliser), qui permet de personnaliser tout le reste.

Envoyé de mon HUAWEI U9508 en utilisant Tapatalk

Connexion

[THEMES] Modifier un thème EMUI

Recommended Posts

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Rejoignez la conversation