Jump to content


Photo

[HOW TO] Make the Notification Bar Transparent


  • Please log in to reply
6 replies to this topic

#1
mattlokes

mattlokes

    Newbie

  • Members
  • Pip
  • 33 posts
  • Gender:Male
  • Location:UK
  • Devices:HTC Desire, Advent Vega

############## [GUIDE TO] Make the Notification Bar Transparent ###########



This works best with a Live-Wallpaper!

This is guide is split into two parts.

Part 1: Installing Notification Bar Mod Packs Created by Me

Part 2: Creating Your Own Notification GUI Hacks

The usual disclaimer... I can't be held responsible for anything that could happen with following this guide, I have done the procedure in Part 1
about 20 times and never broken anything, all modifications are of the GUI nature and should not cause any problems.

IMPORTANT NOTE: Could require you to re sync with your Google Account with the Device!

Hope everyone finds something they are looking for here!

######## PART 1 ######## INSTALLING NOTIFICATION BAR MOD PACKS #################



You will need:

- ADB
- A bit of command line know how ;)
- One of the Mod Packs below.

Steps

1. Download one of the Mod Packs below and extract (unzip)
2. Copy the files framework-res.apk & services.jar to the directory containing adb.exe or adb-windows.exe.
3. Open up CMD and navigate to the same directory as above.
4. Make sure USB Debugging is enabled on the Vega. (Oh and make sure the device is in USB Slave mode!)
5. Enter the following commands to make a backup of your current notification bar files:

adb remount
 adb pull system/framework/framework-res.apk framework-res-backup.apk
 adb pull system/framework/services.jar services-backup.jar

6. Now to Apply the Mod Pack enter the following commands:

adb remount
 adb shell rm system/framework/services.jar
 adb shell rm system/framework/framework-res.apk
 adb push services.jar system/framework/services.jar
 adb push framework-res.apk system/framework/framework-res.apk
 adb reboot

7. If any error messages appear on the Vega at this point don't worry, the Vega will now reboot!
8. When the Vega boots up you can enjoy your new notification bar!

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
FAQ
Q: When I try to push one of the files across it says that I have insufficient space.

A: To free up some space try removing all of the ringtones to do this:
adb remount
adb shell
# cd system/media/audio/ringtones/
# rm *.ogg
# exit
adb reboot

The device will boot up blank but ADB will still be running so retry step 6 from above
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


Completely Transparent Notification bar Mod Pack

Attached File  trans.png   75.66KB   373 downloads

Download: MEDIAFIRE MIRROR TRANSPARENT



Red Transparent Notification bar Mod Pack

Attached File  redtrans.png   71.91KB   140 downloads

Download: MEDIAFIRE MIRROR RED



Blue Transparent Notification bar Mod Pack

Attached File  bluetrans.png   80.79KB   123 downloads

Download: MEDIAFIRE MIRROR BLUE




Grey Transparent Notification bar Mod Pack

Attached File  greytrans.png   75.93KB   201 downloads

Download: MEDIAFIRE MIRROR GREY



######## PART 2 ######## CREATING YOUR OWN NOTIFICATION BAR GUI HACKS #################


WARNING: This is a fair bit more difficult than Part One but if you have read and understood Part One for some of the basics then it should be done without to much difficulty.

You will need:

- ADB
- Intermediate Command Line Knowledge ;)
- Image Editor which can do alpha channels I used GIMP but I imagine Photoshop will also work.
- WINRAR
- Smali http://code.google.com/p/smali/
- Hex Editor

Steps:

1. First retrieve framework-res.apk from your Vega and save a copy of it to a safe place.

adb remount
 adb pull system/framework/framework-res.apk framework-res.apk

2. Using WINRAR open up the framework-res.apk so that you can see the contents.
3. Navigate to res/drawable-mdpi-v4/
4. All the .png files contained are the icons for various parts of the UI of the android desktop.
5. By dragging the icons you wish to edit out of the winrar will extract them so that they can be edited.
when you are finished editing the icons using your image editor of choice go to step 6.

Below are all the image files that i changed to created the modpacks above with description of what each image is.

