Tab icona e testo entrambi utilizzando libreria di supporto di progettazione Android

Question

] 1] 1 ho usato Android tablayout supporto progettuale e ho ottenuto sia icona e testo sulla scheda .. Ho usato un customtabview per allineare l'icona e il testo vertically..And i vuoi cambiare il colore dell'icona e del testo quando selezionato/non selezionato.

ho creato un file di selettore per l'icona di una scheda diversa ... ma la cosa è quando eseguo il progetto, la prima scheda predefinita è deselezionata, voglio che vengano selezionati automaticamente ... e se vado in un'altra scheda e poi faccio scorrere indietro alla prima scheda funziona perfettamente bene ... il problema principale è che non posso fare il primo frammento della scheda selezionato ... per favore aiutatemi come mi sono bloccato per 2 giorni passati..e non voglio usare alcuna libreria da github

MainActivity.java

import android.support.v7.app.AppCompatActivity; 
import android.os.Bundle; 
import android.view.Menu; 
import android.view.MenuItem; 
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; 
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 android.view.LayoutInflater; 
import android.widget.TextView; 

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.image1, 
      R.drawable.image2, 
      R.drawable.image3 
    }; 

    @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() { 

     TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null); 
     tabOne.setText("ONE"); 
     tabOne.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.image1, 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.image2, 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.image3, 0, 0); 
     tabLayout.getTabAt(2).setCustomView(tabThree); 
    } 

    private void setupViewPager(ViewPager viewPager) { 
     ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager()); 
     adapter.addFrag(new OneFragment(), "ONE"); 
     adapter.addFrag(new TwoFragment(), "TWO"); 
     adapter.addFrag(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 addFrag(Fragment fragment, String title) { 
      mFragmentList.add(fragment); 
      mFragmentTitleList.add(title); 
     } 

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

image1.xml

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

tre file crestati come sopra per tre immagine diversa.

custom_tab.xml

<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/selector" 
    android:textSize="@dimen/tab_label" 
    android:fontFamily="@string/font_fontFamily_medium"/> 

selector.xml per il testo

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_selected="true" 
     android:color="#fe5d55" /> <!-- pressed --> 
    <item android:state_pressed="true" 
     android:color="#fe5d55" /> <!-- focused --> 
    <item android:color="#000000" /> <!-- default --> 
</selector> 

chiunque può aiutare?

Answer 1

Cosa intendi per non selezionato. Puoi condividere un'immagine di ciò che stai cercando di raggiungere e dove sei ora.

Non consiglierei il tuo approccio. Fa un sacco di cose che non sono necessarie per risolvere il tuo problema. Suggerisco di utilizzare l'icona e il testo della classe TabLayout e di impostare solo le icone (selezionabili con stati) e il testo. Oppure, se necessario, anche un layout personalizzato, ma facendo uso di text1 e icona da TabLayout. Hai qualche problema a fare questo?

---

Aggiornamento ..

Prova il qui sotto:

IconTextTabLayout.java:

package example.customtabs; 

import android.content.Context; 
import android.support.annotation.NonNull; 
import android.support.design.widget.TabLayout; 
import android.support.v4.view.PagerAdapter; 
import android.util.AttributeSet; 

import sample.customtabs.example.com.customtabs.R; 


public class IconTextTabLayout extends TabLayout { 


    public IconTextTabLayout(Context context) { 
     super(context); 
    } 

    public IconTextTabLayout(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 

    public IconTextTabLayout(Context context, AttributeSet attrs, int defStyleAttr) { 
     super(context, attrs, defStyleAttr); 
    } 

    @Override 
    public void setTabsFromPagerAdapter(@NonNull PagerAdapter adapter) { 
     this.removeAllTabs(); 
     int i = 0; 
     for (int count = adapter.getCount(); i < count; ++i) { 
      this.addTab(this.newTab().setCustomView(R.layout.custom_tab) 
        .setIcon(YourIcons[i]) 
        .setText(adapter.getPageTitle(i))); 
     } 
    } 
} 

custom_tab.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 


    <ImageView 
     android:id="@android:id/icon" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"/> 

    <TextView 
     android:id="@android:id/text1" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"/> 

</LinearLayout> 

nella vostra attività utilizzo xml IconTextTabLayout. Come:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 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:orientation="vertical"> 

    <example.customtabs.IconTextTabLayout 
     android:id="@+id/sliding_tabs" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:tabMode="scrollable"/> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="0px" 
     android:layout_weight="1" 
     android:background="@android:color/white"/> 

</LinearLayout> 

anche, impostare la visualizzazione cercapersone ad esso nella vostra attività come:

IconTextTabLayout tabLayout = (IconTextTabLayout) findViewById(R.id.sliding_tabs); 
tabLayout.setupWithViewPager(viewPager); 

getPageTitle Override l'adattatore viewpager per fornire titolo.

@Override 
public CharSequence getPageTitle(int position) { 
    return TITLES[i]; 
} 

Inoltre, se si vuole si può ottenere le icone troppo dalla scheda scrivendo un metodo che restituisce drawable, proprio come il metodo getPageTitle. Questo è opzionale. Solo una questione di design.

-

YourIcons[] = Questo è un array di drawable. Nel tuo caso - file XML, con immagini non selezionate selezionate e ...

Answer 2

Invece di personalizzazione della TabLayout come specificato dalla risposta @Abhilash basta aggiungere una riga cioè tabOne.setSelected(true); nel codice qui sotto

TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null); 
tabOne.setText("ONE"); 
tabOne.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.image1, 0, 0); 
tabOne.setSelected(true); //This will make your tab by default selected 
tabLayout.getTabAt(0).setCustomView(tabOne);