Database Develop

(08-15)Noobs guide to changing the Status bar font color

I was having a very difficult finding any information on how to modify the font color in the status bar so I decided it would be best to document it...here on xda.
What's covered in this thread:
How to edit the font color on the status bar.
How to make the status bar transparent
Credit:
Gruesomewolf For giving me the initial instructions on how to make background and status bar transparent.
JsChiSurf For guiding me through what I was doing wrong in order to make the status bar transparent.
xml items to modify the font in the status bar
Located in SystemUI.apk
layout>status_bar_expanded.xml
*This changes the Gingeritis 3D BETA VII font color and font size (Or Sprint if EVO)
<TextView android:textAppearance="@style/TextAppearance.StatusBar.Title" android:textSize="21.0px" android:textColor="#ff58aad0"
For EVO/EVO 3D the line code is:
<com.htc.widget.HtcBlinkingTextView android:textAppearance="?android:textAppearanceLarge" android:textSize="@dimen/status_bar_title_font_size" android:textColor="#ff58AAD0"
For the EVO/EVO 3D Clear button:
<TextView android:textSize="@dimen/clear_button_font_size" android:textColor="#ff58aad0"
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
layout>quick_settings.xml
*To change the color of the quick setting font color in the status bar
<TextView android:textAppearance="@style/TextAppearance.StatusBar.Title" android:textSize="21.0px" android:textColor="#ff58aad0"
values>Drawables
*To change the color of the Status bar Nofication Font
item type="drawable" name="APKTOOL_DUMMY_015c">false</item>
<item type="drawable" name="shade_bgcolor">#ff282828</item>
<item type="drawable" name="notification_header_text_color">#ff58aad0</item> <<<<----This changes the Text, "Notification seen in the top of the status bar while under Notifications
<item type="drawable" name="notification_number_text_color">#ff000000</item> <<Change back to white
<item type="drawable" name="list_item_background">#ffffffff</item>
<item type="drawable" name="list_item_background_gray">#fff2f2f2</item>
values>Colors
*Changes the primary and secondary status bar font color
<color name="white">#ff58aad0</color> <<<<<----This changes what the font color is when pressed on the status bar
<color name="black">#ff000000</color>
<color name="half_white">#7fffffff</color>
<color name="half_black">#7f000000</color>
<color name="primary_text_color">#ffffffff</color> <<<<---Primary Font Color
<color name="secondary_text_color">#ff000000</color> <<<<----Secondary Font Color
values>styles
*Changes the status bar font from bold to normal (What says Ginergitis 3D V1.0/Sprint) If you don't want it bold. It looks better bolded
*It also changes the bold appearance of the secondary font. They both look better bolded
<style name="TextAppearance.StatusBar.Title" parent="@android:style/TextAppearance.StatusBar">
<item name="android:textAppearance">?android:textAppearanceSmall</item>
<item name="android:textSize">15.0sp</item>
<item name="android:textStyle">bold</item> <<<<-----change to normal for none bold font
<item name="android:textColor">@drawable/notification_header_text_color</item>
End Result of changing colors
As I learn more about the status bar, I'll be updating this thread.
How to make the status bar transparent
Decompile the SystemUI.apk, the smali edits to enable transparency are as fallows
Open up "StatusBarService.smali", located in /smali/com/android/systemui/statusbar/"
Look for this line:
Code:
.line 504 .local v7, view:Lcom/android/systemui/statusbar/StatusBarView;
Directly below that are these lines:
Code:
const/4 v1, 0x2
iput v1, p0, Lcom/android/systemui/statusbar/StatusBarService;->mPixelFormat:I
.line 506
Delete those lines
Several lines below that you should find this line:
Code:
iget v5, p0, Lcom/android/systemui/statusbar/StatusBarService;->mPixelFormat:I
Change that to this
Code:
const/4 v5, -0x3
Next find this line:
Code:
.line 1731
const/4 v5, 0x2
Change it to: (note this line should be under .method onBarViewAttached()V)
Code:
.line 1731
const/4 v5, -0x3
Smali editing is complete!
Then we have to do some xml editing!
Look for "status_bar_tracking.xml", found in /res/layout <<<<Should be status_bar_expanded.xml
Line:
Code:
<View android:id="@id/background" android:background="@drawable/list_item_background"
change to:
Code:
<View android:background="@drawable/status_bar_background"
After find this line:
Code:
<View android:id="@id/tab_header" android:background="@drawable/list_item_background"
and again change to this
Code:
<View android:background="@drawable/status_bar_background"
Done!! Recompile .apk
Im sure by now you can see that we will now be able to simply make the .png named status_bar_backround transparent and thats that! Hope this helps!
EDIT:
status_bar_expanded.xml is what you need to edit. BTW, you do not reference the .9 when referencing .pngs. The system handles this automatically.
The background is hard coded in status_bar_expanded, and you have to re-arrange things.
list_item_background is what controls the default background / color for the notifications. It is fixed to a color. You can change the color, or even change it to point to an image if you want, such as the image you are attempting to modify, or assign it a full transparency if you don't want an image in the background, but rather, just for it to be clear, "#00000000".
Change the Quick Settings status bar to Transparent
Open up quick_setttings.xml found in res/layout/
Look for this line:
Code:
<LinearLayout android:orientation="vertical" android:background="@drawable/list_item_background" android:layout_width="fill_parent" android:layout_height="wrap_content">
Change "list_item_background to status_bar_background
It should look like this:
Code:
<LinearLayout android:orientation="vertical" android:background="@drawable/status_bar_background" android:layout_width="fill_parent" android:layout_height="wrap_content">
FAQ
Q:I placed @drawable/status_bar_background to anyplace it said @drawable/list_item_background.
However, my transparent png is located in SystemUI.apk/drawable-hdpi. Will the system still find it even though the code says, "drawable?"
A: Your close. It all depends on how your XML is laid out as it relates to parents / children, and their respective backgrounds, etc. It seems you should get want you want.
in terms of hdpi folders, etc, this too is automatically chosen by the phone, based on its resolution, etc, and you always reference simply as 'drawable' in your XML.
Q:Also, my png is named: status_bar_item_background_normal.9.png. Which is different from "status_bar_background." Will the system know what png I'm wanting to use even though it's not named the same?
A: status_bar_background is typically just the curtain, again, based on how your XML is laid out, meaning the background beneath the notifications but above the "drag bar".
Disclaimer:
If you have a customized .9 png (be careful, you must use care when editing .9 pngs as they have meta information on how they can be stretched), you can change the background to point to the exact name (less the .9.png extension, instead of status_bar_background) and see what happens.
You may also want to consider decompiling some of the SystemUI.apk files I recently posted, as I had to re-arrange some of the background settings to get things to show how I wanted, and it may help you see what I did as an example.
How to Remap the clear button:
Note: The below picture represents the clear button remap before liamstears edited it. With the below code, the clear button will be fixed and the blank status bar should no longer appear.
Credit:liamstears
Found in:res/layout/status_bar_expanded.xml
Code:
<?xml version="1.0" encoding="utf-8"?>
<com.android.systemui.statusbar.ExpandedView android:orientation="horizontal" android:focusable="true" android:descendantFocusability="afterDescendants"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content">
<LinearLayout android:gravity="center_vertical" android:orientation="horizontal" android:background="@drawable/status_bar_header_background" android:paddingRight="@dimen/clear_button_padding_right" android:layout_width="fill_parent" android:layout_height="wrap_content">
<com.android.systemui.statusbar.CarrierLabel android:gravity="center_vertical" android:layout_gravity="center_vertical" android:orientation="vertical" android:id="@id/carrierLabel" android:paddingLeft="5.0dip" android:paddingTop="1.0dip" android:paddingBottom="1.0dip" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0">
<com.htc.widget.HtcBlinkingTextView android:textAppearance="?android:textAppearanceLarge" android:textSize="@dimen/status_bar_title_font_size" android:textColor="#ffffffff" android:layout_gravity="center_vertical" android:id="@id/plmnLabel" android:paddingLeft="4.0dip" android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:textAppearance="?android:textAppearanceLarge" android:textSize="@dimen/status_bar_title_font_size" android:textColor="#ffffffff" android:layout_gravity="center_vertical" android:id="@id/spnLabel" android:paddingLeft="4.0dip" android:layout_width="wrap_content" android:layout_height="wrap_content" />
</com.android.systemui.statusbar.CarrierLabel>
</LinearLayout>
<FrameLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="1.0">
<ScrollView android:id="@id/scroll" android:fadingEdge="none" android:layout_width="fill_parent" android:layout_height="fill_parent" android:overScrollMode="ifContentScrolls">
<com.android.systemui.statusbar.NotificationLinearLayout android:orientation="vertical" android:id="@id/notificationLinearLayout" android:layout_width="fill_parent" android:layout_height="wrap_content">
<TextView android:textAppearance="@style/TextAppearance.StatusBar.Title" android:id="@id/noNotificationsTitle" android:background="@drawable/title_bar_portrait" android:paddingLeft="14.0px" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/status_bar_no_notifications_title" />
<TextView android:textAppearance="@style/TextAppearance.StatusBar.Title" android:id="@id/ongoingTitle" android:background="@drawable/title_bar_portrait" android:paddingLeft="14.0px" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/status_bar_ongoing_events_title" />
<LinearLayout android:orientation="vertical" android:id="@id/ongoingItems" android:layout_width="fill_parent" android:layout_height="wrap_content" android:drawable="@drawable/list_item_background" />
<TextView android:textAppearance="@style/TextAppearance.StatusBar.Title" android:id="@id/latestTitle" android:background="@drawable/title_bar_portrait" android:paddingLeft="14.0px" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/status_bar_latest_events_title" />
<LinearLayout android:orientation="vertical" android:id="@id/latestItems" android:layout_width="fill_parent" android:layout_height="wrap_content" android:drawable="@drawable/list_item_background" />
<TextView android:textSize="@dimen/clear_button_font_size" android:textColor="#ffffffff" android:layout_gravity="center" android:id="@id/clear_all_button" android:background="@drawable/btn_default_small" android:layout_width="fill_parent" android:layout_height="40.0dip" android:text="@string/status_bar_clear_all_button" style="?android:buttonStyle" />
</com.android.systemui.statusbar.NotificationLinearLayout>
</ScrollView>
<ImageView android:layout_width="fill_parent" android:layout_height="fill_parent" android:src="@drawable/title_bar_shadow" android:scaleType="fitXY" />
</FrameLayout>
</LinearLayout>
<ImageView android:id="@id/tab_divider" android:layout_width="2.0px" android:layout_height="fill_parent" android:src="@drawable/notification_separator" android:scaleType="fitXY" />
</com.android.systemui.statusbar.ExpandedView>
The main line that makes this work is as follows:
Code:
<TextView android:textSize="@dimen/clear_button_font_size" android:textColor="#ffffffff" android:layout_gravity="center" android:id="@id/clear_all_button" android:background="@drawable/btn_default_small" android:layout_width="fill_parent" android:layout_height="40.0dip" android:text="@string/status_bar_clear_all_button" style="?android:buttonStyle" />