stat_back.png   ---  Icon for back button on the notification bar.
stat_home.png   ---  Icon for home button on the notification bar. 
stat_notify_wifi_in_range.png   ---  Icon for Wifi in range but not connected on the notification bar.
stat_sys_adb.png   ---  Icon for ADB Usb Debugging on the notification bar.
stat_sys_battery_0.png   ---  Icon for 0% Battery on the notification bar.
stat_sys_battery_10.png   ---  Icon for 10% Battery on the notification bar.
stat_sys_battery_20.png   ---  Icon for 20% Battery on the notification bar.
stat_sys_battery_40.png   ---  Icon for 40% Battery on the notification bar.
stat_sys_battery_60.png   ---  Icon for 60% Battery on the notification bar.
stat_sys_battery_80.png   ---  Icon for 80% Battery on the notification bar.
stat_sys_battery_100.png   ---  Icon for 100% Battery on the notification bar.
stat_sys_battery_charge_anim0.png   ---  Battery Charging Animation Frame 1 on the notification bar.
stat_sys_battery_charge_anim1.png   ---  Battery Charging Animation Frame 2 on the notification bar.
stat_sys_battery_charge_anim2.png  --- Battery Charging Animation Frame 3 on the notification bar.
stat_sys_battery_charge_anim3.png   --- Battery Charging Animation Frame 4 on the notification bar.
stat_sys_battery_charge_anim4.png   ---  Battery Charging Animation Frame 5 on the notification bar.
stat_sys_battery_charge_anim5.png   ---  Battery Charging Animation Frame 6 on the notification bar.
stat_sys_battery_unknown.png   ---  Icon for Battery Error on the notification bar.
stat_sys_data_bluetooth.png   ---  Icon for Bluetooth on the notification bar.
stat_sys_data_bluetooth_connected.png   ---  Icon for Bluetooth Connected on the notification bar.
stat_sys_data_usb.png   ---  Icon for USB Connected on the notification bar.
stat_sys_headset.png   ---  Icon for Headset Connected on the notification bar.
stat_sys_ringer_silent.png   ---  Icon for Silent Mode on the notification bar.
stat_sys_wifi_signal_0.png   ---  Icon for Wifi Signal Strength 0 bar on the notification bar.
stat_sys_wifi_signal_1.png   ---  Icon for Wifi Signal Strength 1 bar on the notification bar.
stat_sys_wifi_signal_2.png   ---  Icon for Wifi Signal Strength 2 bar on the notification bar.
stat_sys_wifi_signal_3.png   ---  Icon for Wifi Signal Strength 3 bar on the notification bar.
stat_sys_wifi_signal_4.png   ---  Icon for Wifi Signal Strength 4 bar on the notification bar.
statusbar_background.9.png   ---   Notification Bar Background! changing this will allow for diffrent colour bars and transparent bars.
title_bar_shadow.9.png   ---  This is a very thing shadow line that appears under the statusbar_background.9.png.

7. Now that you have edited all of the files you wish to change on your notification bar you need to drag these new files
back into the WINRAR window navigated to res/drawable-mdpi-v4/ this will automatically repackage the framework-res.apk

8. The only thing that has not been changed is the colour of the text for things in the notification bar and the colour of the clock. If you don't wish to change this jump to step 22.

8a. If you want to change the text colour and the clock colour to black then you can skip all these steps below and download yourself a modpack from above and steal the services.jar file
and the /system/framework/framework-res.apk/res/layout/status_bar.xml file and replace it with your framework-res.apk file at the same location. Then jump to step 22.


9. To change the text colour is a little more complex than just changing some images. Firstly you will need to
retrieve the services.jar file from the vega using:

adb remount
 adb pull system/framework/services.jar services-backup.jar

Once again make sure that you store a copy of the file somewhere safe so that you can restore it.

10. Downlad Smali and baksmali from the link above in the "What you will need" Section.

11. Once again using WINRAR open the services.jar file and copy out the file classes.dex to the location you downloaded smali and baksmali too.

12. Now using CMD navigate to the location where classes.dex and smali is saved. Then use the command:

java -jar baksmali-1.2.6.jar -o classout/ classes.dex

PLEASE NOTE the section saying baksmali-1.2.6.jar could be different depending on the actual file name of your downloaded baksmali. This also applies to later when using smali.

13. Now navigate to the newly created folder and navigate to classout/com/android/server/status/status and open up the file StatusBarIcon.smali in a text editor like Scite or Notepad.

14. Find the line that says .line 46. and change the line that says const/high16 v6, -0x100 to const/high16 v6, -0x0 for black or change it to a different value related to the colour you want.

15. Save the file and go back to CMD and use the following command:

java -Xmx512M -jar smali-1.2.6.jar classout/ -o classes_edit.dex

16. Then rename to classes.dex and drag it back into the WINRAR window that contains the contents of services.jar (replacing the old classes.dex)

17. Now you have changed the colour of the clock on the notification bar. To change all other notification bar text colours
continue to the next step.

18. Go back to the framework-res.apk file and open it in WINRAR

19. Navigate too /system/framework/framework-res.apk/res/layout/status_bar.xml and open it in your hex editor of choice I used HxD.

20. Search the file for the 16bit words 00 00 1C and replace the next 3 with the hex value of the colour you want i.e 00 00 00 for Black. (RGB Format)

21. Save this file and make sure that it goes back into the framework-res.apk WINRAR window replacing the old file.

22. Congratulations if you have got this far :D Nearly Done. Now it is time to push all the files you have edited back to the vega. Use the commands:


adb remount
 adb shell rm system/framework/services.jar
 adb shell rm system/framework/framework-res.apk
 adb push services.jar system/framework/services.jar
 adb push framework-res.apk system/framework/framework-res.apk
 adb reboot


23. Your Vega will now reboot and you should see all your hard work paid off!

I hope this guide helps you all with the basics of creating themes and allow you to fully customise your vegas!!!

