2016-03-07 18 views
7

Come posso aggiungere immagini nella scheda? Al momento sono in grado di spostare la scheda in basso ma non ho idea di come modificare LL Tab1, LL Tab2, LL Tab3 sull'icona. Sono sulla strada giusta? Qualsiasi aiuto sarebbe molto apprezzato.Aggiungi immagine su 3 schede

codice XML

<?xml version="1.0" encoding="utf-8"?> 
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/tabhost" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" > 

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


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

      <LinearLayout 
       android:id="@+id/ll_tab1" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:orientation="vertical" /> 

      <LinearLayout 
       android:id="@+id/ll_tab2" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:orientation="vertical" /> 

      <LinearLayout 
       android:id="@+id/ll_tab3" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:orientation="vertical" /> 
     </FrameLayout> 
     <TabWidget 
      android:id="@android:id/tabs" 
      android:background="@color/light_gray" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_weight="0"/> 
    </LinearLayout> 

</TabHost> 

enter image description here

Chiunque può aiutare? Molte grazie !

risposta

7

Provare a utilizzare TabLayout da Android Design Support Library per soddisfare material design guidelines for tabs.

TabLayout attrezzi della biblioteca design entrambe le linguette fisse, in cui la larghezza della vista è diviso equamente tra tutte le schede, nonché linguette scorrevoli, in cui le linguette non sono di dimensioni uniformi e possono scorrere orizzontalmente.

Per attuare TabLayout controllo questo guide e how to add the icon for swipeable tabs per impostare le icone per le schede utilizzando setIcon.

final int[] ICONS = new int[]{ 
     R.drawable.ic_action_document, 
     R.drawable.ic_action_tick, 
     R.drawable.ic_action_trash}; 
     .... 
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs); 
tabLayout.setupWithViewPager(mViewPager); 

tabLayout.getTabAt(0).setIcon(ICONS[0]); 
tabLayout.getTabAt(1).setIcon(ICONS[1]); 
tabLayout.getTabAt(2).setIcon(ICONS[2]); 

Per impostare le schede in fondo in un assegno TabLayout - How can I set tabs at the bottom and also hide top actionbar? cui si inserisce il TabLayout in un relativeLayout e allinearla a fondo genitore:

<android.support.design.widget.TabLayout 
    android:id="@+id/tab_layout" 
    app:tabMode="fixed" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:background="?attr/colorPrimary" 
    android:elevation="6dp" 
    app:tabTextColor="#d3d3d3" 
    app:tabSelectedTextColor="#ffffff" 
    app:tabIndicatorColor="#ff00ff" 
    android:minHeight="?attr/actionBarSize" 
    android:layout_alignParentBottom="true" 
    /> 

Anche se si può mettere il layout di scheda a in basso, cerca di non utilizzare le barre delle schede inferiori, se possibile, come indicato nella guida Pure Android.

Altre piattaforme utilizzano la barra inferiore della scheda per passare tra le visualizzazioni . Per convenzione di piattaforma, le schede di Android per il controllo della vista sono visualizzate nelle barre di azione nella parte superiore dello schermo.

-1

Bene è possibile posizionare un ImageView nel Linearlayout di ogni scheda oppure impostare un drawable come sfondo per LinearLayout. Se la tua immagine avrà uno sfondo, ovviamente vorrai aggiungere quell'immagine come sfondo e non aggiungere un ImageView come un bambino al tuo LinearLayout. Se sarà comunque contenuto, non uno sfondo, dovresti aggiungere un ImageView a ciascun LinearLayout come se aggiungessi un figlio di qualsiasi altro tipo a una Vista genitore.

+1

ho impostato un drawable come sfondo per LinearLayout ma l'immagine non mostrare –

2

Prova questo,

Puth questo activity_main.xml e impostare l'altezza personalizzata per TabLayout.

<android.support.design.widget.TabLayout 
     android:id="@+id/tabs" 
     android:layout_width="match_parent" 
     android:layout_height="@dimen/custom_tab_layout_height" 
     app:tabMode="fixed" 
     app:tabGravity="fill"/> 

Creare un layout xml denominato custom_tab.xml in res ⇒ layout. In questo layout abbiamo definito la visualizzazione personalizzata per la scheda.

<?xml version="1.0" encoding="utf-8"?> 
<TextView xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:id="@+id/tab" 
android:textColor="@color/colorAccent" 
android:textSize="@dimen/tab_label" 
android:fontFamily="@string/font_fontFamily_medium"/> 

Aprire MainActivity.java e modificare il codice come di seguito. Qui, se si osserva il metodo setupTabIcons(), ho reso il layout custom_tab.xml in ogni scheda utilizzando le righe di codice sottostanti.

TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null); 
tabOne.setText("ONE"); 
tabOne.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_favourite, 0, 0); 
tabLayout.getTabAt(0).setCustomView(tabOne); 