Once again good job man!
btw the original instructions for transparency can be found here. I believe they were the same ones wolf gave you ;-)
http://forum.xda-developers.com/showpost.php?p=15199389&postcount=1237
and what is this about jschisurf? He's still around! woot woot

Dude what's that theme that your using? It looks awesome!
Sent from my ADR6300 using XDA App

tommytomatoe said:
Once again good job man!
btw the original instructions for transparency can be found here. I believe they were the same ones wolf gave you ;-)
http://forum.xda-developers.com/showpost.php?p=15199389&postcount=1237
and what is this about jschisurf? He's still around! woot woot
Click to expand...
Click to collapse
Awesome thread you posted. Thanks. I'm sure I missed something because the quick setttings status bar isn't transparent like the notification bar is. I'm sure I'll figure out what I did wrong after reading your post, thanks.

[Q/A] Theming questions

I know this isn't the question/answer section, but it is the theming section. This will probably also get lost in all the other threads, but I figured there are enough people that have asked questions it might be a good idea to make this thread. The idea is, post a question, any question, about theming and me or someone else will answer it. I'm not a theming genius but I know a bit about theming and there are many more people that know much more than I do that might be able to help. This can also be a discussion place for people to figure out how to solve issues that no one is quite sure how to solve yet. I will post a few of the posts that I can find that answer some of the questions people have asked as a basis to get started.
Some people don't know where to start, so here are the "tools of the trade."​
Graphics Editing Software
___________________________________________
You will need some sort of image manipulation or graphics editing software. There are some free options out there and some not so free, but you can usually find a quality program to fit your budget.
This s a list of good programs that I know of, but I have only actually used GIMP and Photoshop.
-GIMP (FREE - Linux/Windows/Mac)
-Photoshop (PAID - Windows/Mac) Here's a quick tip if you want to use Photoshop.
-PaintShop Pro (PAID - Windows)
-Pixelmator (PAID - Mac)
-Paint.NET (FREE - Windows)
Android SDK
___________________________________________
The Android SDK contains a set of tools that are essential to theming.
Get the SDK here.
(will update in the future with what these tools are and how to use them)
Tools you will need:
- Draw 9-Patch (/tools directory of the sdk)
- DDMS (/tools directory of the sdk)
- Zipalign (/tools directory of the sdk)
- ADB (/platform-tools directory of the sdk)
APK Manager (apk tool)
___________________________________________
APK Manager is a simple to use, easy to understand tool that utilizes apk tool, zipalign, and a bunch of other tools. I recommend using this as it is easier to use for newer people, but I prefer to use apktool as it is more versatile.
I always had problems with the apk tool that APK Manager 4.9 comes with, so if it doesn't work for you (mainly on Samsung ROMs as far as I know) you may want to replace the apktool.jar in the /other directory of the APK Manager with this apktool.jar.
7-zip - WinRAR
___________________________________________
This is definitely a must. Windows has a built in .zip browser but I strongly recommend using 7-zip or WinRAR. I personally like 7-zip more, but that is all personal preference. You can open APK files as an archive, without having to decompile it. This allows you to do quick .png editing, or you can even replace post-compiled xml with other post-compiled xml if you so desire.
OptiPNG
___________________________________________
This isn't essential but it is something I strongly recommend as a "quality" standpoint. OptiPNG allows you to optimize the .png's in your theme by recompressing the image files down to a smaller size, allowing them to be loaded faster. Don't worry though, no information or quality is lost in the process.
Notepad ++
___________________________________________
This is another essential tool for theming. Notepad ++ is by-far the best text-editing program on the market for Windows. At least, in my opinion. It is also free. Basically if you want to do any xml editing, you need this tool. You can also do just about anything else that you want to do with it...​
Q:
Could someone please tell me where the background color can be modified for the menu button (wallpaper, settings, search, etc)? I have been looking everywhere for this, but I am not finding it.
Click to expand...
Click to collapse
A:
There are a few things to look for to get the look that you want.
in /res/values/styles.xml depending on what you have for this set of xml determines which .png's the framework is using:
Code:
<style name="Theme.IconMenu" parent="@style/Theme">
<item name="windowAnimationStyle">@style/Animation.OptionsPanel</item>
<item name="background">@null</item>
<item name="itemTextAppearance">@style/TextAppearance.Widget.IconMenu.Item</item>
<item name="horizontalDivider">@drawable/divider_horizontal_bright</item>
<item name="verticalDivider">@drawable/divider_vertical_bright</item>
<item name="itemBackground">@drawable/menu_selector</item>
<item name="itemIconDisabledAlpha">?disabledAlpha</item>
<item name="moreIcon">@drawable/ic_menu_more</item>
</style>
but if you are using an existing theme that is darker then the chances are it will be something like this:
Code:
<style name="Theme.IconMenu" parent="@style/Theme">
<item name="windowAnimationStyle">@style/Animation.OptionsPanel</item>
<item name="background">@null</item>
<item name="itemTextAppearance">@style/TextAppearance.Widget.IconMenu.Item</item>
<item name="horizontalDivider">@drawable/divider_horizontal_dark</item>
<item name="verticalDivider">@drawable/divider_vertical_dark</item>
<item name="itemBackground">@drawable/menu_selector</item>
<item name="itemIconDisabledAlpha">?disabledAlpha</item>
<item name="moreIcon">@drawable/ic_menu_more</item>
</style>
Now with that said, if it is using the first case, you will be looking for files named "divider_horizontal_bright.9.png" and "divider_vertical_bright.9.png". They are .9.png's so deal with them accordingly. Now if you have the second case then you are going to look for "divider_horizontal_dark.9.png" and "divider_vertical_dark.9.png".
Edit those to get your desired effect, but those are only the dividers of the menu.
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Now I'm going to go back over the xml to show you what I'm looking at.
Code:
<item name="horizontalDivider">[COLOR="Blue"]@drawable/divider_horizontal_bright[/COLOR]</item>
<item name="verticalDivider">[COLOR="Blue"]@drawable/divider_vertical_bright[/COLOR]</item>
Code:
<item name="horizontalDivider">[COLOR="Red"]@drawable/divider_horizontal_dark[/COLOR]</item>
<item name="verticalDivider">[COLOR="Red"]@drawable/divider_vertical_dark[/COLOR]</item>
Those two items determine which .png the framework is looking at, and using that will tell you what to look for when you are editing your theme.
Now lets look at a much more rather obscure portion of the xml, but it still tells you where to look. Under "<style name="Theme">" near the beginning of the styles.xml, there is a long list of items pointing to different .png's in the framework. The one we are interested in is:
Code:
<item name="panelBackground">[COLOR="Purple"]@drawable/menu_background[/COLOR]</item>
<item name="panelFullBackground">[COLOR="Purple"]@drawable/menu_background_fill_parent_width[/COLOR]</item>
This tells you what to look for to edit the background of the menu, and the "top" horizontal bar if you want one.
So look for "menu_background.9.png" and "menu_background_fill_parent_width.9.png". Edit them to have the same look, because the "menu_background_fill_parent_width.9.png" is what you get when you press the menu button, and the "menu_background.9.png" is what you get when you press the "more" button. Again, these are .9.png's so edit them accordingly. If you have any more questions, please ask! I tried to make this as clear as I possibly could.
Also, you don't really NEED to decompile the framework to do it, I just wanted you to maybe learn something instead of just following instructions like must people do.
Click to expand...
Click to collapse
Click to expand...
Click to collapse

