[Tutorial] Wie erstelle ich eigene Icon-Themes !!

  • Hier möchte ich euch kleines Tutorial zeigen, wie ihr eure eigenen Icon-Themes ertellen könnt.
    Das erste Tutorial werde ich recht einfach gestalten damit es möglichst viele probieren können. Später werde ich das Tutorial noch etwas erweitern und euch ein paar Begriffe erklären. Es gibt ja Milliarden von unterschiedlichen Icon-Packs, aber oft ist es so, das die einem dann doch nicht so gefallen oder das sie Geld kosten. Meist nur ein paar Cent, aber das läppert sich mit der Zeit. Also machen wir das ganze doch einfach selber.
    Voraussetzung ist ein bisschen Geduld und etwas Erfahrung mit einem Bildbearbeitungs Programm.
    Also lasst uns Anfangen.

    Zuerst laden wir uns die 2 Dateien runter die unten im Post stehen. Einmal das Template (press.apk) und einmal die Datei zum neu Signieren.

    1: Als erstes entpacken wir die press.apk (siehe screenshot)

    2: Jetzt gehen wir in den entpackten Ordner und gehen in den "res" Ornder, dann in einen der "hdpi" Ordner. Ich habe den drawable-xxhdpi genommen. (siehe screenshots)

    3: Jetzt sehen wir die Bilder im Ordner. (siehe screenshot)

    4: Hier die Erklärung welches Bild wofür zuständig ist.
    A: Das "icon" dient als Vorschaubild der späteren fertigen apk. Praktisch das apk Icon
    B: Das "iconback" ist der Hintergrund von eurem Icon-Theme.
    C: Das "iconmask" ist die "Maske" für das Icon welches zur jeweiligen Anwendung gehört und den Bereich sichtbar macht. Das schwarze ist nicht zu sehen sondern nur der "leere" Bereich. Der rest wird einfach ausgebeldet.
    D: Das "iconupon" ist der Vordergrund von eurem Icon-Theme. Es legt sich praktisch über den ganzen Rest.

    5:Wenn wir keinen Icon-Hintergrund wollen, können wir "iconback" natürlich auch komplett transparent machen.Und das "iconback" arbeitet immer mit dem "iconupon" zusammen, also sollte der Bereich vom "iconback" nicht größer sein als vom "iconupon". Sieht sonst scheiße aus *G*. Aber das werdet ihr schon festellen wenn ihr probiert.

    6: Habt ihr jetzt die Icons nach euren Wünschen angepasst, 4 Stück an der Zahl, dann speichern wir diese 4 Icon ab und kopieren die in JEDEN "hdpi" Ordner. (siehe screenshot)

    7: Jetzt öffnen wir wieder das originale Template (press.apk) mit Winrar. Nur öffnen nicht entpacken. Klicken dann in den "res" Order, das wir die 5 "drawable-XXXpi" sehen.

    8:Jetzt kopieren wir unsere vorher erstellen Icon mit den Ordnern in die offene WinRar datei rein. Wir schieben die in einen leeren Bereich von Winrar und klicken dann auch "speichern" und schließen das Fenster wieder. (siehe beide screenshots)

    9: Jetzt müssen wir die APK noch fix neu Signieren.Das ist aber schnell gemacht.
    Entpackt das vorher geladene Sign+.zip
    Dann klickt ihr auf das Icon "Sign+"
    Jetzt öffnet sich ein Fenster, klickt auf "Browse" und sucht eure press.apk die ihr geändert habt und dann auf "Sign File"
    Am Ende habt ihr jetzt eine "press_signed.apk" Die könnt ihr so lassen oder umbenennen, ganz wie ihr wollt.
    Die fertig signierte "apk" könnt ihr jetzt auf euer Telefon packen, installieren und in eurem Launcher das Theme wählen.
    Euer Launcher muss das natürlich unterstützen.
    APEX und NOVA können das auf jeden Fall, denke ein paar andere auch noch.

    PS: Viel Spass beim ausprobieren. Wenn euch einiges noch nicht 100% klar ist, könnt ihr hier gerne eure Fragen stellen.

    Gruß
    Darktrooper

  • [size=18]Teil 2 (Fortgeschrittene)[/SIZE]

    Hier jetzt Teil 2 vom Tutorial. Es wird ein wenig schwieriger. Hier erkläre ich euch was ihr mit dem Template noch so anstellen könnt. Und zwar komplett andere Icons. Also nicht nur eure Icons themen , sondern komplett ein anderes Aussehen verpassen.Schreibe aber auch noch ein Stück für Teil 1 hier rein.

    Voraussetzung ihr wisst was de/compilen ist und natürlich die Voraussetzung von oben ;)

    1. Erklärungen zu den verschiedenen xml Dateien die in der press.apk drin sind.

    A: Wir "decompilen" jetzt erstmal die press.apk
    Jetzt gehen wir mal in den Order "res/xml"
    Da öffnen wir jetzt mit einem Editor (vorzugsweise Notepad++) die "appfilter.xml"
    Die sieht jetzt so aus:

    XML
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <iconback img1="iconback" />
        <iconmask img1="iconmask" />
        <iconupon img1="iconupon" />
        <scale factor="1.0" />
    </resources>


    Die Zeilen wo "icon/back-mask-upon" stehen, sind eure Bilder die ihr in den Ordnern habt. Dann haben wir noch die Zeile mit "scale factor" 1.0=100%. 80=80%, 50=50% etc. Das heißt der Scalefactor steht für die größe eurer Standarticons.Wenn ihr z.B. ein Icon-Theme habt und ihr möchtet das Standart-Icon kleiner haben, damit es besser in euer Theme passt, könnt ihr damit die größe ändern. 1.0 zeigt die volle größe an und Zahlen zwischen 10-99 die % Angaben der größe. Das fertige Icon ist davon nicht betroffen. Nur das Standart-Icon von der jeweiligen App. Einfach probieren.
    B: Eigene Icons einbinden
    Wir bleiben in der selbem XML wie gerade nur fügen wir jetzt unsere eigenen Icon hinzu. Dazu benötigen wir die "activities" der einzelnen App's von welches ihr ein Icon erstellen wollt. Am einfachsten ist das mit dem "APEX" Launcher möglich. Also APEX installieren , könnt ihr ja später wieder löschen.
    Wir klicken lange auf unseren Homescreen und dann auf Verknüpfungen (screenshot 1), Dann klicken wir auf "Aktivitäten" (screenhot 2). Jetzt habe ihr eure installierten Anwendungen auf dem Screen. Wir nehmen jetzt einfach mal den Chrome-Browser als Beispiel, dazu klicken wir auf den kleinen Pfeil neben Chrome (screeshot 3)

    Wir sehen jetzt mehrere Einträge. Wichtig für und ist der "erste" und der "blaue" Eintrag.In meinem Beispiel also "com.android.chrome" und "com.google.android.apps.chrome.Main" Diese Einträge müssen wir nun in unsere obige "xml" eintragen und ihr ein Bild(Icon) zuweisen. Es würde dann wie folgt aussehen:

    XML
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <iconback img1="iconback" />
        <iconmask img1="iconmask" />
        <iconupon img1="iconupon" />
        <scale factor="0.80" />
        <item component="ComponentInfo{com.android.chrome/com.google.android.apps.chrome.Main}" drawable="browser" />
    </resources>


    Die Zeile "ComponentInfo{com.android.chrome/com.google.android.apps.chrome.Main}" steht für das activity
    Die Zeile drawable="browser" steht für euer Bild(Icon). Das heißt ich habe mein Bild einfach "browser" benannt.
    Das könnt ihr nun für alle ICONS anwenden die ihr ändern wollt. Ich weiß das ist ein haufen arbeit. Aber so könnt ihr eure eigenen Icons erstellen.
    Wenn ihr alles habt. Also natürlich auch eure Icon's erstellt können wir das ganze wieder compilen. Danach neu signieren und ihr könnt die APK installieren.
    Ich habe hier mal was vorbereitet, damit ihr sehen könnt wie es am ende Aussehen kann.

    Die black1.7.apk packe ich hier mal mit rein, dann könnt ihr euch die XML mal ansehen und es vielleicht auch noch besser verstehen.
    So nun viel Spass damit.
    PS: Die "Black1.7.apk" ist unten im Post bei den Anhängen zu finden ;)
    Bei Fragen, einfach Frage stellen und ich versuche es so bald es geht zu antworten.

  • Wenn ich die appfilter.xml mit Notepad++ öffne kommen bei mir ganz komische Zeichen.
    Ich weiß nich warum :(

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!