TextView tabTwo = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null); 
tabTwo.setText("TWO"); 
tabTwo.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_call, 0, 0); 
tabLayout.getTabAt(1).setCustomView(tabTwo); 

TextView tabThree = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null); 
tabThree.setText("THREE"); 
tabThree.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_contacts, 0, 0); 
tabLayout.getTabAt(2).setCustomView(tabThree); 
4
import android.os.Bundle; 
import android.support.design.widget.TabLayout; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentManager; 
import android.support.v4.app.FragmentPagerAdapter; 
import android.support.v4.view.ViewPager; 
import android.support.v7.app.AppCompatActivity; 
import android.support.v7.widget.Toolbar; 

import java.util.ArrayList; 
import java.util.List; 


public class MainActivity extends AppCompatActivity { 

    private Toolbar toolbar; 
    private TabLayout tabLayout; 
    private ViewPager viewPager; 
    private int[] tabIcons = { 
     R.drawable.ic_tab_favourite, 
     R.drawable.ic_tab_call, 
     R.drawable.ic_tab_contacts 
}; 

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

     toolbar = (Toolbar) findViewById(R.id.toolbar); 
     setSupportActionBar(toolbar); 

     getSupportActionBar().setDisplayHomeAsUpEnabled(true); 

     viewPager = (ViewPager) findViewById(R.id.viewpager); 
     setupViewPager(viewPager); 

     tabLayout = (TabLayout) findViewById(R.id.tabs); 
     tabLayout.setupWithViewPager(viewPager); 
     setupTabIcons(); 
    } 
private void setupTabIcons() { 
    tabLayout.getTabAt(0).setIcon(tabIcons[0]); 
    tabLayout.getTabAt(1).setIcon(tabIcons[1]); 
    tabLayout.getTabAt(2).setIcon(tabIcons[2]); 
} 
    private void setupViewPager(ViewPager viewPager) { 
     ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager()); 
     adapter.addFragment(new OneFragment(), "ONE"); 
     adapter.addFragment(new TwoFragment(), "TWO"); 
     adapter.addFragment(new ThreeFragment(), "THREE"); 
     viewPager.setAdapter(adapter); 
    } 

    class ViewPagerAdapter extends FragmentPagerAdapter { 
     private final List<Fragment> mFragmentList = new ArrayList<>(); 
     private final List<String> mFragmentTitleList = new ArrayList<>(); 

     public ViewPagerAdapter(FragmentManager manager) { 
      super(manager); 
     } 

     @Override 
     public Fragment getItem(int position) { 
      return mFragmentList.get(position); 
     } 

     @Override 
     public int getCount() { 
      return mFragmentList.size(); 
     } 

     public void addFragment(Fragment fragment, String title) { 
      mFragmentList.add(fragment); 
      mFragmentTitleList.add(title); 
     } 

     @Override 
     public CharSequence getPageTitle(int position) { 
      return mFragmentTitleList.get(position); 
     } 
    } 
} 

di layout per la linguetta activity_main.xml

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.design.widget.AppBarLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      app:layout_scrollFlags="scroll|enterAlways" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 

     <android.support.design.widget.TabLayout 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      app:tabMode="fixed" 
      app:tabGravity="fill"/> 
    </android.support.design.widget.AppBarLayout> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 
</android.support.design.widget.CoordinatorLayout> 

Fragments (Class) utilizzate in questa scheda

import android.os.Bundle; 
import android.support.v4.app.Fragment; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 



public class OneFragment extends Fragment{ 

    public OneFragment() { 
     // Required empty public constructor 
    } 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
    } 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
          Bundle savedInstanceState) { 
     // Inflate the layout for this fragment 
     return inflater.inflate(R.layout.fragment_one, container, false); 
    } 

} 

file XML fragment_one.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context=".fragments.OneFragment"> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="@string/one" 
     android:textSize="40dp" 
     android:textStyle="bold" 
     android:layout_centerInParent="true"/> 

</RelativeLayout> 

TwoFragment.java

import android.os.Bundle; 
    import android.support.v4.app.Fragment; 
    import android.view.LayoutInflater; 
    import android.view.View; 
    import android.view.ViewGroup; 



    public class TwoFragment extends Fragment{ 

     public TwoFragment() { 
      // Required empty public constructor 
     } 

     @Override 
     public void onCreate(Bundle savedInstanceState) { 
      super.onCreate(savedInstanceState); 
     } 

     @Override 
     public View onCreateView(LayoutInflater inflater, ViewGroup container, 
           Bundle savedInstanceState) { 
      // Inflate the layout for this fragment 
      return inflater.inflate(R.layout.fragment_two, container, false); 
     } 

    } 

fragment_two.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context=".fragments.TwoFragment"> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="@string/one" 
     android:textSize="40dp" 
     android:textStyle="bold" 
     android:layout_centerInParent="true"/> 

</RelativeLayout> 

È possibile creare terza classe frammento, e il layout come ho fatto sopra .

Eseguirlo. Spero che questo avrebbe funzionato

Problemi correlati