[GUIDE][AOSP][4.1+] KitKat Gradient Status & Nav Bars

[ATTACK]

I've been asked several times to post a guide on how I created the gradient status and nav bar mod [LINK]. So here it is!...
...And if you use this mod in you're work please give proper credit - Thanks!


-------------------------------------------------------------------------------------------------------------------------------
TOOLS:
-------------------------------------------------------------------------------------------------------------------------------
NotePad++
> http://notepad-plus-plus.org/download/v6.7.4.html

Apktool
> new: https://bitbucket.org/iBotPeaches/apktool/downloads
> old: https://code.google.com/p/android-apktool/downloads/list

Smali/Baksmali
> https://bitbucket.org/JesusFreke/smali/downloads

Commands:

De-compiling Apk's:

apktool d [COLOR="Blue"]>NAME OF APK<[/COLOR].apk

Re-compiling:

apktool b [COLOR="Blue"]>NAME OF APK<[/COLOR]

De-compiling Jar's:

java -jar baksmali.jar -x [COLOR="Blue"]>NAME OF JAR<[/COLOR] -o classout

Re-compiling Jar's:

java -Xmx512M -jar smali.jar classout/ -o new-classes.dex

-------------------------------------------------------------------------------------------------------------------------------
LETS BEGIN:
-------------------------------------------------------------------------------------------------------------------------------
DELETE: RED CODE
ADD: BLUE CODE


-------------------------------------------------------------------------------------------------------------------------------
Adding translucency to the status & nav bars.
-------------------------------------------------------------------------------------------------------------------------------
This will enabled the status and navigation bar to be translucent - independently of each other.
Meaning you could set the status bar to 20% and the navigation bar to 75%.

-------------
STEP 1:
-------------
Decompile:

android.policy.jar

Navigate to:

> com > android > internal > policy > impl > PhoneWindowManager.smali

Look for this line:

.method public getSystemDecorRectLw(Landroid/graphics/Rect;)I

Edit the following code:

.method public getSystemDecorRectLw(Landroid/graphics/Rect;)I
    .locals 1
    .parameter "systemRect"

    .prologue
    .line 2755
    iget v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mSystemLeft:I

    iput v0, p1, Landroid/graphics/Rect;->left:I

    .line 2756
    iget v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mSystemTop:I

    iput v0, p1, Landroid/graphics/Rect;->top:I

    .line 2757
    iget v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mSystemRight:I

    iput v0, p1, Landroid/graphics/Rect;->right:I

    .line 2758
    iget v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mSystemBottom:I

    iput v0, p1, Landroid/graphics/Rect;->bottom:I

    .line 2759
[COLOR="Red"]    iget-object v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mStatusBar:Landroid/view/WindowManagerPolicy$WindowState;

    if-eqz v0, :cond_0

    iget-object v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mStatusBar:Landroid/view/WindowManagerPolicy$WindowState;

    invoke-interface {v0}, Landroid/view/WindowManagerPolicy$WindowState;->getSurfaceLayer()I

    move-result v0

    .line 2761
    :goto_0
    return v0

    .line 2760
    :cond_0
    iget-object v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mNavigationBar:Landroid/view/WindowManagerPolicy$WindowState;

    if-eqz v0, :cond_1

    iget-object v0, p0, Lcom/android/internal/policy/impl/PhoneWindowManager;->mNavigationBar:Landroid/view/WindowManagerPolicy$WindowState;

    invoke-interface {v0}, Landroid/view/WindowManagerPolicy$WindowState;->getSurfaceLayer()I

    move-result v0

    goto :goto_0

    .line 2761
    :cond_1
    const/4 v0, 0x0

    goto :goto_0
.end method[/COLOR]

Replace it with:

[COLOR="blue"]
     const/4 v0, 0x0

     return v0
.end method[/COLOR]

-----------------------
SAVE & DONE
-----------------------
-------------------------------------------------------------------------------------------------------------------------------
Finished - now compile.
-------------------------------------------------------------------------------------------------------------------------------

-------------
STEP 2:
-------------
Decompile:

SystemUI.apk

Navigate to:

> com > android > systemui > statusbar > phone > PhoneStatusBar.smali

Look for:

.method private getNavigationBarLayoutParams()Landroid/view/WindowManager$LayoutParams;

Edit the following code:

.method private getNavigationBarLayoutParams()Landroid/view/WindowManager$LayoutParams;
    .locals 6

    .prologue
    const/4 v1, -0x1

    .line 792
    new-instance v0, Landroid/view/WindowManager$LayoutParams;

    const/16 v3, 0x7e3

    const v4, 0x840068

    [COLOR="RoyalBlue"]const/4 v5, -0x3[/COLOR]

    move v2, v1

    [COLOR="Red"]move v5, v1[/COLOR]

    invoke-direct/range {v0 .. v5}, Landroid/view/WindowManager$LayoutParams;-><init>(IIIII)V

    .line 803
    invoke-static {}, Landroid/app/ActivityManager;->isHighEndGfx()Z

    move-result v1

    if-eqz v1, :cond_0

    .line 804
    iget v1, v0, Landroid/view/WindowManager$LayoutParams;->flags:I

    const/high16 v2, 0x100

    or-int/2addr v1, v2

    iput v1, v0, Landroid/view/WindowManager$LayoutParams;->flags:I

    .line 807
    :cond_0
    const-string v1, "NavigationBar"

    invoke-virtual {v0, v1}, Landroid/view/WindowManager$LayoutParams;->setTitle(Ljava/lang/CharSequence;)V

    .line 808
    const/4 v1, 0x0

    iput v1, v0, Landroid/view/WindowManager$LayoutParams;->windowAnimations:I

    .line 809
    return-object v0
.end method

-----------------------
SAVE & DONE
-----------------------
-------------------------------------------------------------------------------------------------------------------------------
Finished - Do not compile - ↓ move to next step ↓
-------------------------------------------------------------------------------------------------------------------------------

-------------------------------------------------------------------------------------------------------------------------------
Editing Status bar & Navigation bar background
-------------------------------------------------------------------------------------------------------------------------------

-------------
STEP 1:
-------------
Navigate to both:

SystemUI.apk > res > layout > navigation_bar.xml

And:

SystemUI.apk > res > layout-sw600dp > navigation_bar.xml

Change the following in both xml's:

android:background="[COLOR="Red"]#88000000[/COLOR]"

android:background="[COLOR="Blue"]@drawable/nav_bar_background[/COLOR]"

-----------------------
SAVE & DONE
-----------------------

Navigate to:

SystemUI.apk > res > layout > status_bar.xml

Change the following:

android:background="[COLOR="Red"]#FF000000[/COLOR]"

android:background="[COLOR="Blue"]@drawable/status_bar_background[/COLOR]"

-----------------------
SAVE & DONE
-----------------------
Navigate to:

SystemUI.apk > res > values > drawables.xml

And delete:

[COLOR="Red"]<item type="drawable" name="status_bar_background">#88000000</item>[/COLOR]

-----------------------
SAVE & DONE
-----------------------
-------------------------------------------------------------------------------------------------------------------------------
Finished - Do not compile - ↓ move to next step ↓
-------------------------------------------------------------------------------------------------------------------------------

-------------------------------------------------------------------------------------------------------------------------------
Gradient Status & Navigation Bar
-------------------------------------------------------------------------------------------------------------------------------

• startCOLOR = BOTTOM
• endCOLOR = TOP

-------------
STEP 1:
-------------
Create 2 new XML's:

First xml:

Name it:

status_bar_background.xml

Add to it:

[COLOR="Blue"]<?xml version="1.0" encoding="utf-8"?>
<shape
  xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient android:startColor="#00000000" android:endColor="#99000000" android:angle="@integer/status_bar_bg_gradient_degrees" name="status_bar_background" />
</shape>[/COLOR]

-----------------------
SAVE & DONE
-----------------------

Second xml

Name it:

nav_bar_background.xml

Add to it:

[COLOR="blue"]<?xml version="1.0" encoding="utf-8"?>
<shape
  xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient android:startColor="#cc000000" android:endColor="#00000000" android:angle="@integer/nav_bar_bg_gradient_degrees" name="nav_bar_background" />
</shape>[/COLOR]

-----------------------
SAVE & DONE
-----------------------

Now place both xml's in:

SystemUI.apk > res > drawable

-----------------------
DONE
-----------------------

-------------
STEP 2:
-------------
Navigate to:

SystemUI.apk > res > values > integers

Add to the bottom:

[COLOR="Blue"]<integer name="nav_bar_bg_gradient_degrees">90</integer>
<integer name="status_bar_bg_gradient_degrees">90</integer>[/COLOR]

-----------------------
SAVE & DONE
-----------------------

-------------------------------------------------------------------------------------------------------------------------------
Finished - Do not compile - ↓ move to next step ↓
-------------------------------------------------------------------------------------------------------------------------------

-------------------------------------------------------------------------------------------------------------------------------
Adjusting the background gradient for the recents menu
-------------------------------------------------------------------------------------------------------------------------------
I went with 5% ~ 0% - but you can add whatever values you wish.
Hex code list below.

Navigate to:

SystemUI.apk > res > drawable > status_bar_recents_background

Add:

<?xml version="1.0" encoding="utf-8"?>
<shape
  xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient android:startColor="[COLOR="Blue"]#0d000000[/COLOR]" android:endColor="[COLOR="Blue"]#00000000[/COLOR]" android:angle="@integer/status_bar_recents_bg_gradient_degrees" name="status_bar_recents_background" />
</shape>

-----------------------
SAVE & DONE
-----------------------
-------------------------------------------------------------------------------------------------------------------------------
Finished - Now compile - flash - and Enjoy!
-------------------------------------------------------------------------------------------------------------------------------

