[One (M8) Themes and Apps] Raymond Ebertt:
Advanced Theming for Sense 6

I was fortunate enough to of had the opportunity to start theming Sense 6 before it even hit the stage as a custom ROM, but that does not give me an advantage at all. Sense 6 is a whole new concept in theming and at the best of times, an aggravated experience. So much has changed between Sense 5.5 and Sense 6 that I don’t even know where to begin. I honestly think that HTC had the common Sense kicked out of it. When life throws you lemons, you theme them….

These tutorials are designed for themers that have knowledge with xml and smali editing. There are several excellent threads that explain the concepts and the "how-to's" for these kinds of edits, therefore, I will only focus on theming issues.

The first thing that I found out was, I needed to update VTS in order to decompile any of the Sense 6 apks. My VTS was outdated and you should carefully check that you are up to date with smali, baksmali.jar’s and using a current version of apktool. Be sure to visit this page and download the latest versions of the smali.jar’s found here and replace them in the appropriate VTS folders. This will resolve most decompiling errors that you may encounter. The other errors, well it’s just the apk and way that it’s being decompiled at the moment. There’s not too much you can do other than getting a different apk and trying it.

Transparent Prism Appdrawer Background

Well, what I thought turned out to be an easy and wonderful edit, in fact, a little bug suddenly appeared.

​

It seems that the Search for Apps feature in the appdrawer shares the same background as the appdrawer itself. As as consequence, there is a double transparent background ontop of each other which I don't find appealing the least.

After a bit of investigating, I found that adding a custom color to isolate the appdrawer background fixed this problem.

Step 1

You're going to need to make a custom color edit in the color.xml of Prism. You can call it whatever you want and make your transparency to your choosing. For the dark_ap_background_color, you can leave it as it is or change it to your desired shade. I changed mine to a black/blue shade.

Step 2

Navigate to specific_all_apps_pagedview.xml

Within this string

<com.htc.launcher.pageview.AllAppsPagedViewHost android:id="@id/all_apps_paged_view_frame" android:background="?dark_ap_background_color" android:paddingTop="@dimen/all_apps_host_paddingTop" android:paddingRight="@dimen/all_apps_host_paddingRight" android:layout_width="fill_parent" android:layout_height="fill_parent"

search for

android:background="?dark_ap_background_color"

Replace ?dark_ap_background_color with your new color name such as @color/custom_color

Step 3

Using the search panel, you want to search within the smali folder for the following. The original thread can be found here. All credits to the authors.

com/android/htc/launcher/Launcher.smali

Search for this entry

.method public updateWallpaperVisibility(Z)V

If you see a const/high16 v2, 0x10 (not 0x100000 as shown) you need to update your smali.jar’s.

Edit 0x100000 to be

const/high16 v2, 0x0

Save your edits, compile and you’re finished.

Results

​

​

Custom Panels for the WeatherClockWidget.apk

Adding custom panels to the WeatherClockWidget.apk is fun. This procedure requires a bit of photo editing skills with Photoshop (or something slimar) and edits in layout and smali (if you want a custom 4x1 clock background).

Step 1

.

Prepare a custom panel as shown. The dimensions are 1040 x 236 (my preference)

Save your panels in the drawable-xxhdpi folder. I prefer using a fixed name such as razor_clock_panel and razor_panel. It’s entirely your preference but don’t forget the name as you will need them for the next steps.

If you just want to add a panel for the weather conditions (1040x238), you will only need to edit the layout.xml.

Step 2

Edit the following string

xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="@id/background_panel" android:background="@com.htc:drawable/common_panel" android:layout_width="@dimen/weatherclock_base_width" android:layout_height="@dimen/weatherclock_base_height" android:layout_marginLeft="@dimen/weatherclock_base_margin_left" android:layout_marginTop="@dimen/weatherclock_base_margin_top" />

You will need to change com.htc:drawable/common_panel" to the following

@drawable/razor_panel

It should now appear as this with your new panel name.

xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="@id/background_panel" android:background="@[COLOR="Red"]drawable/razor_panel[/COLOR]" android:layout_width="@dimen/weatherclock_base_width" android:layout_height="@dimen/weatherclock_base_height" android:layout_marginLeft="@dimen/weatherclock_base_margin_left" android:layout_marginTop="@dimen/weatherclock_base_margin_top" />

Save your edit, compile, and you’re finished.

Results

Now if you want to add a custom 4x1 clock background as previously explained by [MENTION=704359]fisha21[/MENTION], the first thing you need to do is make your custom panel the same way as explained above at 1032x328 and save that in the drawable-xxhdpi folder.

Next

