[TUT]Developing G3 TweaksBox Themes

Search This thread

P_Toti

Senior Member
Jun 21, 2012
2,020
6,469
hi friends. I have a little cuestion

how could I change a layout folder layout?
for example, I have signal_cluster_view.xml to modify and change the icons of place, but which would not be the syntax in the theme.xml to change. It can be modified?

thanks in advance :eek:
Hello ffalete,

No its not possible with a theme to do that.
 
  • Like
Reactions: ffalete

ffalete

Senior Member
Nov 4, 2012
145
306
Madrid
Hello ffalete,

No its not possible with a theme to do that.
Umm. Ok
Tomorrow upload any themes for g3tb lollipop :):)
f8f1385601270ee9c53c259e5ab3d64d.jpg
3422a90522e392e2181013a1465693fa.jpg
80ee80e51e3f0d85119956e500222c32.jpg


Etc etc[emoji2] [emoji2]
 
  • Like
Reactions: pepezpz

magicmanfk

Senior Member
Dec 23, 2010
94
50
So I think I'm going to try to make some themes using this guide, just one question- will the files on the original post work for lollipop, or are they designed for kit kat?
 

Top Liked Posts

  • There are no posts matching your filters.
  • 27
    As many of you know, in the new release of G3 TweaksBox i implemented a theme engine that allows users to develop their own themes.Creating themes is really simple:at the end of this post you can find a theme example i created with resources provided by @Kickoff and an empty theme template you can use to develop your own themes.

    What can you theme ?
    SystemUI(see LGSystemUI.apk)
    LockScreen(see LGKeyguard.apk)
    Phonebook,InCallUI,TeleService(see LGContacts.apk,InCallUI.apk,LGTeleservice.apk)
    Message App(see LGMessage.apk)
    Settings(see LGSettings.apk and LGEasySettings.apk)
    More to come....

    1)Modify the package name:

    Open the MANIFEST(AndroidManifest.xml) and change the package name.

    Code:
    <?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
        package="[COLOR="Red"][B]it.ptoti.systemui_theme.htc[/B][/COLOR]"
        android:versionCode="1"
        android:versionName="1.0" >
    
        <uses-sdk
            android:minSdkVersion="19"
            android:targetSdkVersion="19" />
    
        <application
            android:allowBackup="true"
            android:icon="@drawable/ic_launcher"
            android:label="@string/app_name"
            android:theme="@style/AppTheme" >
            <activity
                android:name="it.ptoti.systemui_theme.htc.MainActivity"
                android:label="@string/app_name">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN"/>
                    <action android:name="it.ptoti.g3_tweaksbox.systemui.THEME"/>
                    <!-- <action android:name="it.ptoti.g3_tweaksbox.settings.THEME"/> -->
                    <!-- <action android:name="it.ptoti.g3_tweaksbox.lockscreen.THEME"/> -->
                    <!-- <action android:name="it.ptoti.g3_tweaksbox.incallui.THEME"/> -->
                    <!-- <action android:name="it.ptoti.g3_tweaksbox.phonebookapp.THEME"/> -->
                    <!-- <action android:name="it.ptoti.g3_tweaksbox.messageapp.THEME"/> -->
                    <category android:name="android.intent.category.DEFAULT"/>
                </intent-filter>
            </activity>
        </application>
    </manifest>

    2)Change Theme Name:

    Open the strings.xml file(res/values/) and change the theme name

    Code:
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <string name="app_name">[COLOR="Red"]HTC Panel THEME<[/COLOR]/string>
    </resources>

    2-1)Add Intents in the Manifest File:

    Code:
    <action android:name="it.ptoti.g3_tweaksbox.systemui.THEME"/> [COLOR="Red"]for the LGSystemUI[/COLOR]
    <action android:name="it.ptoti.g3_tweaksbox.settings.THEME"/> [COLOR="red"] for the LGSettings[/COLOR]
    <action android:name="it.ptoti.g3_tweaksbox.easysettings.THEME"/> [COLOR="red"] for the LGEasySettings[/COLOR]
    <action android:name="it.ptoti.g3_tweaksbox.lockscreen.THEME"/> [COLOR="red"]for LGKeyGuard[/COLOR]
    <action android:name="it.ptoti.g3_tweaksbox.incallui.THEME"/> [COLOR="red"] for InCallUi[/COLOR]
    <action android:name="it.ptoti.g3_tweaksbox.teleservice.THEME"/> [COLOR="red"] for TeleService[/COLOR]
    <action android:name="it.ptoti.g3_tweaksbox.phonebookapp.THEME"/>  [COLOR="red"]for LGContacts[/COLOR]
    <action android:name="it.ptoti.g3_tweaksbox.messageapp.THEME"/>  [COLOR="red"]for LGMessage[/COLOR]

    Manifest example : Here you can see a manifest example of theme for SystemUI and Settings only

    Code:
    <?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
        package="it.ptoti.systemui_theme.template"
        android:versionCode="1"
        android:versionName="1.0" >
        <uses-sdk
            android:minSdkVersion="19"
            android:targetSdkVersion="19" />
    
        <application
            android:icon="@drawable/ic_launcher"
            android:label="@string/app_name"
            android:theme="@style/AppTheme" >
            <activity
                android:name="it.ptoti.systemui_theme.htc.MainActivity"
                android:label="@string/app_name">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN"/>
    [COLOR="red"][SIZE="3"]                <action android:name="it.ptoti.g3_tweaksbox.systemui.THEME"/>
                    <action android:name="it.ptoti.g3_tweaksbox.settings.THEME"/>[/SIZE][/COLOR]
                    <category android:name="android.intent.category.DEFAULT"/>
                </intent-filter>
            </activity>
        </application>
    </manifest>

    3)REPLACING RESOURCES:

    REPLACING QUICKSETTINGS' ICONS AND ANIMATIONS:

    You just have to put your modified resources in the relative folders. Drawables MUST have the same name they have in the SystemUI package: if G3 TWB finds them it replaces the original resources with the themes' ones.

    Also,you have to add these lines to the theme.xml you can find in the xml folder

    <Drawable name="indi_noti_rearrange_normal" />
    <Drawable name="indi_noti_rearrange_pressed" />
    <Drawable name="quicksetting_button_edit_bg" />


    REPLACE OTHER RESOURCES:

    Other resources MUST be ALSO defined in the relative xml file you can find in the xml folder:

    theme.xml -----------------> For the SystemUI
    theme_contacts.xml -------------> For LGContacts.apk
    theme_incallui.xml ---------------> For InCallUI.apk
    theme_lockscreen.xml -----------> For LGKeyGuard.apk
    theme_messageapp --------------> For LGMessage.apk
    theme_settings.xml ---------------> For LGSettings.apk
    theme_teleservice.xml------------------> For LGTeleService.apk
    theme_easysettings.xml---------------> For LGEasySettings.apk


    Let's take a look to an example.

    Code:
    <?xml version="1.0" encoding="utf-8"?>
    <G3_TweaksBox_SystemUI_Theme version="1">
        <Drawable name="ic_brightness_auto_check"/>
        <Drawable name="ic_launcher_settings" />
        <Drawable name="scrubber_primary_holo" />
        <Drawable name="ic_notify_settings_set" />
        <Drawable name="indi_noti_btn_vol_set" />
        <Drawable name="ic_notify_quicksetting_brightness_panel" />
        <Drawable name="ic_notify_quicksetting_ringtone" />
        <Drawable name="indi_noti_btn_clear" />
        <Color name="np_clock" replacement="#FF00FF00"/>
        <Color name="bg_expanded" replacement="#FF000000" />
    </G3_TweaksBox_SystemUI_Theme>

    To replace a drawable the syntax is:

    Code:
    <Drawable name="name_of_original_drawable" replacement="name_of_the_drawable_in_your_theme" / >

    The replacement attribute is optional: if you name the drawable as the original one in the SystemUI you can omit it.

    You can also replace a Drawable with a color with the following syntax:

    Code:
    <Drawable name="name_of_original_drawable" replacement="colorDrawable:#AARRGGBB" / >

    Where AARRGGBB is the color code in the ARGB format(but you can use also RGB format)

    To replace a color the syntax is the following:

    Code:
    <Color name="name_of_original_color" replacement="#AARRGGBB" />

    If you want to replace a drawable(or a color) which is actually in the framework-res you can use the same syntax but you have to add the packageRes attribute, example :

    Code:
    <Drawable respackage="com.lge" name="switch_thumb_activated_holo_light"/>

    To replace a dimension the syntax is the following:

    Code:
    <Dimen name="name_of_original_dimension" replacement="20.0" />

    The replacement must be a dip value not a px one.

    To replace an integer the syntax is the following:

    Code:
    <Integer name="name_of_original_integer" replacement="20" />

    To assign a backgound(Drawable or Color) to any layout the syntax is the following :

    Code:
    <LayoutBackground name="layout_name" background="name_of_the_drawable" />

    To assign a background(Drawable or Color) to any child layout the syntax is the following :

    Code:
    <LayoutBackground name="master_layout_name" child="child_layout_name" background="name_of_the_drawable" />

    That's all,remember to sign the theme before trying to install it. The TUT will be updated when new features are added to the theme engine.
    8
    Pre release sent to themers and TUT and templates updated.
    8
    New theme engine is almost done:

    Now you can theme more apps
    Now you can set any background on any layout: it's useful to set a background on a layout which does not have it or on a layout which has a color as background(like the notification panel)
    I'm also thinking to give themers the ability to theme anything in the framework.

    If you would like to see new other features, just ask for it. The new version of G3 TWB is scheduled to be released on the second half of September but i can send to all themers a pre release the next week if you want it. Let me known about that.

    Here some screenshots(i used res from CM Cobalt theme by @dustinb17 to test the new engine)

    7
    I updated the theme engine with some changes that will be available with the beta i'm going to release the next week:

    Now you can add/replace the background to any child layout/view (see tut for other info)
    Now you can replace framework resources: resources are not replaced globally but per app. To replace framework res you just have to add the "respackage" attr with the framework name("android" for the android framework "com.lge" for the lg framework). Let's see an example

    If you want to replace the switch on the settings app:
    Code:
    <Drawable respackage="com.lge" name="switch_bg_disabled_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_bg_disabled_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_bg_disabled_holo_light"/>
    <Drawable respackage="com.lge" name="switch_bg_disabled_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_bg_focused_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_bg_focused_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_bg_focused_holo_light"/>
    <Drawable respackage="com.lge" name="switch_bg_focused_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_bg_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_bg_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_bg_holo_light"/>
    <Drawable respackage="com.lge" name="switch_bg_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_disabled_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_disabled_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_disabled_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_disabled_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_focused_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_focused_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_focused_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_focused_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_pressed_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_pressed_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_pressed_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_activated_pressed_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_disabled_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_disabled_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_disabled_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_disabled_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_focused_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_focused_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_focused_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_focused_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_holo_light_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_pressed_holo_dark"/>
    <Drawable respackage="com.lge" name="switch_thumb_pressed_holo_dark_latin"/>
    <Drawable respackage="com.lge" name="switch_thumb_pressed_holo_light"/>
    <Drawable respackage="com.lge" name="switch_thumb_pressed_holo_light_latin"/>

    I have also attached in the first post a simple windows app which creates a theme xml from the drawable folder. It will help to save some time.
    7
    An user asked me how to change the settings headers: i took a look and found that you can't change them with the current G3 TWB so i updated the theme engine to make that possible. If you want to change headers you have in the main page you just have to add these lines:

    <Color name="category_background" replacement="#FFFF0000" /> ----------> Background
    <Color name="emphasis" replacement="#FF000000" /> --------------> TextColor



    If you want to change the header you have in other screens you have to :

    1)Create a folder named "layout" in the res folder of your theme
    2)Unzip and copy the preference_category_holo.xml you can find attached to that folder
    3)Add this to theme_settings.xml : <Layout respackage="com.lge" name="preference_category_holo" />
    4)Changing color is quite easy: you just have to change the android:background and the android:textcolor attributes in the layout file.

    Code:
    <TextView android:textColor="#ff000000" 
              android:id="@android:id/title" 
              android:background="#ffff0000" 
              android:minHeight="24.0dip" 
              android:textAllCaps="true"
              android:layout_width="fill_parent"
              android:layout_height="wrap_content"
              android:gravity="center_vertical"
              android:textStyle="bold"
              android:paddingStart="12.0dip"
              android:paddingEnd="12.0dip"
              android:textSize="14.0dip"
      xmlns:android="http://schemas.android.com/apk/res/android" />

Our Apps
Get our official app!
The best way to access XDA on your phone
Nav Gestures
Add swipe gestures to any Android
One Handed Mode
Eases uses one hand with your phone