Evidenzia o sottolinea selezionato TabPageIndicator

Question

Ho un dualpane su un layout orizzontale di dimensioni tablet e sto usando i frammenti.

Sulla sinistra ho un frammento con un listview. Quando si verifica un clic su uno degli elenchi, il frammento corretto carica i dettagli.

Nel layout del frammento destra (dettaglio) c'è un com.viewpagerindicator.TabPageIndicator e android.support.v4.view.ViewPager. Il ViewPager caricherà 2 elementi e ognuno ha la sua com.viewpagerindicator.TabPageIndicator. Sto tentando di evidenziare o sottolineare la scheda selezionata ma non sono riuscito a farlo.

Spero che tu abbia qualche consiglio :)

Answer 1

Di default il TabPageIndicator non si applica qualsiasi stile. Per abilitare lo stile di default dal ViewPagerIndicator aggiungere la seguente riga sia al tag application o activity tag appropriato nel vostro manifest.xml

android:theme="@style/Theme.MyTheme" 

Poi aggiungere un file res\values\styles.xml al progetto con il seguente contenuto

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
    <style name="Theme.MyTheme" parent="@android:style/Theme.Light"> 
     <item name="vpiTabPageIndicatorStyle">@style/Widget.TabPageIndicator</item> 
    </style> 
</resources> 

Sto usando il tema light per Android per la mia applicazione, ma potresti voler cambiare questo tema al tema che stai usando ora.

Se si desidera modificare lo stile predefinito VPI modificare il file styles.xml a qualcosa di simile:

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

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

    <style name="MyTabPageIndicator" parent="Widget.TabPageIndicator"> 
    <item name="android:gravity">center</item> 
    <item name="android:background">@drawable/vpi__tab_indicator</item> 
    <item name="android:paddingLeft">22dip</item> 
    <item name="android:paddingRight">22dip</item> 
    <item name="android:paddingTop">12dp</item> 
    <item name="android:paddingBottom">12dp</item> 
    <item name="android:textAppearance">@style/MyTabPageIndicator.Text</item> 
    <item name="android:textSize">12sp</item> 
    <item name="android:maxLines">1</item> 
    </style> 

    <style name="MyTabPageIndicator.Text" parent="TextAppearance.TabPageIndicator"> 
    <item name="android:textStyle">bold</item> 
    <item name="android:textColor">@color/vpi__dark_theme</item> 
    </style> 

</resources> 

Si noti che le impostazioni di cui sopra sono esattamente la stessa di stile predefinito VPI per il TabPageIndicactor, così devi ancora apportare le modifiche che desideri.

Answer 2

Basta usare due librerie 1) Barra di azione di Sherlock 2) ViewPageIndicator e implementare tabPageIndicator visualizza che fornirà la scheda predefinita e per la scheda highliget fornire sottolineatura. SE si desidera modificare il colore della sottolineatura rispetto a quello necessario per modificare le immagini della 9a sezione disegnabile utilizzata in underlinbe.

Ecco il codice di esempio

vista XML di esempio

   <LinearLayout 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:orientation="vertical" > 

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

     <android.support.v4.view.ViewPager 
      android:id="@+id/pager" 
      android:layout_width="fill_parent" 
      android:layout_height="0dp" 
      android:layout_weight="1" /> 
    </LinearLayout> 
</FrameLayout> 

frammento di codice

 final FragmentPagerAdapter adapter = new FragmentChildPageAdapter(getChildFragmentManager());//getActivity().getSupportFragmentManager() 

    final ViewPager pager = (ViewPager) v.findViewById(R.id.pager); 
    pager.setAdapter(adapter); 

    final TabPageIndicator indicator = (TabPageIndicator) v.findViewById(R.id.indicator); 
    indicator.setViewPager(pager);