2012-08-08 8 views
16

Invece di spiegare la questione, molto più facile se ho appena vi mostro:Lo stile predefinito non riesce per ViewPagerIndicator's TabPageIndicator. Perché e come risolvere?

Unstyled Tab Titles

Come si può vedere i titoli delle schede sono tutte schiacciate insieme e del tutto senza stile. Funzionano correttamente in quella scorrendo attraverso le schede degli interruttori (sebbene non ci sia un'indicazione visibile eccetto il cambio di posizione dove appropriato) e toccando una scheda si cambia la vista, ma manca tutto lo stile. Ecco il codice:

gallerylists.xml

<?xml version="1.0" encoding="utf-8"?> 

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" > 

    <com.viewpagerindicator.TabPageIndicator 
    android:id="@+id/indicator" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" /> 

    <android.support.v4.view.ViewPager 
    android:id="@+id/gallerypager" 
    android:layout_width="match_parent" 
    android:layout_height="0dp" 
    android:layout_weight="1" /> 

</LinearLayout> 

GalleryLists.java

public class GalleryLists extends Activity { 
    Context context; 

    private static final String[] titles = new String[] { 
     "20 Hottest", "20 Worst", "20 Awesomest", "MMA", "Comedy", "Moto", "Games" }; 

    ViewPager listPager; 
    ListPagerAdapter listPagerAdapter; 

    PageIndicator indicator; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.gallerylists); 

    context = this; 

    listPagerAdapter = new ListPagerAdapter(); 

    ViewPager.OnPageChangeListener changeListener = new ViewPager.OnPageChangeListener() { 

     @Override 
     public void onPageScrolled(int i, float v, int i1) {} 

     @Override 
     public void onPageSelected(int i) {} 

     @Override 
     public void onPageScrollStateChanged(int i) {} 
    }; 

    listPager = (ViewPager) findViewById(R.id.gallerypager); 
    listPager.setAdapter(listPagerAdapter); 
    listPager.setOnPageChangeListener(changeListener); 

    indicator = (TabPageIndicator) findViewById(R.id.indicator); 
    indicator.setViewPager(listPager); 
    indicator.setOnPageChangeListener(changeListener); 
    } 

    private class ListPagerAdapter extends PagerAdapter { 

    // Not important (I believe) 
    } 
} 

Questo è tutto. Ora, a meno che non sia molto confuso nonostante la lettura della documentazione e l'esame degli esempi, non dovrei fare ulteriori passi per usare lo stile predefinito. Sono un po 'in perdita.

risposta

11

Mi sento un po 'un deficiente, ma ecco la soluzione estremamente semplice ed evidente.

AndroidManifest.xml

... 
<activity 
    android:name=".GalleryLists" 
    android:theme="@style/Theme.PageIndicatorDefaults" 
    ... > 
</activity> 
... 

Sì, tutto quello che dovevo fare era in realtà uso il tema. Speriamo che questo possa aiutare un'altra povera anima perduta.

+0

Agggh, ho avuto questa scheda aperta ma mai letto! Alla fine ho pensato a me stesso, ma avrei potuto risparmiare tempo. – georgiecasey

27

Ho lo stesso problema, ma android:theme="@style/Theme.PageIndicatorDefaults" non si combina con il tema della mia app.

C'è un altro modo per personalizzare, sovrascrivendo res/values/style.xml:

<resources> 

    <style name="AppTheme" parent="android:Theme.Light" > 
     <item name="vpiTabPageIndicatorStyle">@style/CustomTabPageIndicator</item> 

    </style> 

    <style name="CustomTabPageIndicator" > 
     <item name="android:gravity">center</item> 
     <item name="android:background">@drawable/vpi__tab_indicator</item>   
     <item name="android:paddingTop">12dp</item> 
     <item name="android:paddingBottom">12dp</item> 
     <item name="android:textAppearance">@style/TextAppearance.TabPageIndicator</item> 
     <item name="android:textSize">15sp</item> 
     <item name="android:maxLines">1</item> 
     <item name="android:textColor">#FF555555</item> 
    </style> 
</resources> 
+1

In realtà mi sono imbattuto in un problema simile e ho fatto qualcosa di simile. Volevo usare il tema holo dove disponibile, quindi avevo bisogno di creare un'altra cartella res/values-v11 con uno style.xml dove ho impostato il parent = "Theme.Holo" che nel tuo caso sarebbe "Theme.Holo.Light" . –

+1

Grazie mille per questo! È orribile quanto tempo ci vuole per capire come far funzionare le cose di ViewPagerIndicator e come personalizzarlo ... Se non fosse per StackOverflow e voi ragazzi, proverei a farlo da solo. – Terry

5

una piccola aggiunta alla soluzione Michaels: nel caso in cui si utilizza un tema personalizzato per la vostra attività già, basta aggiungere theese due linee ad esso:

<item name="vpiIconPageIndicatorStyle">@style/Widget.IconPageIndicator</item> 
<item name="vpiTabPageIndicatorStyle">@style/Widget.TabPageIndicator</item> 
Problemi correlati