come ottenere questo TabBar

Question

come ottenere il seguente disegno di una barra delle linguette

Quando una scheda è stato selezionato il pulsante curva mosto visibile nella scheda particolare e l'altro per essere in comune.

Ho pensato di aggiungere un colore di sfondo fisso in rosso e di posizionare i pulsanti di un'immagine con curva e senza curva. Ma voglio sapere se viene corretto per tutti i dispositivi Android, perché wat è l'altezza e la larghezza del pulsante? come impostare una tabbar di altezza e larghezza fisse ....

Answer 1

ho trovato da un modo semplice come segue

Per ottenere il redline in fondo barra delle linguette ho aggiunto un view nella scheda come segue

<TabHost 
    android:id="@android:id/tabhost" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    xmlns:android="http://schemas.android.com/apk/res/android"> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:id="@+id/linearLayout1" 
     android:layout_height="fill_parent" 
     android:orientation="vertical"> 

     <TabWidget 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:id="@android:id/tabs" 
      android:layout_alignParentBottom="true" 
      android:layout_weight="0"> 
     </TabWidget> 

     <View android:layout_width="fill_parent" android:layout_height="4dip" android:background="#ff0000" /> 

     <FrameLayout 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:id="@android:id/tabcontent" 
      android:layout_weight="1"> 
     </FrameLayout> 

    </LinearLayout> 
</TabHost> 

Poi la mia classe TabBar è la seguente

public class CustomTabActivity extends TabActivity 
{ 
    @Override 
    public void onCreate(Bundle savedInstanceState) 
    { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.tabbar); 

     addTab1(FirstTab.class); 
     addTab2(SecondTab.class); 
     addTab3(FirstTab.class); 
     addTab4(SecondTab.class); 
    } 

    private void addTab1(Class<?> c) 
    { 
     TabHost tabHost = getTabHost(); 
     Intent intent = new Intent(this, c); 
     TabHost.TabSpec spec = tabHost.newTabSpec("tab"); 

     View tabIndicator = LayoutInflater.from(this).inflate(R.layout.tab_indicator1, getTabWidget(), false); 
     ImageView icon = (ImageView) tabIndicator.findViewById(R.id.icon1); 

     spec.setIndicator(tabIndicator); 
     spec.setContent(intent); 
     tabHost.addTab(spec); 
    } 
} 

mio layout tab_indicator è la seguente

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="0dip" 
    android:layout_height="55dip"  
    android:layout_weight="1" 
    android:orientation="vertical" 
    android:padding="5dp"> 

    <ImageView android:id="@+id/icon1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:background="@drawable/tab1">  
    </ImageView> 
</RelativeLayout> 

il tab1 nel drawable è un file XML di selezione come segue

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

</selector> 

Qui ho aggiunto l'immagine selezionata con una curva e l'immagine selezionata, senza piegare, che voglio mostrare.

Questo modo sembra essere molto lungo, ma mi sembra che sia lo stesso design di cui avevo bisogno.

Answer 2

Forse this example ti sarà utile. È lo stesso tipo di navigazione che ha l'applicazione Google+.