Compile your apk and place it on the desktop. Import the apk again and go to the Public.xml

Copy down the new Public ID for your custom panel. Follow the steps explained by fisha21. Instead of replacing the Public ID with the common_panel, use your new Public ID.

Save your edit, compile, and finished.

Results

​

​

Inverting Issues (Not intended for this Thread)

A lot of users are asking about inverting tips. I wasn’t going add any tutorials for that in this thread, but I figured I could do a couple until I get around to making a thread on it.

There are a few apks with Sense 6 that do not call on the resources colors. They do call on framework colors and if you don’t test your theme completely, you’ll probably find a disappointing background somewhere when you are finished. This tutorial will cover two elements that are not themed by resources, the call settings and mobile network settings background.

These two backgrounds call on the white color (line 4) in the framework color.xml. There are two ways to change the background for call settings and mobile network. The easiest way would be to redirect the color to another color in framework just as black as in my case. That’s great if you are running a black theme. Here’s the steps for that.

Step 1

Get the public ID for the white color in the Public.xml of frameworks which is 0x0106000b. Directly under that you’ll see the Public ID for black, 0x0106000c. Copy both down.

Step 2

Open the phone project and do a search for Public ID white 0x0106000b.

NOTE

: You need to remove the 0 after the x, so your search should be 0x106000b. You will be searching for this following smali and string.

com/android/phone/widget/ThemePreferenceActivity.smali
invoke-virtual {p0}, Lcom/htc/preference/HtcListActivity;->getHtcListView()Lcom/htc/widget/HtcListView;

move-result-object v3

const v4, 0x106000b

invoke-virtual {v3, v4}, Landroid/view/View;->setBackgroundResource(I)

Step 3

Edit the value indicated above. Compile and you’re finished.

If your background is a different color, let’s say light green, you’re going to need to make a custom colour.

Step 1

Go to the color.xml of the Phone apk. Copy one of the strings and paste it near the bottom or top. Rename the string to your custom name and change the colour hex.

Step 2

Build the apk, place on your desktop and import it again. Go to the Public.xml and copy your new ID for your custom colour. Now, repeat the steps above and search for the Public ID white 0x106000b and replace that with your new ID. Compile and you’re finished.

Results

​

​

Inverting Data Usage Background

The data usage background can be found in the Usage.apk. Once decompiled, you will need to go to the layout.xml.

Step 1

Search in the main_content.xml and look for this string.

<?xml version="1.0" encoding="utf-8"?>
<com.htc.usage.widget.MyFrameLayout android:id="@id/mycontent" android:background="[COLOR="Red"]#ff000000[/COLOR]" android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android" />

For this quick tutorial, the edit has been done already in black. Make your backgound to the colour you prefer and compile. Finished.

Results

​

​

Inverting Weather.apk Backgrounds

Another theming disaster is the Weather.apk. This background can be changed by following the framework.apk Public ID for white method or making a new color reference in the Weather.apk, color.xml.

Step 1

If you just want a black background like I did, all you need to do is search the Weather.apk smali files for 0x106000b. There will be 4 hits and all refer to backgrounds.

Search for

0x106000b

Look for the following string in WeatherEntry$CityListAdaptor.smali

iget-object v14, v0, Lcom/htc/Weather/WeatherEntry$CityListAdapter;->mLayout:Landroid/widget/RelativeLayout;

const v15, 0x106000b

invoke-virtual {v14, v15}, Landroid/view/View;->setBackgroundResource(I)V

const v14, 0x106000b

invoke-virtual {v13, v14}, Landroid/view/View;->setBackgroundResource(I)V

Change 0x106000b to 0x106000c (My case I changed all 4 instances)

Step 2

If you need a different coloured background, you will need to make a custom colour in the color.xml of the Weather.apk. Please follow the instructions mentioned above on how to add a custom colour to the apk.

Background in Browser.apk when Nagivating Tabs

All credits for this edit go to [MENTION=918378]Basil3[/MENTION] as we double-teamed up on this one and he found it on the day-shift. Good on ya, mate.

Step 1

Get a pencil and copy this down

Step 2

Search smali in Browser.apk for

.method public constructor <init>(Lcom/htc/sense/browser/PhoneUi;Lcom/htc/sense/browser/htc/ui/CellList;)V

Within that search, you'll need to locate the following

# direct methods
.method public constructor <init>(Lcom/htc/sense/browser/PhoneUi;Lcom/htc/sense/browser/htc/ui/CellList;)V
.locals 10

const/16 v9, 0x11

const/4 v8, 0x0

const/4 v7, -0x1

const/4 v6, 0x1

const/4 v5, 0x0

