[GUIDE]Tab SystemUI

PineappleOwl said:

Good day devs, I have something new here not new but I think it is.

What we will be doing is somehow like this, the picture at the left is my modified UI, and the right picture will be our outcome.

As I was inspired by Sir serajr@xda's SystemUI, I want to make it tab also, as I cant decompile his UI and study the code, I thought about Sir b16h22 for his Multipanelflipper, but it was text so I made it on my own class and follow some trick from evox-4 x SystemUI by the use of custom views and sorta intents like what he did. Let we mod again.

Disclaimer: I and XDA are not responsible for the damage of your phone. Take necessary backup if you are indoubt. Thanks.

What we will be needed:
Patience
APK-Tool
Algorithm
Basic smali and xml
Your very own SystemUI
Know how to decompile APK

Instruction:
1. Download the zip file from the download link.
2. Decompile your very own SystemUI.
3. Extract the download link and paste it in your UI.
4. At the ids, add these before </resources> at ids.xml under values folder

Code:

<item type="id" name="tabbutton">false</item>

5. Now we will modify your expanded,
Below this code,

Code:

<com.android.systemui.statusbar.ExpandedView android:orientation="vertical" android:focusable="true" android:descendantFocusability="afterDescendants"
  xmlns:android="http://schemas.android.com/apk/res/android">

Add this,

Code:

<com.pineapple.TabUI.TabButton android:layout_gravity="top" android:orientation="horizontal" android:background="#00000000" android:paddingTop="5.0dip" android:layout_width="fill_parent" android:layout_height="40.0dip" android:weightSum="3.0" android:layout_alignParentLeft="false" android:layout_alignParentRight="true" />
    <com.pineapple.TabUI.TabsContent android:id="@id/tabbutton" android:background="#00000000" android:layout_width="fill_parent" android:layout_height="fill_parent">

6. And before this line

Code:

</com.android.systemui.statusbar.ExpandedView>

Add this,

Code:

</com.pineapple.TabUI.TabsContent>

7. Now this is the tricky part, as I am not familiar with the particular name of this (LinearLayout, RelativeLayout FrameLayout) ehh, you understand me what I am saying right sir?
Make the Expanded something like this,

Code:

<com.pineapple.TabUI.TabButton........../>
<com.pineapple.TabUI.TabButton...........>
<LinearLayout>First Layout</LinearLayout>
<LinearLayout>Second Layout</LinearLayout>
<LinearLayout>Third Layout</LinearLayout>
</com.pineapple.TabUI.TabsContent>

If you cant follow sirs, kindly compare it with my stock.

Code:

  <com.pineapple.TabUI.TabButton android:layout_gravity="top" android:orientation="horizontal" android:background="#00000000" android:paddingTop="5.0dip" android:layout_width="140.0dip" android:layout_height="42.0dip" android:weightSum="3.0" android:layout_alignParentLeft="false" android:layout_alignParentRight="true" />
    <com.pineapple.TabUI.TabsContent android:id="@id/flipper" android:background="#00000000" android:layout_width="fill_parent" android:layout_height="fill_parent">
        <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent">
            <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="wrap_content" 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:textSize="17.0sp" android:textStyle="normal" android:textColor="#ffffffff" android:id="@id/noNotificationsTitle" android:background="@drawable/quickpanel_title_background" android:paddingLeft="5.0dip" android:layout_width="fill_parent" android:layout_height="26.0dip" android:text="@string/status_bar_no_notifications_title" />
                        <TextView android:textSize="17.0sp" android:textStyle="normal" android:textColor="#ffffffff" android:id="@id/ongoingTitle" android:background="@drawable/quickpanel_title_background" android:paddingLeft="5.0dip" android:layout_width="fill_parent" android:layout_height="26.0dip" 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" />
                        <TextView android:textSize="17.0sp" android:textStyle="normal" android:textColor="#ffffffff" android:id="@id/latestTitle" android:background="@drawable/quickpanel_title_background" android:paddingLeft="5.0dip" android:layout_width="fill_parent" android:layout_height="26.0dip" 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" />
                        <Button android:textSize="13.0sp" android:layout_gravity="center" android:id="@id/clear_all_button" android:layout_width="85.0dip" android:layout_height="wrap_content" android:layout_marginTop="5.0dip" android:layout_marginRight="6.0dip" android:layout_marginBottom="3.0dip" android:text="Clear" android:layout_alignTop="@id/dateview" android:layout_alignParentRight="true" style="?android:attr/buttonStyleSmall" />
                    </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>
        <ScrollView android:scrollbars="none" android:fadingEdge="none" android:layout_width="fill_parent" android:layout_height="wrap_content" android:overScrollMode="never">
            <include layout="@layout/expanded_content3" /> [B]<!-- SecondLayout -->[/B]
        </ScrollView>
        <ScrollView android:scrollbars="none" android:fadingEdge="none" android:layout_width="fill_parent" android:layout_height="wrap_content" android:overScrollMode="never">
            <include layout="@layout/expanded_content3" /> [B]<!-- ThirdLayout -->[/B]
        </ScrollView>
    </com.pineapple.TabUI.TabsContent>

8. Save it, and recompile.
9. Decompile the APK again (We only did these because we register the added resources)
10. Go to public.xml and find these (the ids are bit different than yours,)

Code:

<public type="drawable" name="tab1" id="0x7f02009c" />
    <public type="drawable" name="tab2" id="0x7f02009d" />
    <public type="drawable" name="tab3" id="0x7f02009e" />
    <public type="id" name="tabbutton" id="0x7f090029" />

11. Now here comes the smali part, Now go to smali/com/pineapple/TabUI/*
Find this smali file, TabsContent.smali
at the TabsContent.smali, find this

0x7f050001 and change it to the public id of your "<public type="id" name="tabbutton" id="0x7f090029" />" So in mine I will change 0x7f050001 to 0x7f090029

12. Open the smali file, TabButtons.smali and find this ids.

0x7f020001 and change it according to the ids of tab1, in my UI, the registered id of tab1 is 0x7f02009d so therefore, I will change 0x7f020001 to 0x7f02009c
0x7f020002 and change it according to the ids of tab2, in my UI, the registered id of tab1 is 0x7f02009d so therefore, I will change 0x7f020002 to 0x7f02009d
0x7f020003 and change it according to the ids of tab3, in my UI, the registered id of tab1 is 0x7f02009d so therefore, I will change 0x7f020003 to 0x7f02009e

13. Save everything and compile your SystemUI and push or flash it, I recommend flashing.

Download Link:
PINEAPPLEOWL

Note/Ads: Lenox V2.1 have this kind of UI.

Credits:
b16h22 for some comparison with his very own MultiPanelSwitcher
serajr for inspire for his awesome UI
LenoxDevs for there support
android.developers.com

Click to expand...

Click to collapse