Huawei EMUI Themes gestalten und verändern [Teil 3]

In den letzten beiden Teilen meiner Artikelserie zum Gestalten von Huawei Themes habe ich euch erklärt, wie ihr Designs verändern oder erweitern könnt — sowohl über die HiSuite, als auch ohne. Im zweiten Teil beschrieb ich explizit, wie einzelne Apps gestaltet werden können, allerdings nur anhand von Bildern. An diesen Punkt knüpft nun der dritte Teil an. Zunächst gehe ich etwas näher auf das Dekompilieren von System-Apps ein und anschließend auf die Verwendung verschiedenster Werte, um EmotionUI Themes optisch mit variablen Farbwerten zu modifizieren. Der vierte Teil gibt euch dann einen Ausblick auf die Zukunft dieser Idee und die Zusammenhänge im Bezug auf MIUI Themes. Da gibt es durchaus sehr offensichtliche Parallelen.

Wie dekompiliere ich relativ einfach System-Apps?

Um überhaupt etwas zu dekompilieren, benötigt ihr zunächst das nötige Handwerkszeug. Kopiert mit einem Dateimanager von eurem Smartphone die beiden APK-Dateien framework-res.apk und framework-res-hwext.apk, aus dem Ordner /system/framework/ heraus. Natürlich sind ebenso die Apps notwendig, die auseinandergenommen werden sollen. Diese lagern meist im Verzeichnis /system/app/. Alle Programme bitte auf einen Computer kopieren. Meine Anleitung stützt sich vorwiegend auf Windows, klappt aber auch mit Linux und Mac OS X. Lediglich die systemspezifischen Befehle sind verschieden. Um die Anwendungen auf dem PC in ihre Bestandteile zu zerlegen, brauchen wir noch ein Tool. Dafür kommt das “apktool” zum Einsatz. Ladet euch die benötigten Komponenten auf der Entwickler-Webseite herunter. Entpackt alles in einen gemeinsamen Ordner — legt ebenfalls die APK-Dateien hinein.

"apktool" und alle zu entpackenden APK-Dateien
“apktool” und alle zu entpackenden APK-Dateien

Stellt sicher, dass auf eurem Rechner eine funktionierende Java Laufzeitumgebung vorhanden ist. Ansonsten installiert diese oder verwendet die portable Version. Falls ihr JRE als portables Programm verwendet, müsst ihr in der apktool.bat den Pfad zum Java-Verzeichnis in Zeile 3 angeben. Öffnet nun die Windows-Eingabeaufforderung und navigiert via CD-Befehl zum apktool-Ordner. Jetzt führt ihr die nachstehenden Anweisungen in der Konsole aus:

apktool if framework-res.apk
apktool if framework-res-hwext.apk

Dies ist wichtig, um die Frameworks zu installieren. Denn ansonsten klappt das Dekompilieren nicht. Nach dem die notwendige Vorarbeit erledigt wurde, könnt ihr eure Apps auspacken. Dabei verwendet ihr wieder das “apktool”, allerdings mit einem anderen Befehl.

apktool d APK-Name.apk APK-Name

Dekompiliert alle APKs, einschließlich der beiden Framework-Anwendungen.

EmotionUI Themes mit Farbwerten verändern

Ein Programm besteht nicht nur aus Bildern. Oft beinhaltet es auch einiges an Text. Diesen möchte man natürlich ebenso gestalten. Huawei erlaubt mit seiner Oberfläche EMUI das Abändern von Farben. Das gestaltet sich jedoch noch etwas schwierig. Wozu das Dekompilieren notwendig war, seht ihr jetzt. Eine App besteht aus vielen Ordnern. Durch das Entpacken mittels “apktool”, wurde die Datei resources.arsc entpackt. Dadurch sind neue Ordner hinzugekommen. Einer davon heißt values. In ihm sind einige wenige XML-Dateien anzutreffen. Die color.xml ist für uns von besonderem Interesse. Daher navigieren wir testweise in das Verzeichnis der framework-res-hwext und öffnen die besagte XML-Datei in einem Texteditor freier Wahl.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="darker_gray">#ffaaaaaa</color>
    <color name="white">#ffffffff</color>
    <color name="black">#ff000000</color>
...

An dieser Stelle gibt es keine wirkliche Hilfestellung. Um zu erfahren, was welcher Farbwert wo ändert, hilft einfaches Ausprobieren. Die Angaben in der color.xml passend zu einer App können im EMUI Theme verwendet werden. Dazu müsst ihr im Design in einem Ordner, wie z.B.: framework-res-hwext.bak eine neue Datei, mit dem Namen theme.xml anlegen. Öffnet sie anschließend mit einem Texteditor und fügt folgendes Grundgerüst ein:

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

Zwischen hwthemes kopiert ihr die zu ändernden Zeilen aus der color.xml. Ändert die Farbwerte euren Wünschen entsprechend ab. Dabei ist zu beachten, dass der Hexadezimalcode aus acht Zeichen besteht. Die ersten beiden Stellen stehen dabei für die Transparenz und die nachfolgenden sechs für die Farbe. Abschließend exportiert ihr das Theme wieder mit der HiSuite oder editiert die Änderungen direkt im HWT-Archiv. Aktuell gibt es keine Referenz für die verfügbaren Color-Werte. Je nach Huawei-Gerät und Firmware-Version können die Variablen anders sein. Daher hilft wirklich nur dekompilieren und nachschauen. Trotzdem lässt sich damit momentan schon einiges anstellen. Die Hauptarbeit beim Designen beschränkt sich jedoch auf Grafiken.

Der vierte Teil meiner Artikelserie wird euch die Zusammenhänge zwischen den EMUI und den MIUI Themes verdeutlichen. Ebenso werde ich versuchen einen Ausblick auf die Zukunft des Konzepts zu geben.

Zu weiteren Teilen der Artikelserie:


Avatar von reraiseace
Autor: Markus Werner (reraiseace) Twitterreraiseace, Google+reraiseace, Twittercb_werner
Ich bin Redaktionsvolontär bei der COMPUTER BILD in Hamburg, Fernstudent am Deutschen Journalistenkolleg und schreibe auf re{raise}ace privat über Webdesign und Programmierung. Seit 2015 schrieb ich auch regelmäßig für andere Medien.

0 Kommentare

Du kannst diesen Artikel nicht mehr kommentieren.