invoke-virtual {p1}, Lcom/htc/sense/browser/BaseUi;->getActivity()Landroid/app/Activity;

move-result-object v2

Edit

const/4 v7, -0x1

Change to your desired smali color code. Remove the /4 from the string so that it shows

# direct methods
.method public constructor <init>(Lcom/htc/sense/browser/PhoneUi;Lcom/htc/sense/browser/htc/ui/CellList;)V
.locals 10

const/16 v9, 0x11

const/4 v8, 0x0

const v7, -0x1000000

const/4 v6, 0x1

const/4 v5, 0x0

invoke-virtual {p1}, Lcom/htc/sense/browser/BaseUi;->getActivity()Landroid/app/Activity;

move-result-object v2

Build and you're finished.

More Nasty Inverting Issues Resolved - HtcSetupWizard, HtcBackup, "Get Started Panel", Settings Issues Prism.apk

The following are inverting theme issues when dealing with HtcSetup and company apks. Each apk seems to have a specific edit so let’s start with the Prism.apk and the white panel “Get Started”

White box in Settings

There are a couple of nasty edits in the Prism.apk and I will be honest, it took me several days of trying and giving up only to get back on it again to find the fix. The first fix is a white box that you see when choosing new content in settings.

​

This fix is relatively easy. You need to theme the common_circle_pressed.png found in the xxhdpi folder in Prism.apk. That’s it.

White panel in Blinkfeed page “Get Started”

White panel in Blinkfeed page “Get Started” – This edit I want to recognize [MENTION=5386198]Mikanoshi[/MENTION] for providing some excellent clues on finding this edit as well as introducing me to an outstanding search tool. Cheers mate.

This was a tough one. This edit comes from the smali.

com.htc.libmosaicview.FeedGridViewText

You want to look around line 540 and search for

invoke-virtual {v0, v1, v2}, Lcom/htc/libfeedframework/FeedData;->getBooleanExtra(Ljava/lang/String;Z)Z

move-result v0

if-eqz v0, :cond_0

const v0, -0x1000000

invoke-virtual {p0, v0}, Lcom/htc/libmosaicview/FeedGridViewText;->setBackgroundColor(I)V

This edit has been done already. Don’t forget to delete the /4 after const. Build and you’re finished.

​

White Drop down panel – “Tap to see new stories”

This edit was strange as I seldom see this drop down panel. Any event, I found it in Prism.apk located in the

specific_feed_grid_view.xml

Look for

<TextView android:gravity="center" android:id="@id/notify_title" android:background="@color/razor_blue" android:layout_width="fill_parent" android:layout_height="@dimen/notification_bar_height" android:text="@string/notification_bar_title" style="@style/list_primary_s" />

For this specific edit, I decided to make a custom color and made the edit semi-transparent. Edit the color reference and you’re finished.

​

HtcBackup.apk – Background inverting fix.

If you are doing an inverted theme, you’re going to hit a couple of snags with the set up and back up apks. The HtcBackup.apk (for me) was relatively easy to do. Basically you are going to edit

Line 4: white:#ffffffff – change that to your desired color. Build and you’re finished.

Basil3 mentioned that his app was a data/app and that he had to do a different edit. Let me know if you have problems and I will add the additional fix later.

​

HtcSetupWizard.apk – Background inverting fix

Another issue came with this apk. With my buddy, [MENTION=918378]Basil3[/MENTION], we doubled teamed on my finding and fixed this mystery. The background and font are both controlled by the dark_primaryfont_color in resources. After some investigating, we found that the wizard.activity.xml contained a separate edit for the background

<?xml version="1.0" encoding="utf-8"?>
<com.htc.widget.HtcOverlapLayout android:orientation="vertical" android:id="@id/overlap_layout" android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout android:orientation="vertical" android:id="@id/base_layout" android:background="#ff000000" android:layout_width="fill_parent" android:layout_height="fill_parent">

You will need to change the background: reference and add your desired hex code. The edit has been applied here already.

​

<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>​

New Edits

Pop-up Window on HTC_IME - Word Correction

​

Thanks to [MENTION=5386198]Mikanoshi[/MENTION] for helping me find this edit. The pop-up window that appears when using the HTC_IME keyword after an error occurs when typing can be found the the framework.jar. You will need to look in the

Editor$SuggestionsPopupWindow.smali

Look around line 1131 and 1142 (that's where it's found in my framework)

You'll need to change the color reference indicated in your framework and make them your choice of color. I have made my around 75% transparent and it seems to look nice against a dark background.

The stock colors are smali -0x202021 (#ffdfdfdf) and -0x111112 (#ffeeeeee). I use #be000000 (-0x42000000) and that worked well for me.

​