Matt

Edited by mattlokes, 06 March 2011 - 06:17 PM.

  • 0

#2
Sir Gash

Sir Gash

    Enthusiast

  • Members
  • PipPipPip
  • 204 posts
  • Gender:Male
  • Location:London, UK
  • Devices:HTC Desire / Advent Vega
Thanks for the guide!

I tried it but have run into a few a problems. Firstly, whilst pushing framework-res.apk it said there was insufficient storage, it then rebooted. It failed to restart but thankfully adb was working so I pushed both files again and did a reboot.

Now the device is working but I noticed my calendar widget was blank and then realised that my Google Accounts (two of them) have disappeared! Would anything in the Framework or services.jar cause this? Also, what ROM are you using, maybe there are differences causing a problem?

One other thing, it looks like we have very different tastes, I like dark backgrounds whereas you clearly like them bright! I'll probably wait for your full guide and try it myself but it would be good to have a darker version, perhaps the standard black gradient notification bar just 50% transparent.

Here is your grey mod on my device:
Attached File  device.png   966.4KB   280 downloads

Cheers!


EDIT: I pushed my original files back but my accounts have not been restored. Will restore from a nandroid backup and try the install process again, this time whilst in recovery

Edited by Sir Gash, 04 February 2011 - 08:50 AM.

  • 0
ANDROID DEVICES:

HTC Desire
ROOTED/S-OFF
ROM: Oxygen v2.0.3
RADIO: 32.48.00.32U_5.11.05.14

Advent Vega
ROM: VegaComb (Beta 1a) Honeycomb 3.0 :D

#3
Sanddancer75

Sanddancer75

    Enthusiast

  • MoDaCo Silver
  • PipPipPip
  • 177 posts
  • Gender:Male
  • Location:South Tyneside
  • Devices:HTC Desire S & Advent Vega
How does it look with a full screen app running?

  • 0

#4
TylerDurdenK

TylerDurdenK

    Diehard

  • MoDaCo Silver
  • PipPipPipPip
  • 373 posts
  • Gender:Male
  • Devices:TMobile G2
I've just applied the clear notification bar, and got no errors (I am on 1.06.5, which it appears leaves more space in the /system location that 1.08), however my Google Account is also gone. Obviously it's not too much of an issue to input the details and sync up again, but just thought I would mention it.

Also, on the home screen my notification bar doesn't appear to be transparent, rather it is just black. If I move a widget or icon over it, there is no hint of transparency it's just goes "behind" a black bar. However on a full screen, like the market it does take on the colour of the page that is being displayed.

Edited by TylerDurdenK, 04 February 2011 - 10:04 AM.

  • 0

#5
mattlokes

mattlokes

    Newbie

  • Members
  • Pip
  • 33 posts
  • Gender:Male
  • Location:UK
  • Devices:HTC Desire, Advent Vega
I have admit I'm surprised by the losing your Google account thing, there must be something linked with it in the services.jar file. However that is probably one of the most
difficult parts of the modification as it requires pulling the file apart and adding an extra line in one of the .smali files.

@Sir Gash - I had the same problem as you with occasionally insufficient space and I removed all the ring-tones from the system files as they are not really used
this free's up a fair bit of space and allows for custom boot screens as well which is listed in another topic here on Modaco.

@TylerDurden - I forget to mention it in this thread this Mod only currently works with a live wallpaper which is why you will be having issues. Also i'm running 1.08.

I will be writing the full part 2 guide later, Thanks for your feedback, keep it coming ;)

  • 0

#6
TylerDurdenK

TylerDurdenK

    Diehard

  • MoDaCo Silver
  • PipPipPipPip
  • 373 posts
  • Gender:Male
  • Devices:TMobile G2

@TylerDurden - I forget to mention it in this thread this Mod only currently works with a live wallpaper which is why you will be having issues. Also i'm running 1.08.


I am running Live Wallpapers, in fact I am running the same one as you and the wallpaper will show behind the NF. However test it yourself, if you pick up a widget or icon and drag it to where the NF is it will not look transparent. It doesn't really matter, just more of an observation than anything else.

Just BTW, I was looking for a way to change the default Market Google account and this has allowed me to do just that!

Edited by TylerDurdenK, 04 February 2011 - 01:02 PM.

  • 0

#7
beegee1962

beegee1962

    Diehard

  • Members
  • PipPipPipPip
  • 379 posts
  • Gender:Male
  • Location:Tokyo
  • Interests:HTC phones, Android, Japan, Softbank, Android tablets
  • Devices:HTC Desire, Galaxy Tab 10.1 3G

############## [GUIDE TO] Make the Notification Bar Transparent ###########


...

######## PART 2 ######## CREATING YOUR OWN NOTIFICATION BAR GUI HACKS #################

...

I hope this guide helps you all with the basics of creating themes and allow you to fully customise your vegas!!!

Matt


Hi Matt, thanks a lot for the part 2. Will try it next weekend.

  • 0




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users