Attend XDA's Second Annual Developer Conference, XDA:DevCon 2014!
5,807,458 Members 48,199 Now Online
XDA Developers Android and Mobile Development Forum

[Guide][TUT] Honami style Tab indicators

Tip us?
 
ljg211314
Old
(Last edited by ljg211314; 5th August 2014 at 10:13 AM.) Reason: code error
#1  
ljg211314's Avatar
Member - OP
Thanks Meter 54
Posts: 53
Join Date: Jul 2013
Location: HangZhou

 
DONATE TO ME
Lightbulb [Guide][TUT] Honami style Tab indicators

Let's see what I'll teaching you today



Preview:

Defaul---------------------------------------------------------------------------------------------------Honami


All right,here we go

1.Download resources Tab honami.zip
put folder file into res
forget about styles.txt


2.Goto framework-res\res\values open styles.xml

search code
[HTML]
HTML Code:
    <style name="Widget.Holo.TabWidget" parent="@style/Widget.TabWidget">
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.Holo.TabWidget" parent="@style/Widget.TabWidget">
        <item name="divider">@null</item>
        <item name="tabStripLeft">@null</item>
        <item name="tabStripRight">@null</item>
        <item name="tabStripEnabled">false</item>
        <item name="measureWithLargestChild">true</item>
        <item name="showDividers">none</item>
        <item name="dividerPadding">8.0dip</item>
        <item name="tabLayout">@layout/semc_tab_indicator_holo_dark</item>
    </style>
seems like:
 


search code
HTML Code:
    <style name="Widget.Holo.Tab" parent="@style/Widget.Holo.ActionBar.TabView">
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.Holo.Tab" parent="@style/Widget.Holo.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_dark</item>
        <item name="layout_width">0.0dip</item>
        <item name="minWidth">80.0dip</item>
        <item name="layout_weight">1.0</item>
    </style>

search code
HTML Code:
    <style name="Widget.Holo.Light.Tab" parent="@style/Widget.Holo.Light.ActionBar.TabView">
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.Holo.Light.Tab" parent="@style/Widget.Holo.Light.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_light</item>
        <item name="layout_width">0.0dip</item>
        <item name="minWidth">80.0dip</item>
        <item name="layout_weight">1.0</item>
    </style>

search code
HTML Code:
    <style name="Widget.ActionBar.TabBar" parent="@style/Widget" />
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.ActionBar.TabBar" parent="@style/Widget" />
    <style name="Widget.Holo.ActionBar.TabView" parent="@style/Widget.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_dark</item>
        <item name="paddingLeft">@dimen/somc_actionbar_tab_padding</item>
        <item name="paddingRight">@dimen/somc_actionbar_tab_padding</item>
    </style>
Well,Then goto last line,befour </resources>
add code

HTML Code:
    <style name="Widget.Holo.Light.TabWidget" parent="@style/Widget.Holo.TabWidget">
        <item name="tabLayout">@layout/semc_tab_indicator_holo_light</item>
    </style>
    <style name="Widget.Holo.Light.ActionBar.TabView" parent="@style/Widget.Holo.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_light</item>
    </style>
    <style name="Widget.DeviceDefault.TabText" parent="@style/Widget.Holo.TabText" />
seems like:
 


Well ,done ,about Decompile i don't wanna crap , replace what file you have changed to original app
enjoy it
Like it , how about press thanks

If you like honami styles framework , more detail visit Ambor's post
Over here http://forum.xda-developers.com/cros...6/post54584204
The Following 7 Users Say Thank You to ljg211314 For This Useful Post: [ Click to Expand ]
 
XT-107
Old
#2  
XT-107's Avatar
Member
Thanks Meter 16
Posts: 64
Join Date: Sep 2012
Quote:
Originally Posted by ljg211314 View Post
Let's see what I'll teaching you today



Preview:

Defaul---------------------------------------------------------------------------------------------------Honami


All right,here we go

1.download resources Attachment 2880418
put folder file into res
forget about styles.xml


2.goto framework-res\res\values open styles.xml

search code
HTML Code:
    <style name="Widget.Holo.TabWidget" parent="@style/Widget.TabWidget">
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.Holo.TabWidget" parent="@style/Widget.TabWidget">
        <item name="divider">@null</item>
        <item name="tabStripLeft">@null</item>
        <item name="tabStripRight">@null</item>
        <item name="tabStripEnabled">false</item>
        <item name="measureWithLargestChild">true</item>
        <item name="showDividers">none</item>
        <item name="dividerPadding">8.0dip</item>
        <item name="tabLayout">@layout/semc_tab_indicator_holo_dark</item>
    </style>
seems like:


search code
HTML Code:
    <style name="Widget.Holo.Tab" parent="@style/Widget.Holo.ActionBar.TabView">
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.Holo.Tab" parent="@style/Widget.Holo.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_dark</item>
        <item name="layout_width">0.0dip</item>
        <item name="minWidth">80.0dip</item>
        <item name="layout_weight">1.0</item>
    </style>

search code
HTML Code:
    <style name="Widget.Holo.Light.Tab" parent="@style/Widget.Holo.Light.ActionBar.TabView">
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.Holo.Light.Tab" parent="@style/Widget.Holo.Light.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_light</item>
        <item name="layout_width">0.0dip</item>
        <item name="minWidth">80.0dip</item>
        <item name="layout_weight">1.0</item>
    </style>

search code
HTML Code:
    <style name="Widget.ActionBar.TabBar" parent="@style/Widget" />
An whole section replace (befour </style>)
HTML Code:
    <style name="Widget.ActionBar.TabBar" parent="@style/Widget" />
    <style name="Widget.Holo.ActionBar.TabView" parent="@style/Widget.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_dark</item>
        <item name="paddingLeft">@dimen/somc_actionbar_tab_padding</item>
        <item name="paddingRight">@dimen/somc_actionbar_tab_padding</item>
    </style>

Well,Then goto last line,befour </resources>
add code

HTML Code:
    <style name="Widget.Holo.Light.TabWidget" parent="@style/Widget.Holo.TabWidget">
        <item name="tabLayout">@layout/semc_tab_indicator_holo_light</item>
    </style>
    <style name="Widget.Holo.Light.ActionBar.TabView" parent="@style/Widget.Holo.ActionBar.TabView">
        <item name="background">@drawable/semc_tab_indicator_holo_light</item>
    </style>
    <style name="Widget.DeviceDefault.TabText" parent="@style/Widget.Holo.TabText" />
seems like:


Well ,done ,about Decompile i don't wanna crap , replace what file you have changed to original app
enjoy it
Like it , how about press thanks
awesome .


just a suggestion , maybe make a tutorial for theming whole framework to honami style ?
 
ljg211314
Old
#3  
ljg211314's Avatar
Member - OP
Thanks Meter 54
Posts: 53
Join Date: Jul 2013
Location: HangZhou

 
DONATE TO ME
Quote:
Originally Posted by XT-107 View Post
awesome .


just a suggestion , maybe make a tutorial for theming whole framework to honami style ?
It's complicated ! and so much file to edit , just use it will be much better
 
devilmaycry2020
Old
#4  
devilmaycry2020's Avatar
Senior Member
Thanks Meter 122
Posts: 769
Join Date: Apr 2013
preview nothing ?
Click the "Thanks" button if I've helped you
The Following User Says Thank You to devilmaycry2020 For This Useful Post: [ Click to Expand ]
 
jaguelos
Old
#5  
jaguelos's Avatar
Member
Thanks Meter 8
Posts: 86
Join Date: May 2012
Location: Bangkok
help me,please i got error
..
.
.
Attached Files
File Type: txt Log.txt - [Click for QR Code] (2.6 KB, 10 views)
Device : Sony Ericsson Live With Walkman
ROM : Xperia UltraKat v2.1.1
Kernel : LexacyXperia build 20140319
Status : Rooted
Bootloader Status : Unlocked
 
gamzekal
Old
#6  
gamzekal's Avatar
Senior Member
Thanks Meter 1,759
Posts: 967
Join Date: Aug 2012
Location: Mainz

 
DONATE TO ME
nice work bro thanks
The Following User Says Thank You to gamzekal For This Useful Post: [ Click to Expand ]
 
Ambor
Old
(Last edited by Ambor; 2nd August 2014 at 09:47 PM.)
#7  
Ambor's Avatar
Senior Member
Thanks Meter 392
Posts: 335
Join Date: Feb 2014
Location: Warsaw

 
DONATE TO ME
Quote:
Originally Posted by jaguelos View Post
help me,please i got error
..
.
.
Bro probably missing file in the layoutfolder semc_tab_indicator_holo_light in framework-res.apk

if you an my files must add i folder color this files


semc_widget_text_color_dark.xml
semc_widget_text_color_light.xml

this is files from my Z2 framework-res.apk

semc_tab_indicator_holo_light.xml

Code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="horizontal" android:layout_height="?actionBarSize" style="@android:style/Widget.DeviceDefault.Light.Tab"
  xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView android:layout_gravity="center_vertical" android:id="@id/icon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" />
    <TextView android:textColor="@color/semc_widget_text_color_tabs_light" android:layout_gravity="center_vertical" android:id="@id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" style="@android:style/Widget.DeviceDefault.TabText" />
</LinearLayout>



semc_tab_indicator_holo_dark.xml