Continued from last post:
Q:
I have been searching how to make the status bar transparent but I can't seem to find a way to do it. I have managed to get my drop down notification screen transparent but no luck with the status bar.
Click to expand...
Click to collapse
A:
Decompile SystemUI.apk, in smali/com/android/systemui/statusbar/StatusBarService.smali
search for
Code:
const/4 v5, 0x2
and replace it with
Code:
const/4 v5, -0x3
Recompile SystemUI.apk, and you should be up and running.
(someone replied to that one and said it didn't work but the OP thanked my post and never said there was a problem, so it may have just been a user error. I have never personally had to do this myself)
Click to expand...
Click to collapse
Click to expand...
Click to collapse
Q:
can someone tell me how to change the font colour for notifications in the drop down?
Click to expand...
Click to collapse
A:
1. In framework-res.apk/res/layout/status_bar_latest_event_content.xml there are two things to look at; the line with
Code:
android:id="@id/title"
controls the title of the notification. "android:textColor" is what you need to modify, and the format of the number is "#AARRGGBB"
2. Then there is the line with
Code:
android:id="@id/text"
which controls the description of the notification. Do the same thing you did with the title.
Here's a screenshot, the numbers correspond with the item that I talked about above.
Click to expand...
Click to collapse
Click to expand...
Click to collapse
Q:
I cannot get the status bar to change at all. I've got a status bar image sitting in framework-res.apk, SystemUI.apk, and it is still solid black. I cannot figure out what I need to change to use the custom image.
Click to expand...
Click to collapse
A:
look in your System.apk, /res/layout/status_bar.xml. Now the second line down will probably look something like this:
Code:
<com.android.systemui.statusbar.StatusBarView android:orientation="vertical" [U][B]android:background="#ff000000"[/B][/U]android:focusable="true" android:descendantFocusability="afterDescendants"
I put in bold what we are worried about. Basically, it doesn't really matter WHAT it is (even though if its black it will be that) as long as its not
Code:
android:background="@drawable/statusbar_background"
But you aren't done yet. The second to last line should look something like this:
Code:
<com.android.systemui.statusbar.DateView android:textAppearance="@android:style/TextAppearance.StatusBar.Icon" android:gravity="left|center" android:id="@id/date" [U][B]android:background="#ff000000"[/B][/U] android:paddingLeft="6.0px" android:paddingRight="6.0px" android:layout_width="wrap_content" android:layout_height="fill_parent" android:singleLine="true" />
Again, change the bolded part to
Code:
android:background="@drawable/statusbar_background"
Click to expand...
Click to collapse
Click to expand...
Click to collapse

I think this is a good idea. Count me in for support.
Sent from my GT-I9000 using XDA App

Glad to have you on board.

No way we can let this thread just die so I'll ask a question.
I'm trying to find the images to change the color of the volume sliders and progress bars. Not the progress animation but the green bars themselves and the slider buttons. I've attached a screenshot to show what I mean.
And thanks for making yourselves available for supporting us!

Those are not an image. They are an xml edit. In your decompiled fwres, you need to navigate to res/drawable/progress_horizontal. In there you are going to look for the last 6 hex code values. They should look like this.
Code:
<item android:id="@id/secondaryProgress">
<clip>
<shape>
<corners android:radius="4.659973dip" />
<gradient android:startColor="#50537cb2" android:endColor="#802b415e" android:angle="270.0" android:centerColor="#8096b6e0" />
</shape>
</clip>
</item>
<item android:id="@id/progress">
<clip>
<shape>
<corners android:radius="4.659973dip" />
<gradient android:startColor="#ff537cb2" android:endColor="#ff2b415e" android:angle="270.0" android:centerColor="#ff96b6e0" />
</shape>
The values create a gradient. The starting color is the top of your bar, ending the bottom, and center....well the center. You can make all three the same color to have it a solid, or play around with it to get a 3D feel. The code I posted is what we use for Mosaic. Edit both sets. You will find one more set in this xml but they are the values for the gray background...you can play with that as well if you wanna have fun.

Yup! And here is the one I use for Blue Darkness too, just for reference:
Code:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@id/background">
<shape>
<corners android:radius="2.659973dip" />
<gradient android:startColor="#ff000000" android:endColor="#ff000000" android:angle="270.0" android:centerColor="#00000000" />
</shape>
</item>
<item android:id="@id/secondaryProgress">
<clip>
<shape>
<corners android:radius="2.659973dip" />
<gradient android:startColor="#00000000" android:endColor="#00000000" android:angle="270.0" android:centerColor="#80084eff" />
</shape>
</clip>
</item>
<item android:id="@id/progress">
<clip>
<shape>
<corners android:radius="2.659973dip" />
<gradient android:startColor="#00000000" android:endColor="#00000000" android:angle="270.0" android:centerColor="#ff2b79fb" />
</shape>
</clip>
</item>
</layer-list>
BUT you can use images, but you have to do it correctly. Take a look at Honeycomb progress bars if you are interested.

Awesome, very helpful as always. Now how about the buttons on the sliders?

Jirv311 said:
Awesome, very helpful as always. Now how about the buttons on the sliders?
Click to expand...
Click to collapse
They are images in the few-res. Not at my computer right now but they are there.
sent using a phone from the future.

Jirv311 said:
Awesome, very helpful as always. Now how about the buttons on the sliders?
Click to expand...
Click to collapse
/res/drawable-hdpi/seek_thumb_normal.png and seek_thumb_pressed.png

NunHugger said:
They are images in the few-res. Not at my computer right now but they are there.
sent using a phone from the future.
Click to expand...
Click to collapse
bryman27 said:
/res/drawable-hdpi/seek_thumb_normal.png and seek_thumb_pressed.png
Click to expand...
Click to collapse
Yup, thank you both. I found those almost right after I posted. That's why I like this thread.

This is such an excellent thread. I wish this was around when I still had the time (and the drive) to theme.
Sent from my Captivate

great info here, though to a noob not wanting to do xml editing, all the changes discussed sofar can be done on the UOT kitchen, by uploading the system ui / framwork youre working on and clicking some check-boxes and selecting colors from a color chooser. super easy. http://uot.dakra.lt/
but dont get me wrong I LOVE the Q/A thing youre doing here, just might be scary to some, and there are other simpler options.

UOT is good, don't get me wrong but you cannot do the advanced things that really make a quality theme in it. It is much better to learn the xml and how to manipulate it to get what you want. I am learning more about the xml everyday as I work on my theme, but that's part of what theming is. Still wish I could have the knowledge and talent that some of these other themers have.

I know this is my thread, but I can still ask questions right?
In a newly flashed ROM this isn't a problem, but for someone like me I tend to have it. I want to know how to make the wallpaper go back to the default wallpaper after you flash the theme. Now I did some digging around and found that removing /data/data/com.android.settings/files/wallpaper will set the wallpaper back to default if the user is using a normal wallpaper. Does anyone know how to set it back to default if they are using a live wallpaper?

DemonWav said:
I know this is my thread, but I can still ask questions right?
In a newly flashed ROM this isn't a problem, but for someone like me I tend to have it. I want to know how to make the wallpaper go back to the default wallpaper after you flash the theme. Now I did some digging around and found that removing /data/data/com.android.settings/files/wallpaper will set the wallpaper back to default if the user is using a normal wallpaper. Does anyone know how to set it back to default if they are using a live wallpaper?
Click to expand...
Click to collapse
Try removing /data/system/wallpaper_info.xml

bryman27 said:
Try removing /data/system/wallpaper_info.xml
Click to expand...
Click to collapse
No, that didn't do it. I've been looking for what controls the Live Wallpaper so maybe I can change something there, but I'm not completely sure where to look.

DemonWav said:
No, that didn't do it. I've been looking for what controls the Live Wallpaper so maybe I can change something there, but I'm not completely sure where to look.
Click to expand...
Click to collapse
I noticed the same thing. When a Live Wallpaper is set, the wallpaper_info.xml doesn't seem to exist.
---------- Post added at 07:57 AM ---------- Previous post was at 07:56 AM ----------
Not sure if this is a theme question or not. I am using the AOSP lockscreen mod and for whatever reason, a lockscreen wallpaper will not set. It just takes on whatever the homescreen wallpaper is. Anybody know how to fix this?

wow great thread...been looking for something like this from some time....
EDIT: I think this should be sticky...

I figure I'll ask this on the very slim chance I do decide to try and theme again...
What are the tools of trade? i.e. What programs do I need to have readily available?

[GUIDE] Pattern Lock Tweaks - Wallpaper Brightness, Pattern Lock Dots, etc.

This is a summary of a Galaxy S II thread, but it should be applicable to other Android phones with a pattern lock. Some of this info is elsewhere in bits and pieces, but enough of it is new to warrant a full post. Plus it is helpful to have it all in one place.
Pattern Lock Wallpaper Brightness
Normally the pattern lock wallpaper is not as bright as the original image-- there's a dim or dark filter over it. To change this, decompile framework-res.apk (use apktool or apk_manager), and edit res\layout\keyguard_screen_unlock_portrait.xml.
On line 4, change android:background="#70000000" to android:background="@color/transparent"
Compile framework-res.apk and put it back into system\framework. Reboot and you should see that the pattern lock wallpaper is the same brightness as the original image! You can also try changing the "#70000000" to another hex color code for different effects.
Alternative by LfcFan1977:
LfcFan1977 said:
I am using a Htc Desire on dGB aosp rom but just to add to this thread. In the keyguard_screen_unlock_portrait.xml, I changed:
android:background="#70000000" to android:background="@drawable/patternlock_background"
Added an image called patternlock_background.png to the drawable-hdpi folder.
Click to expand...
Click to collapse
Pattern Lock Wallpaper Sizing
ICWiener_ said:
Hi,
a few month ago I investigated the size of the background image to fit the pattern dots, and after a few experiments I saw that android was doing a bit of resizing, even if the image was exactly the screen size.
What worked for me, is to make an image smaller than 800 in height (763px to be precise) and 480 in width (regular width of 1 screen). But when done editing, I stretch its height back to 800. Then, when applying within gallery ("use as..."), it stretch it back to undeformed.
I made a template in photoshop, for those who are interested, also with my actual pattern background. Still can't post urls here, so...it's hosted at mediafire.com :
Code:
/?fo04gtvp82y1xw1 (the template)
/?82txu5qxdea6usb (the background)
Click to expand...
Click to collapse
Pattern Lock Dots
I found the pattern lock dots to be too large and dark, covering up most of the wallpaper. I wanted to make the dots smaller and more transparent so that I could see the wallpaper but still see where the dot locations are.
The images for the pattern lock dots are in the framework-res.apk, under res\drawable-hdpi. These are png images so if you just want to change the dots, you do not need to use apktool to decompile framework-res.apk. Just open framework-res.apk with 7zip and replace the images directly.
These are the images you need to edit:
btn_code_lock_default.png -- This is the white dot in the middle
indicator_code_lock_point_area_default.png -- This is the dark circular background of the dot
Here are some replacement png's you can try: http://forum.xda-developers.com/showpost.php?p=17806354&postcount=5
For this one, I reduced both the white middle dot and the outer ring by 50%. Then I increased the transparency of both and made the outer ring a lighter gray.
I am not a Photoshop wiz, so I recommend Paint.NET as a free image editor that is relatively simple to use and works well with transparency.
Some other pattern lock dot images you can change (thanks ICWiener_):
ICWiener_ said:
The pngs that shows up when the pattern is the wrong one :
indicator_code_lock_point_area_red.png (the circle around)
indicator_code_lock_drag_direction_red_up.png (the arrow showing the direction)
And if you use "visible pattern" in the options, these are the green ones :
indicator_code_lock_point_area_green.png
indicator_code_lock_drag_direction_green_up.png
btn_code_lock_touched.png (the small dot in the center, touched version)
Click to expand...
Click to collapse
Pattern Lock Clock font
The clock font on the pattern lock screen is Clockopia.ttf located in /system/fonts. Replacing this file will replace the font. You can also use the Font Changer app, available on XDA or Market: http://forum.xda-developers.com/showthread.php?t=874658 (You'll find Clockopia in the "Advanced" tab of Font Changer.)
However, simply replacing Clockopia with a normal font results in placement issues. This thread on Rootzwiki gives a good description of the Clockopia alignment problem and how to fix it. Basically, use a font editor to replace the glyphs in the Clockopia.ttf with the glyphs from your favorite font.
As an example, here is a Roboto font replacement for Clockopia, where I replaced each of the Clockopia glyphs with the ones from Roboto. This font now aligns perfectly on the pattern lockscreen.
Pattern Lock Path Color [HELP NEEDED]
Big thanks to pendo for figuring out the pattern lock path color (the white semi-transparent line when you drag a pattern, if you have "Visible Pattern" enabled in Settings.) And also to LfcFan1977 for following up on this.
pendo said:
Decompile framework.jar and look in smali/com/android/internal/widget/LockPatternView.smali and look for a line like this
Code:
iget-object v2, p0, Lcom/android/internal/widget/LockPatternView;->mPathPaint:Landroid/graphics/Paint;
const/4 v3, -0x1
The "-0x1" is what you'd want to change. That's white. You should be able to just set any hex value you want.
Click to expand...
Click to collapse
LfcFan1977 said:
I could only get black 0x0 or white -0x1 until I changed it to the following:
Code:
.line 266
iget-object v2, p0, Lcom/android/internal/widget/LockPatternView;->mPathPaint:Landroid/graphics/Paint;
const/4 v3, [COLOR="Red"]0x0[/COLOR]
invoke-virtual {v2, v3}, Landroid/graphics/Paint;->setColor(I)V
.line 267
iget-object v2, p0, Lcom/android/internal/widget/LockPatternView;->mPathPaint:Landroid/graphics/Paint;
const/16 v3, [COLOR="Red"]0x0[/COLOR]
invoke-virtual {v2, v3}, Landroid/graphics/Paint;->setAlpha(I)V
Which gave me full transparency.
Click to expand...
Click to collapse
Sample Pattern Lock Screen
Here is a nice example of a custom pattern lock screen by LfcFan1977.
LfcFan1977 said:
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Click to expand...
Click to collapse
It would be great to see some wallpapers that incorporate the pattern lock into their design. There could be some pretty cool ideas by mixing a pattern lock wallpaper with custom pattern dots and lines.

Editing the Text / Information on the Pattern Lock Screen
Thanks to byrong for putting together a detailed reference on editing the various text elements on the pattern lock screen: [MOD] Pattern Lock screen - remove/add information Check out his thread for a great graphic on what parts of the XML match up with the various text elements.
To edit the text, decompile framework-res.apk (use apktool or apk_manager), and edit res\layout\keyguard_screen_unlock_portrait.xml.
In my case, I wanted to just add an extra line to the pattern lock screen to give my contact info, in case I lost my phone and somebody wanted to return it to me. So I just added an extra LinearLayout text block underneath the pattern lock dots, with smaller font size for a cleaner look.
Here is my change highlighted in red:
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="@id/patternlockscreenwallpaper_root" android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<com.android.internal.widget.LinearLayoutWithDefaultTouchRecepient android:gravity="center_horizontal" android:orientation="vertical" android:background="@color/transparent" android:layout_width="fill_parent" android:layout_height="fill_parent">
<RelativeLayout android:layout_width="fill_parent" android:layout_height="wrap_content">
<TextView android:textAppearance="?textAppearanceMedium" android:ellipsize="marquee" android:gravity="bottom|right|center" android:id="@id/carrier" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="6.0dip" android:layout_marginRight="8.0dip" android:singleLine="true" android:layout_toRightOf="@id/time" android:layout_alignParentTop="true" android:layout_alignParentRight="true" />
<com.android.internal.widget.DigitalClock android:id="@id/time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="20.0dip" android:layout_marginTop="15.0dip" android:layout_alignParentLeft="true" android:layout_alignParentTop="true">
<TextView android:textAppearance="?textAppearanceMedium" android:textSize="56.0sp" android:ellipsize="none" android:gravity="bottom" android:id="@id/timeDisplay" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="6.0dip" android:singleLine="true" android:shadowColor="#c0000000" android:shadowDx="0.0" android:shadowDy="0.0" android:shadowRadius="3.0" />
<TextView android:textAppearance="?textAppearanceMedium" android:textSize="18.0sp" android:ellipsize="none" android:gravity="bottom" android:id="@id/am_pm" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_marginLeft="4.0dip" android:singleLine="true" android:shadowColor="#c0000000" android:shadowDx="0.0" android:shadowDy="0.0" android:shadowRadius="3.0" />
</com.android.internal.widget.DigitalClock>
<TextView android:textAppearance="?textAppearanceMedium" android:id="@id/date" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_below="@id/time" />
</RelativeLayout>
<View android:id="@id/divider" android:background="@drawable/divider_horizontal_dark" android:layout_width="fill_parent" android:layout_height="1.0dip" android:layout_marginTop="8.0dip" android:layout_marginBottom="8.0dip" />
<LinearLayout android:gravity="left" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="12.0dip" android:layout_marginTop="0.0dip">
<TextView android:textAppearance="?textAppearanceMedium" android:textSize="18.0sp" android:id="@id/status1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawablePadding="4.0dip" />
<TextView android:textAppearance="?textAppearanceMedium" android:textSize="18.0sp" android:id="@id/statusSep" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="5.0dip" android:layout_marginRight="5.0dip" />
<TextView android:textAppearance="?textAppearanceMedium" android:textSize="18.0sp" android:id="@id/status2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawablePadding="4.0dip" android:layout_alignParentTop="true" />
</LinearLayout>
<com.android.internal.widget.LockPatternView android:id="@id/lockPattern" android:layout_width="fill_parent" android:layout_height="0.0dip" android:layout_marginTop="2.0dip" android:layout_weight="1.0" android:aspect="@string/lock_pattern_view_aspect" />
[COLOR="Red"]<LinearLayout android:gravity="center_horizontal" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="0.0dip" android:layout_marginTop="0.0dip">
<TextView android:textAppearance="?textAppearanceMedium" android:textSize="14.0sp" android:text="If found, please contact me at [email protected]" android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawablePadding="4.0dip" />
</LinearLayout>[/COLOR]
<FrameLayout android:layout_width="fill_parent" android:layout_height="wrap_content">
<RelativeLayout android:id="@id/footerNormal" android:layout_width="fill_parent" android:layout_height="fill_parent">
<Button android:id="@id/emergencyCallAlone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/lockscreen_emergency_call" android:drawableLeft="@drawable/ic_emergency" android:drawablePadding="8.0dip" android:layout_centerInParent="true" style="@style/Widget.Button.Transparent" />
</RelativeLayout>
<LinearLayout android:gravity="center" android:orientation="horizontal" android:id="@id/footerForgotPattern" android:layout_width="fill_parent" android:layout_height="fill_parent">
<Button android:id="@id/emergencyCallTogether" android:layout_width="0.0dip" android:layout_height="fill_parent" android:layout_marginLeft="4.0dip" android:layout_marginTop="4.0dip" android:layout_marginRight="2.0dip" android:layout_marginBottom="4.0dip" android:text="@string/lockscreen_emergency_call" android:drawableLeft="@drawable/ic_emergency" android:drawablePadding="8.0dip" android:layout_weight="1.0" style="@style/Widget.Button.Transparent" />
<Button android:id="@id/forgotPattern" android:visibility="invisible" android:layout_width="0.0dip" android:layout_height="fill_parent" android:layout_marginLeft="2.0dip" android:layout_marginTop="4.0dip" android:layout_marginRight="4.0dip" android:layout_marginBottom="4.0dip" android:layout_weight="1.0" style="@style/Widget.Button.Transparent" />
</LinearLayout>
</FrameLayout>
</com.android.internal.widget.LinearLayoutWithDefaultTouchRecepient>
</RelativeLayout>
Again, check out byrong's thread for more details and options.

[Reserved for future use.]

Pattern Lock Path Color [HELP NEEDED]
Here are some files I hope will shed light on what controls the white semi-transparent line that appears when we draw/finger drag a pattern.
See screenshot in [OP].
In the keyguard_screen_unlock_portrait.xml on line 18 is the following code which I assume is linked to the process.
If that is part of the process then I am confused as to why the end of that line does not appear in keyguard_screen_unlock_landscape.xml.
Code:
<com.android.internal.widget.LockPatternView android:id="@id/lockPattern" android:layout_width="fill_parent" android:layout_height="0.0dip" android:layout_marginTop="2.0dip" android:layout_weight="1.0" android:aspect="@string/lock_pattern_view_aspect" />
I have been looking at the source code LockPatternView here and a third of the way down there is reference to R.styleable.LockPatternView_aspect and all the images used for the lockpattern.
Amongst that is
Code:
mPathPaint.setColor(Color.WHITE); // TODO this should be from the style
but by this time I am completely lost and plucking at straws.
Any help would be very much appreciated.
keyguard_screen_unlock_portrait.xml
keyguard_screen_unlock_landscape.xml
LockPatternView.smali
LinearLayoutWithDefaultTouchRecepient.smali

Good info, thanks for posting this. Looking forward to the color answer. Someone has to have changed this before!

do you think there's any way we would be able to use the Samsung lock screen for the galaxy s2 (I like the messaging and music integration) but with a secondary lock with a pattern for example without a 3rd party app?

Do you not just need to press Menu - Settings - Location & security - Set up screen lock - Pattern.
Sorry if I have completely misunderstood you.

no, I'm looking for a sort of "double lock" without the use of a third party app. I remember my HTC hero back then had this feature where you would unlock the phone then enter the password. I think even iphones have the same feature.
I only need it now because syncing email requires that I have the security lock on the device

[Solved] Transparent drag/draw line
Big thanks to Pendo for pointing me right to the correct spot.
pendo said:
Decompile framework.jar and look in smali/com/android/internal/widget/LockPatternView.smali and look for a line like this
Code:
iget-object v2, p0, Lcom/android/internal/widget/LockPatternView;->mPathPaint:Landroid/graphics/Paint;
const/4 v3, -0x1
The "-0x1" is what you'd want to change. That's white. You should be able to just set any hex value you want.
Click to expand...
Click to collapse
Superb, thanks Pendo.
I could only get black 0x0 or white -0x1 until I changed it to the following:
Code:
.line 266
iget-object v2, p0, Lcom/android/internal/widget/LockPatternView;->mPathPaint:Landroid/graphics/Paint;
const/4 v3, [COLOR="Red"]0x0[/COLOR]
invoke-virtual {v2, v3}, Landroid/graphics/Paint;->setColor(I)V
.line 267
iget-object v2, p0, Lcom/android/internal/widget/LockPatternView;->mPathPaint:Landroid/graphics/Paint;
const/16 v3, [COLOR="Red"]0x0[/COLOR]
invoke-virtual {v2, v3}, Landroid/graphics/Paint;->setAlpha(I)V
Which gave me full transparency.
Need to have a play around with is some more because I could not get different colours to either show or even compile most times.
Again, that you very much for the help.

Got the pattern lock color change to work in a theme for my droid X. Thanks for this!

Helpful guide to changing the text displayed [MOD] Pattern Lock screen - remove/add information
New one
patternlock_background.png - 480x762
btn_code_lock_default.png - Transparent
btn_code_lock_touched.png - Fingerprint
indicator_code_lock_point_area_default.png - Transparent
indicator_code_lock_point_area_green.png - Transparent
indicator_code_lock_point_area_red.png - Transparent
indicator_code_lock_drag_direction_green_up.png - Semi transparent small white blurred dot
indicator_code_lock_drag_direction_red_up.png - Semi transparent small white blurred dot
ic_emergency.png - white
The drag/draw line described in post #9 is transparent.
Anybody know what the emergency call button is named?
On screen it is a semi transparent rectangle. To change its appearance I have added a red retangle to the patternlock_background.png but I would like to edit the actual button to match the other red parts of the screen.

Request from manishdev
I was asked to shared the imaged I used to create my patternlock screens.
It is a bit of a jumbled zip file but it should help recreate what I've done.
It contains two xml files but the are just added as a guide, they are in no way to be used as a straight swap with the ones in your framework-res.
Hope it is of use.
download zip

It's been a while since I visited this thread, but I updated the earlier posts with pendo and LfcFan's updates on the pattern lock path color, and also byrong's reference to the pattern lock text. Thanks to everybody for their great work and contributions!

I have been looking forever for this info...THANKS!!
Question though...When I open keyguard_screen_unlock_portrait.xml, no matter whether I use Notepad++, UltraEdit, and Dreamweaver, they all open with partial text and mostly jumbled code/images..etc.
Also, line 4 does have a little text, but it's not related. The closest text I can find to "android:background=..." is line 16 but it has the above jumbled code and an http address.
I'm on Skyrocket i727 4.0.3..
Am I just not opening/viewing the xml correctly?
I changed it to txt and uploaded in case anyone can take a look..

@BRIMS7ON3
You need to decompile framework-res to be able to edit an xml file.
Search for decompile or apktool. It takes a bit of work to set it all up but well worth the effort.

LfcFan1977 said:
You need to decompile framework-res to be able to edit an xml file.
Search for decompile or apktool. It takes a bit of work to set it all up but well worth the effort.
Click to expand...
Click to collapse
I opened it in 7-zip, then extracted the xml. I take it neither doing that nor unzipping it get the same results?
Sent from my SAMSUNG-SGH-I727 using xda premium

@BRIMS7ON3
BRIMS7ON3 said:
I opened it in 7-zip, then extracted the xml. I take it neither doing that nor unzipping it get the same results?
Sent from my SAMSUNG-SGH-I727 using xda premium
Click to expand...
Click to collapse
No, unzipping/extracting is ok for .png edits but for .9.png images, xml files and smali files, the only option is to decompile.

well aint that cute
thank you
p.s. do you maybe know how to change the pattern lock path size ? To make it thinner.

All I know is that will be in smali/com/android/internal/widget/LockPatternView.smali

Hi guys, i have two questions
- how do you decompile framework.jar ? I have tried by opening it with winrar but i have found only a preloaded-classes file and a meta-inf directory with a manifest.mf file. Nothing about the path you describe to change the color of the line you drag when unlock the screen
- how do you modify the png with the green and red circles ? With adobe photoshop i have to change the settings to rgb color but after that i obtain a very ugly image with black background.
Thanks for the help

[GUIDE][4.4.x][4.2.x]Theming Android SystemUI

This is a simple guide to understand how to theme systemui.apk on 4.4.x OR 4.2.x, this guide will work for any rom having aosp like user interface. Before you start reading this, you have to set up apktool correctly. Just to check if your apktool is correctly installed, you can decompile my DarkL rom's systemui.apk and then recompile it without making any changes, if it compiles successfully then you are ready to try this tutorial.
Also, you need notepad++ to edit xml or smali line by line and you need gimp to edit transparent pngs.
Now we will learn easy things first then move to more advanced things, so lets start with statusbar icons first, I'll add more things in this tutorial in coming days, Sorry, I'm lazy to type
1.Changing statusbar icons (Signal, wifi, alarm, vibration or silent icons etc.)-
First decompile your systemui and go to "/systemui/res/" folder.
Changing the statusbar icons is easiest, these are pngs located in /res/drawable-hdpi/ OR /res/drawable-xhdpi/ depending on your device resolution, if it's 480*800 then your device is hdpi else if your resolution is 1280*720 then your device is xhdpi. You need to make changes in the correct folder.
Now open your folder /res/drawable-hdpi/ OR /res/drawable-xhdpi/ and look for pngs starting with name "stat_sys_.....png"
For wifi icon, we have "stat_sys_wifi_signal_1_fully.png" , "stat_sys_wifi_signal_2_fully.png" and so on, till "stat_sys_wifi_signal_4_fully.png".
For signal icons, we have "stat_sys_gemini_signal_1_orange.png" , 2_orange , 3_orange and so on, If your device is dual sim, you have multi colored signals, orange, purple, green, blue, look for the appropriate png and edit/replace it.
View attachment 3208547
Similarly, all the icons appearing in your statusbar are present here, all start with "stat_sys_.....png" you can edit these pngs or replace them from an existing theme or rom.
Warning - Ask permissions from the developer of that rom/theme !!
Just to learn things, you can use my DarkL rom's systemui.apk and take pngs from it
2.Changing notification drawer background-
The semi transparent background of your notification drawer is a png located in /res/drawable-hdpi/ or /res/drawable-xhdpi/ according to your device resolution. You need to make changes in the correct folder for your device.
Now find "notification_panel_bg.9.png" in your folder, this is the notification background, I recommend you to rename it to "notification_panel_bg.png" because .9 pngs have a border and are tricky to edit.
Now right click on this png and edit it with gimp, erase it and fill any color you want to.
View attachment 3208550
3.Customizing quicksettings tiles (icons, background and gaps)-
Firstly, to change quicksettings icons like wifi, data, rotation, bluetooth etc. Go to correct folder according to your device /res/drawable-xhdpi/ OR /res/drawable-hdpi/ now you need to replace/edit the pngs starting with "ic_qs_....png" , all of them are for quicksettings.
View attachment 3208555
Similarly, all the icons appearing in your statusbar are present here, all start with "ic_qs_.....png" you can edit these pngs or replace them from an existing theme or rom.
Warning - Ask permissions from the developer of that rom/theme !!
Just to learn things, you can use my DarkL rom's systemui.apk and take pngs from it
Now, to change background of tiles, you have to edit "/res/drawable/qs_tile_background.xml", you need to know the hex codes of your desired color to edit them, use this website to convert RGB to hex or reverse.
Now open "/res/drawable/qs_tile_background.xml" and look for the two hex codes, first one is for pressed tile, second one is for normal tile. Erase the last 6 characters here and Put your own 6 character hex code of any color.
View attachment 3208558
Now to edit dimensions in systemui like gaps between quicksettings tiles and size of recent apps, open "/res/values/dimens.xml"
This file contains the size of various things, you can play with the values and maybe discover something awesome, below are few things you can try, just alter the blue colored value.
These two lines are for changing the size of recent apps-
Code:
[COLOR="red"] <dimen name="status_bar_recents_thumbnail_width">164.0dip</dimen>
<dimen name="status_bar_recents_thumbnail_height">145.0dip</dimen>[/COLOR]
This line for changing gap between two notifications-
Code:
[COLOR="red"] <dimen name="notification_divider_height">3.0dip</dimen>[/COLOR]
(To remove gap, put 0.0dip)
This line for changing gap between quicksettings tiles-
Code:
[COLOR="red"]<dimen name="quick_settings_cell_gap">3.0dip</dimen>[/COLOR]
Similarly, you can try changing anything here to resize various things in your notifications and quicksettings, It's time consuming but interesting.
4.Changing layout of clock in notification header-
Usually, the notification header of stock rom's systemui has clock in this format-
View attachment 3208560
I feel that It's a bit too long, So I'll tell a method to make it double line-
View attachment 3208574
To do this, firstly you need to increase the height of notification header, go to "res/values/dimens.xml" and find this line-
Code:
[COLOR="red"]<dimen name="notification_panel_header_height">40.0dip</dimen>[/COLOR]
Change the value here to 56dpi
Now, to make the clock double line, open "/res/layout/status_bar_expanded_header.xml" and find this code-
Code:
<LinearLayout android:enabled="false" android:gravity="center_vertical" android:orientation="vertical" android:id="@id/datetime" android:paddingLeft="3.0dip" android:paddingRight="0.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent">
<com.android.systemui.statusbar.policy.Clock android:textAppearance="@style/TextAppearance.StatusBar.Expanded.Clock" android:id="@id/clock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="2.0dip" android:singleLine="true" />
<com.android.systemui.statusbar.policy.DateView android:textAppearance="@style/TextAppearance.StatusBar.Expanded.Date" android:id="@id/date" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="2.0dip" android:singleLine="true" />
</LinearLayout>
See the tags LinearLayout, Just change it to RelativeLayout both above and below.
Code:
<RelativeLayout android:enabled="false" android:gravity="center_vertical" android:orientation="vertical" android:id="@id/datetime" android:paddingLeft="3.0dip" android:paddingRight="0.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent">
<com.android.systemui.statusbar.policy.Clock android:textAppearance="@style/TextAppearance.StatusBar.Expanded.Clock" android:id="@id/clock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="2.0dip" android:singleLine="true" />
<com.android.systemui.statusbar.policy.DateView android:textAppearance="@style/TextAppearance.StatusBar.Expanded.Date" android:id="@id/date" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="2.0dip" android:singleLine="true" />
</RelativeLayout>
Thank you for reading, more things I'll add later, too tired to type more.

Reserved
More to come

Very Nice guide.
Regards

Nice work, looking forward for more such helpful guides. :good:

How can I change the navbar (background & icons)?

If I am only interested in changing the icons (such as alarm icon, Bluetooth icon) , do I need to decompile the APK?
I tried to drag the pngs I wanted into the appropriate folder.
I can see that it is working, but not sure if it has any adverse effects.
Any advice?

albel said:
If I am only interested in changing the icons (such as alarm icon, Bluetooth icon) , do I need to decompile the APK?
I tried to drag the pngs I wanted into the appropriate folder.
I can see that it is working, but not sure if it has any adverse effects.
Any advice?
Click to expand...
Click to collapse
Yes, but drag and drop has limitations, you can only replace normal pngs but not .9 pngs, It's fine for you since statusbar icons are normal pngs only, they are not .9 pngs.

Mmmh!!! this is quiet new and much detailed. Big ups for the guide.

nicely done..thanks for your brilliant work..keep it up

Request
Can you add method to add brightness slider?

mr-illusionist said:
Can you add method to add brightness slider in kitkat roms?
Click to expand...
Click to collapse
Yes, I'll write about adding features in second post soon, I've also attached my rom's SystemUI.apk, you can decompile it and see /res/xml/notification_header_expanded.xml till then.

Plz can you add some information about . changing position of signal bars and WiFi from right to left ??
If yes then it will be very great of you .... Thanks in advance
Sent from my UF2021 using XDA Free mobile app

please i want to change this color
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
to this
wish xml file must be changed ?
sorry for my english

umangleekha said:
Yes, I'll write about adding features in second post soon, I've also attached my rom's SystemUI.apk, you can decompile it and see /res/xml/notification_header_expanded.xml till then.
Click to expand...
Click to collapse
Waiting for it bro. :good:

Do you have any method to insert brightness slider bar on systemui?

Subscribed..!! Thanx for this wonderful guide.. Waiting for the next part..

android.support.design.widget.AppBarLayout cannot be cast to android.view.ViewGroup.

Hello everyone,I am a Android beginner.When I run my project I have trouble in the Android Studio.And when the project is rendering, here are the notes:Rendering Problems Exception raised during rendering: android.support.design.widget.AppBarLayout cannot be cast to android.view.ViewGroup .And I check some information I don't find any answer.
And here are my activity_main.xml
Code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="/apk/res/android"
xmlns:app="/apk/res-auto"
xmlns:tools="/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.iqiqi.myapplication.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="@layout/content_main" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/fab_margin"
android:src="@android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
Here are the style.xml.
Code:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
</resources>
Here are the details.
Code:
java.lang.ClassCastException: android.support.design.widget.AppBarLayout cannot be cast to android.view.ViewGroup
at android.view.LayoutInflater.rInflate_Original(LayoutInflater.java:836)
at android.view.LayoutInflater_Delegate.rInflate(LayoutInflater_Delegate.java:70)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:811)
at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:798)
at android.view.LayoutInflater.rInflate_Original(LayoutInflater.java:838)
at android.view.LayoutInflater_Delegate.rInflate(LayoutInflater_Delegate.java:70)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:811)
at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:798)
at android.view.LayoutInflater.inflate(LayoutInflater.java:515)
at android.view.LayoutInflater.inflate(LayoutInflater.java:394)
at com.android.layoutlib.bridge.impl.RenderSessionImpl.inflate(RenderSessionImpl.java:223)
at com.android.layoutlib.bridge.Bridge.createSession(Bridge.java:426)
at com.android.ide.common.rendering.LayoutLibrary.createSession(LayoutLibrary.java:350)
at com.android.tools.idea.rendering.RenderTask$2.compute(RenderTask.java:510)
at com.android.tools.idea.rendering.RenderTask$2.compute(RenderTask.java:498)
at com.intellij.openapi.application.impl.ApplicationImpl.runReadAction(ApplicationImpl.java:888)
at com.android.tools.idea.rendering.RenderTask.createRenderSession(RenderTask.java:498)
at com.android.tools.idea.rendering.RenderTask.access$600(RenderTask.java:72)
at com.android.tools.idea.rendering.RenderTask$3.call(RenderTask.java:610)
at com.android.tools.idea.rendering.RenderTask$3.call(RenderTask.java:607)
at com.android.tools.idea.rendering.RenderService.runRenderAction(RenderService.java:362)
at com.android.tools.idea.rendering.RenderTask.render(RenderTask.java:607)
at com.android.tools.idea.rendering.RenderTask.render(RenderTask.java:629)
at org.jetbrains.android.uipreview.AndroidLayoutPreviewToolWindowManager.doRender(AndroidLayoutPreviewToolWindowManager.java:652)
at org.jetbrains.android.uipreview.AndroidLayoutPreviewToolWindowManager.access$1700(AndroidLayoutPreviewToolWindowManager.java:80)
at org.jetbrains.android.uipreview.AndroidLayoutPreviewToolWindowManager$7$1.run(AndroidLayoutPreviewToolWindowManager.java:594)
at com.intellij.openapi.progress.impl.CoreProgressManager$2.run(CoreProgressManager.java:152)
at com.intellij.openapi.progress.impl.CoreProgressManager.registerIndicatorAndRun(CoreProgressManager.java:452)
at com.intellij.openapi.progress.impl.CoreProgressManager.executeProcessUnderProgress(CoreProgressManager.java:402)
at com.intellij.openapi.progress.impl.ProgressManagerImpl.executeProcessUnderProgress(ProgressManagerImpl.java:54)
at com.intellij.openapi.progress.impl.CoreProgressManager.runProcess(CoreProgressManager.java:137)
at org.jetbrains.android.uipreview.AndroidLayoutPreviewToolWindowManager$7.run(AndroidLayoutPreviewToolWindowManager.java:589)
at com.intellij.util.ui.update.MergingUpdateQueue.execute(MergingUpdateQueue.java:320)
at com.intellij.util.ui.update.MergingUpdateQueue.execute(MergingUpdateQueue.java:310)
at com.intellij.util.ui.update.MergingUpdateQueue$2.run(MergingUpdateQueue.java:254)
at com.intellij.util.ui.update.MergingUpdateQueue.flush(MergingUpdateQueue.java:269)
at com.intellij.util.ui.update.MergingUpdateQueue.flush(MergingUpdateQueue.java:227)
at com.intellij.util.ui.update.MergingUpdateQueue.run(MergingUpdateQueue.java:217)
at com.intellij.util.concurrency.QueueProcessor.runSafely(QueueProcessor.java:238)
at com.intellij.util.Alarm$Request$1.run(Alarm.java:351)
at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:511)
at java.util.concurrent.FutureTask.run(FutureTask.java:266)
at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1142)
at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:617)
at java.lang.Thread.run(Thread.java:745)
And I don't know how to solve this,please tell me,thanks...

same problem, same error
Was an answer ever found for this issue? I have the exact same error list.
edit: finally found the solution and it was stupidly easy. This seems like a major flaw to have a major part of the software not working until you change a setting. https://www.youtube.com/watch?v=nYYP_G7V5NU

I encountered similar issues
Even I faced similar issue when I was working with coordinator layout, app bar layout, nested scroll view and bottom sheet.
I did lot of research on this. Some combination of views don't work as expected with coordinator layout.
Second point is if you override any framework or call back methods, make sure you call super method so that all the required setup for the frame work is done properly.
Those two points fixed my issues.
Hopefully that helps you or some one come here in search of the solution