Android - Anpassen von Aktionsleisten-Sherlock-Registerkarten

Question

Ich versuche, die Aktionsleisten-Sherlock-Registerkarten so anzupassen, dass sie den Tab-Text unterhalb des Registerkartensymbols anzeigen. Nach dem Suchen und Lesen über das Thema habe ich immer noch nicht viel Glück.

Hier sind die Ergebnisse erhalte ich:

Individuelle tab1

Benutzerdefinierte tab1 nicht ausgewählt, ausgewählt Standard tab2

Das ist, was ich habe, so weit:

Ich habe meine eigene styles.xml erstellt, wo ich einige der Aktionsleisteneinstellungen ändere:

<style name="SkoletubeTheme" parent="Theme.Sherlock"> 
    <item name="actionBarSize">@dimen/st__action_bar_default_height</item> 
    <item name="actionBarTabStyle">@style/Skoletube.TabView</item> 
    <item name="actionBarTabTextStyle">@style/Skoletube.Tab.Text</item> 
</style> 

<style name="Skoletube.TabView" parent="Widget.Sherlock.ActionBar.TabView"> 
    <item name="android:background">@drawable/abs__tab_indicator_holo</item> 
    <item name="android:paddingLeft">6dp</item> 
    <item name="android:paddingRight">6dp</item> 
</style> 

<style name="Skoletube.Tab.Text" parent="Widget.Sherlock.ActionBar.TabText"> 
    <item name="android:textAppearance">@android:style/TextAppearance.Medium</item> 
    <item name="android:textColor">@android:color/primary_text_dark</item> 
    <item name="android:textSize">10sp</item> 
</style> 

eine XML-Ressource Erstellt wo ich und owerwrite für die ActionBar einige textsettings ändern. Hier habe ich die Höhe der Aktionsleiste erhöht, was wiederum die Höhe der Tabs erhöht. Ich sank auch die Größe des Textes, um Raum für den Einbau in Bild und Text in der Registerkarte

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
<!-- Default height of an action bar. --> 
<dimen name="st__action_bar_default_height">58dip</dimen> 
<!-- Text size for action bar titles --> 
<dimen name="ab__action_bar_title_text_size">10dp</dimen> 
<!-- Text size for action bar subtitles --> 
<dimen name="ab__action_bar_subtitle_text_size">6dp</dimen> 
<!-- Top margin for action bar subtitles --> 
<dimen name="ab__action_bar_subtitle_top_margin">-3dp</dimen> 
<!-- Bottom margin for action bar subtitles --> 
<dimen name="ab__action_bar_subtitle_bottom_margin">5dip</dimen> 
</resources> 

Dann habe ich ein benutzerdefiniertes Layout für die Registerkarten verwenden definiert zu machen, wo ich den Text unter dem Symbol platzieren :

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/customTabLayout" 
android:layout_width="wrap_content" 
android:layout_height="fill_parent" 
android:orientation="vertical" 
android:layout_weight="1" 
android:focusable="true" 
android:gravity="center" 
style="?attr/actionBarTabStyle" 
> 
<ImageView 
    android:id="@+id/sk_abs__tab_icon" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerHorizontal="true" 
    android:background="@android:color/transparent" 
    /> 
<com.actionbarsherlock.internal.widget.ScrollingTextView 
    android:id="@+id/sk_abs__tab_txt" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@id/sk_abs__tab_icon" 
    android:layout_alignWithParentIfMissing="true" 
    android:layout_weight="1" 
    android:layout_centerHorizontal="true" 
    android:lines="1" 
    android:scrollHorizontally="true" 
    android:ellipsize="marquee" 
    android:marqueeRepeatLimit="marquee_forever" 
    style="@style/Skoletube.Tab.Text" 
    /> 
<FrameLayout 
    android:id="@+id/abs__tab_custom" 
    android:layout_width="wrap_content" 
    android:layout_height="fill_parent" 
    android:padding="5dip" 
    android:layout_weight="1" 
    android:visibility="gone" 
    /> 

Nur für das Protokoll des Attribut als Stil für die relative Layout Punkte dazu geführt:

<style name="Widget.Sherlock.ActionBar.TabBar" parent="android:Widget"></style> 

Dann habe ich diese Änderungen auf meine App wie folgt angewandt, der erste Registerkarte hat meine maßgeschneiderte Implementierung hat die zweite Registerkarte die Standardimplementierung:

final ActionBar actionBar; 
    actionBar = getSupportActionBar(); 
    actionBar.setDisplayHomeAsUpEnabled(false); 
    actionBar.setDisplayUseLogoEnabled(true); 
    // Set up tabs 

    myMediaTab = actionBar.newTab(); 
    myMediaTab.setCustomView(R.layout.skoletube_tab_layout); 
    ImageView myMediaImg = (ImageView) myMediaTab.getCustomView().findViewById(R.id.sk_abs__tab_icon); 
    myMediaImg.setImageResource(R.drawable.tab_mymedia); 
    ScrollingTextView myMediaText = (ScrollingTextView) myMediaTab.getCustomView().findViewById(R.id.sk_abs__tab_txt); 
    myMediaText.setText("Tab1"); 
    myMediaTab.setTabListener(this); 
    myMediaTab.setTag("MyMediaTab"); 
    actionBar.addTab(myMediaTab); 

    myChannelsTab = actionBar.newTab(); 
    myChannelsTab.setIcon(drawable.tab_mychannels); 
    myChannelsTab.setText("Tab2"); 
    myChannelsTab.setTabListener(this); 
    myChannelsTab.setTag("myChannelsTab"); 
    actionBar.addTab(myChannelsTab); 

Während ich auf die Lösung, die ich bin in der Nähe denke, ich Ich denke, ich habe irgendwo einen Schritt verpasst.

Offensichtlich muss der blaue Balken hinter dem Text/unter dem Bild nicht da sein, aber ich habe auch nicht herausgefunden, wo ich das fokussierte Bild einstellen kann (ich möchte, dass der IMG die Farbe ändert, wenn ein Tab ist) ausgewählt) und Textfarbe. Muss ich die Bildansicht fokussierbar machen und damit umgehen?

Ich bin noch ziemlich neu in diesem Bereich, daher könnte der Ansatz, den ich hier gewählt habe, falsch sein, wenn es einen besseren/intelligenteren Weg gibt, dies zu tun.

Schätzen Sie alle Vorschläge und Ideen.

Answer 1

Ich weiß nicht, ob Sie eine Antwort für dieses oder noch nicht gefunden haben, aber eine Lösung könnte sein, das Tab-Bild zu ändern, um den Text mit GIMP oder Photoshop etwas zu enthalten, und legen Sie dann diese Bilder in den Registerkarten , anstelle von Bildern und Text. Es ist ein bisschen peinlich, aber es würde funktionieren.

Hoffe, das hilft!

Answer 2

Ich habe gelöst, dass durch die Verwendung eines compound drawable:

tv = new TextView(this); 
tv.setText(R.string.tab_movies); 
tv.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.nav_movies, 0, 0); 

mBar.addTab(mBar 
    .newTab() 
    .setCustomView(tv) 
    .setTabListener(
    new TabListenerImpl<TheatersTabActivity>(this, "theaters", 
     TheatersTabActivity.class))); 

Um mit dem ausgewählten oder nicht ausgewählten Bild zu tun, ich einen Selektor bin mit:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android" > 
    <item 
     android:state_selected="true" 
     android:drawable="@drawable/nav_movies_on"/> 
    <item 
     android:state_selected="false" 
     android:drawable="@drawable/nav_movies_off"/> 
</selector>