-------------------------------------------------------------------------------------------------------------------------------
Hex Opacity Values:
-------------------------------------------------------------------------------------------------------------------------------

100% — FF

95% — F2

90% — E6

85% — D9

80% — CC

75% — BF

70% — B3

65% — A6

60% — 99

55% — 8C

50% — 80

45% — 73

40% — 66

35% — 59

30% — 4D

25% — 40

20% — 33

15% — 26

10% — 1A

5% — 0D

0% — 00

-------------------------------------------------------------------------------------------------------------------------------
Known Issues:
-------------------------------------------------------------------------------------------------------------------------------

*White backgrounds causes the status bar to become white (System Wide)
[STRIKE]*Lockscreen tint needs to be adjusted to match gradient.[/STRIKE]

-------------------------------------------------------------------------------------------------------------------------------
End Result:
-------------------------------------------------------------------------------------------------------------------------------

 

[ATTACK]

>>REMOVING LOCKSCREEN TINT GUIDE: Thanks to @Koloses

>>WHITE STATUS BAR CLOCK GUIDE

 

[EnricoD]

Sorry.. last part of the guide

"At this point you may want to adjust the background gradient for the recents background. I went with 5% ~ 0%

SystemUI \ res \ drawable \ nav_bar_recents_background"

Shoud be nav_bar_background.xml not nav_bar_recents_background

 

[slimdizzy]

Can you show a screenshot with the launcher open? I want to see how your mod deals with changes in the status bar and nav bar. Previous mods failed at this. Either everything gets white out or system UI crashes constantly.

TIA

 

[ATTACK]

Sorry.. last part of the guide

"At this point you may want to adjust the background gradient for the recents background. I went with 5% ~ 0%

SystemUI \ res \ drawable \ nav_bar_recents_background"

Shoud be nav_bar_background.xml not nav_bar_recents_background

FIXED... It's actually SystemUI \ res \ drawable \ status_bar_recents_background.

 

[ATTACK]

Can you show a screenshot with the launcher open? I want to see how your mod deals with changes in the status bar and nav bar. Previous mods failed at this. Either everything gets white out or system UI crashes constantly.

TIA

Everything works....the only 2 issues are listed in the OP

 

[EnricoD]

Everything works....the only 2 issues are listed in the OP

Sorry Bro

I've already done Your guide and works very good... but

You say to delete this in drawables.xml

<item type="drawable" name="system_bar_background">#88000000</item>

But if You delete this You will get errors...

Since You add android:background="@drawable/status_bar_background"

You should delete the item status_bar_background from drawables.xml

It works for me...
great guide

Thank You

 

[Maurice5813]

this working on cm10.2, 4.3.1?

 

[this-is-me]

@ATTACK, If you are familiar with the Xposed framework, I wonder if it would make it easier on you to make this modification into an Xposed mod. Do you think it is worth trying?

 

[cammykool]

I don't know how to decompile so I would be cool with that.

Sent from my SCH-I535 using Tapatalk

 

[Android-Andi]

thanks, i'll try it after work.

 

[EnricoD]

Hey Attack

http://www.xda-developers.com/android/complete-the-kitkat-look-on-your-jelly-bean-rom/

 

[mattevivi]

opinion

Hi, thanks for the guide. All works well
Just a little question,
I'm on CM 10.1, the nav bar became automatically opaque when the foreground app isn't the launcher, while the status bar still be transparent inside other app like Hangouts or Gmail ecc..so the icons results unreadable
Is there any way to fix that issue?
thanks

 

[Cheetah1024]

Can anyone link us with a thread, where it is shown, how to decompile and compile? Thanks in advance!!

Sent from my LG P880

 

[Ticklefish]

Can anyone link us with a thread, where it is shown, how to decompile and compile? Thanks in advance!!

Sent from my LG P880

Well, there's always Tickle My Android...

Sent from my C6603 using XDA Premium 4 mobile app

 

[Cheetah1024]

Well, there's always Tickle My Android...

Sent from my C6603 using XDA Premium 4 mobile app

???

Sent from my LG P880

 

[EnricoD]

Can anyone link us with a thread, where it is shown, how to decompile and compile? Thanks in advance!!

Sent from my LG P880

There's this simple guide on XDA with examples

http://forum.xda-developers.com/showthread.php?t=2195680

 

[Cheetah1024]

Thanks!

Sent from my LG P880

 

[Steam.]

it's easier to use xposed and gravitybox.not trying to offend anyone, i'm actually pleased that there's a proper guide for JB.

Thanks.

 

[ATTACK]

Hi, thanks for the guide. All works well
Just a little question,
I'm on CM 10.1, the nav bar became automatically opaque when the foreground app isn't the launcher, while the status bar still be transparent inside other app like Hangouts or Gmail ecc..so the icons results unreadable
Is there any way to fix that issue?
thanks

Yes, this is listed as a known issue. Now that I have KitKat and the Nexus 5 system dump, I'll take a look and see how android handles the translucency changes.