Android > ActionBar - Tab Indicater line ½ºÅ¸ÀÏ Àû¿ë¹æ¹ý
µî·ÏÀÏ : 2017-07-05 19:01
Á¶È¸¼ö : 52,941
Áö³¹ø¿¡ Action Bar¸¦ Ãß°¡ÇÏ´Â °Í±îÁö °øºÎ Çߴµ¥ À̹ø¿¡´Â Action Bar Style º¯°æ ¹× Å׸¶ º¯°æ ¹æ¹ýÀ» ¾Ë¾Æº¸°Ú½À´Ï´Ù.
Aab ÀÌ ¼±ÅÃ/ÇØÁ¦ µÆÀ» °æ¿ì UnderBar Ç¥½Ã°¡ µË´Ï´Ù. ÀÌ UnderBar¸¦ ½ºÅ¸ÀϸµÇÏ´Â ¹æ¹ý¿¡ ´ëÇؼ ¼³¸íÇÕ´Ï´Ù.
navigation tabs °¡ »ç¿ëÇÏ´Â indicator ¸¦ º¯°æÇÏ·Á¸é, actionBarTabStyle À» ÀçÁ¤ÀÇÇÑ activity theme À» ¸¸µé¾î¾ß ÇÑ´Ù.
ÀÌ ¼Ó¼ºÀº ´Ù¸¥ style ¸®¼Ò½º¸¦ °¡¸®Å°°Ô µÇ¸ç, ÀÌ ½ºÅ¸ÀÏ ¸®¼Ò½ºÀÇ background ¼Ó¼ºÀ» state-list drawable À» »ç¿ëÇϵµ·Ï ¼³Á¤ÇÑ´Ù.
res/values µð·ºÅ丮¿¡ themes.xml ÆÄÀÏÀ» »õ·Î »ý¼º ÇÏ°í ¾Æ·¡ Äڵ带 ÀÔ·Â ÇÕ´Ï´Ù.
res/values/themes.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme"
parent="@android:style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarStyle">@style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="@android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#FF0000</item>
<item name="android:actionBarTabStyle">@style/ActionBarTabStyle.Example</item>
</style>
<style name="ActionBarTabStyle.Example" parent="@android:style/Widget.Holo.ActionBar.TabView">
<item name="android:background">@drawable/tab_indicator_ab_example</item>
</style>
</resources>
Tab Indicater ¸¦ ¼öÁ¤Çϱâ À§Çؼ´Â actionBarTabStyle ¾ÆÀÌÅÛÀ» Ãß°¡ÇØ¾ß ÇÕ´Ï´Ù.
¿©±â¿¡¼ Áß¿äÇÑ°ÍÀº @drawable/tab_indicator_ab_example
drawable Æú´õ¿¡ tab_indicator_ab_example.xml ÆÄÀÏÀ» ¸¸µé¾î Áà¾ß ÇÕ´Ï´Ù.
drawable/tab_indicator_ab_example.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"<
<!-- Non focused states -->
<item android:state_focused="false" android:state_selected="false" android:state_pressed="false"
android:drawable="@android:color/transparent" />
<item android:state_focused="false" android:state_selected="true" android:state_pressed="false"
android:drawable="@drawable/tab_selected_example" />
<!-- Focused states -->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="false"
android:drawable="@drawable/tab_unselected_focused_example" />
<item android:state_focused="true" android:state_selected="true" android:state_pressed="false"
android:drawable="@drawable/tab_selected_focused_example" />
<!-- Pressed -->
<!-- Non focused states -->
<item android:state_focused="false" android:state_selected="false" android:state_pressed="true"
android:drawable="@drawable/tab_unselected_pressed_example" />
<item android:state_focused="false" android:state_selected="true" android:state_pressed="true"
android:drawable="@drawable/tab_selected_pressed_example" />
<!-- Focused states -->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="true"
android:drawable="@drawable/tab_unselected_pressed_example" />
<item android:state_focused="true" android:state_selected="true" android:state_pressed="true"
android:drawable="@drawable/tab_selected_pressed_example" />
</selector>
Tab Indicater ÀÇ ´·¯Áö´Â »óŸ¦ ¹è°æÀ̹ÌÁö·Î »ç¿ëÇÒ°ÍÀ» ¼³Á¤ÇÏ´Â ³»¿ëÀÔ´Ï´Ù.
tab_selected_example.png
tab_unselected_example.png
tab_selected_focused_example.png
tab_selected_pressed_example.png
ÆÄÀÏÀº drawable Æú´õ¿¡ ¸¸µé¾î ³Ö¾î¾ß ÇÕ´Ï´Ù.