Code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="horizontal" android:layout_height="?actionBarSize" style="@android:style/Widget.DeviceDefault.Tab"
  xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView android:layout_gravity="center_vertical" android:id="@id/icon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" />
    <TextView android:textColor="@color/semc_widget_text_color_tabs_dark" android:layout_gravity="center_vertical" android:id="@id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" style="@android:style/Widget.DeviceDefault.TabText" />
</LinearLayout>
Attached Files
File Type: rar 3-Out.rar - [Click for QR Code] (1.3 KB, 14 views)
The Following User Says Thank You to Ambor For This Useful Post: [ Click to Expand ]
 
ljg211314
Old
#8  
ljg211314's Avatar
Member - OP
Thanks Meter 54
Posts: 53
Join Date: Jul 2013
Location: HangZhou

 
DONATE TO ME
Quote:
Originally Posted by gamzekal View Post
nice work bro thanks
Thanks
 
ljg211314
Old
#9  
ljg211314's Avatar
Member - OP
Thanks Meter 54
Posts: 53
Join Date: Jul 2013
Location: HangZhou

 
DONATE TO ME
Quote:
Originally Posted by Ambor View Post
Bro probably missing file in the layoutfolder semc_tab_indicator_holo_light in framework-res.apk

if you an my files must add i folder color this files


semc_widget_text_color_dark.xml
semc_widget_text_color_light.xml

this is files from my Z2 framework-res.apk

semc_tab_indicator_holo_light.xml

Code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="horizontal" android:layout_height="?actionBarSize" style="@android:style/Widget.DeviceDefault.Light.Tab"
  xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView android:layout_gravity="center_vertical" android:id="@id/icon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" />
    <TextView android:textColor="@color/semc_widget_text_color_tabs_light" android:layout_gravity="center_vertical" android:id="@id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" style="@android:style/Widget.DeviceDefault.TabText" />
</LinearLayout>



semc_tab_indicator_holo_dark.xml


Code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="horizontal" android:layout_height="?actionBarSize" style="@android:style/Widget.DeviceDefault.Tab"
  xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView android:layout_gravity="center_vertical" android:id="@id/icon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" />
    <TextView android:textColor="@color/semc_widget_text_color_tabs_dark" android:layout_gravity="center_vertical" android:id="@id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" style="@android:style/Widget.DeviceDefault.TabText" />
</LinearLayout>
Indeed ! there is on thing I've missed,sorry!! semc_tab_indicator_holo_light.xml
it's in res\layout
Now dowmload it
semc_tab_indicator_holo_light.zip
 
Ambor
Old
(Last edited by Ambor; 3rd August 2014 at 12:52 PM.)
#10  
Ambor's Avatar
Senior Member
Thanks Meter 392
Posts: 335
Join Date: Feb 2014
Location: Warsaw

 
DONATE TO ME
Bro check orginal Z2 framework in It Is in LAYOUT

Even explain to you why there is

See this valiue, this is color text of swithers

<TextView android:textColor="@color/semc_widget_text_color_tabs_dark"
<TextView android:textColor="@color/semc_widget_text_color_tabs_light"


If you add this files in color folder

semc_widget_text_color_tabs_dark.xml

Code:
<?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/@color/somc_theme_accent_color_dark" android:state_activated="true" />
    <item android:state_selected="true" android:color="@color/somc_theme_accent_color_dark" />
    <item android:state_enabled="false" android:color="#80bebebe" />
    <item android:color="#ffffffff" />
</selector>

semc_widget_text_color_tabs_light.xml


Code:
<?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/somc_theme_accent_color_light" android:state_activated="true" />
    <item android:state_selected="true" android:color="@color/somc_theme_accent_color_light" />
    <item android:state_enabled="false" android:color="#ffbebebe" />
    <item android:color="#ff333333" />
</selector>

And add this valiue in color.xml


<color name="somc_theme_accent_color_dark">#ff64c9ff</color>
<color name="somc_theme_accent_color_light">#ff64c9ff</color>


Efect
Attached Thumbnails
Click image for larger version

Name:	Screenshot_2014-07-24-10-43-05.png
Views:	179
Size:	146.6 KB
ID:	2881601   Click image for larger version

Name:	Screenshot_2014-07-23-19-18-24.png
Views:	140
Size:	144.9 KB
ID:	2881602   Click image for larger version

Name:	Screenshot_2014-08-02-10-43-38.png
Views:	126
Size:	135.4 KB
ID:	2881603   Click image for larger version

Name:	Screenshot_2014-08-02-21-10-07.png
Views:	101
Size:	136.8 KB
ID:	2881604  

The Following 3 Users Say Thank You to Ambor For This Useful Post: [ Click to Expand ]
Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes