2

I have created tablayout. And added icons to the left side of each tab. But I am not able to see those icons. Following is code of java file

public class ActivityAllVerification extends AppCompatActivity {

    SessionManager sessionManager;
    Toolbar toolbar;
    private TabLayout tabLayout;
    private ViewPager viewPager;

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

    }

    private void initDefaultSettings() {
        sessionManager = new SessionManager(ActivityAllVerification.this);
        toolbar = (Toolbar) findViewById(R.id.appbar);
        setSupportActionBar(toolbar);
        ((ImageView) toolbar.findViewById(R.id.bitcoin_logo)).setVisibility(View.GONE);
        TextView txt = (TextView) toolbar.findViewById(R.id.toolbar_txt_title);
        txt.setText("Account Verification");
        getSupportActionBar().setDisplayShowHomeEnabled(true);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowTitleEnabled(false);//disable default action bar title
        // Toast.makeText(this, "" + sessionManager.isUser(), Toast.LENGTH_SHORT).show();
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        setupViewPager(viewPager);
        tabLayout = (TabLayout) findViewById(R.id.tabs);
        tabLayout.setupWithViewPager(viewPager);
        setupTabIcons();
        tabLayout.post(new Runnable() {
            @Override
            public void run() {
                tabLayout.setupWithViewPager(viewPager);
            }
        });

    }

    private void setupTabIcons() {
        TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
        tabOne.setText("PAN CARD");
        tabOne.setCompoundDrawablesWithIntrinsicBounds(R.drawable.ic_bitcoin_24, 0, 0, 0);
        tabLayout.getTabAt(0).setCustomView(tabOne);

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

        TextView tabThree = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
        tabThree.setText("BACK ACCOUNT");
        tabOne.setCompoundDrawablesWithIntrinsicBounds(R.drawable.ic_bitcoin_24, 0, 0, 0);
        tabLayout.getTabAt(2).setCustomView(tabThree);
        Toast.makeText(this, "" + sessionManager.isUser(), Toast.LENGTH_SHORT).show();
        if (!sessionManager.isUser())
        {
            TextView tabFour = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
            tabThree.setText("TAX INCOICE");
            tabOne.setCompoundDrawablesWithIntrinsicBounds(R.drawable.ic_bitcoin_24, 0, 0, 0);
            tabLayout.getTabAt(3).setCustomView(tabFour);
        }
    }

    private void setupViewPager(ViewPager viewPager) {
        ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
        adapter.addFragment(new FragmentPanCard(), "PAN CARD");
        adapter.addFragment(new FragmentAadharCard(), "AADAHR CARD");
        adapter.addFragment(new FragmentBankAccount(), "BANK ACCOUNT");
        if (!sessionManager.isUser())
            adapter.addFragment(new FragmentTaxInvoice(), "TAX INVOICE");
        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);
        }
    }
}

here from here I have created the custom tabs and in setupTabIcons() I am setting icon on left of tab. Here is code of customtab.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="4dp"
    android:id="@+id/tab"
    android:textColor="@color/colorWhite"
    android:fontFamily="@string/font_fontFamily_medium"/>

and here is code of activity_all_verification.xml

<RelativeLayout 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:background="@drawable/background_color">

        <include
            android:id="@+id/appbar"
            layout="@layout/toolbar"></include>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/appbar"
            app:tabGravity="fill"
            app:tabMode="scrollable"
            app:tabIndicatorColor="@color/colorWhite"
            app:tabTextColor="@color/colorWhite"/>


        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/tabs"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />
    </RelativeLayout>

for the first time tabs were not displaying properly so from enter link description here I have added the following code in .java file

tabLayout.post(new Runnable() {
        @Override
        public void run() {
            tabLayout.setupWithViewPager(viewPager);
        }
    });

So now its displaying tab text color in black. I want tab text color in white with left side icon.How to achieve it?

  • you are already giving title to tabs in `setupViewPager()` method. remove giving titles in `setupTabIcons()` method and try using only `tabLayout.getTabAt(0).setIcon(R.drawable.icon); ` inside `setupTabIcons()` – Mohammed Farhan Feb 02 '18 at 07:28
  • Try this http://www.androidhive.info/2015/09/android-material-design-working-with-tabs/ – Ratilal Chopda Feb 02 '18 at 07:30
  • **remove this line** tabLayout.post(new Runnable() { @Override public void run() { tabLayout.setupWithViewPager(viewPager); } }); – Adil Feb 02 '18 at 07:31
  • @MohammedFarhan thanks for you reply. but its giving the same output –  Feb 02 '18 at 07:47
  • @Adilhusen. thanks for your reply. but now its not showing the title of any tabs, showing only icon of only first tab –  Feb 02 '18 at 07:49
  • @RatilalChopda yes I have followed the same –  Feb 02 '18 at 07:50
  • change in customtab.xml android:layout_width="wrap_content" instead of match_parent – Adil Feb 02 '18 at 07:51
  • still giving the same result –  Feb 02 '18 at 07:58
  • okay please refer once this -https://mobikul.com/make-custom-tabs-icons-android/ – Adil Feb 02 '18 at 11:28
  • I have followed [this](https://stackoverflow.com/questions/32661681/tab-icon-and-text-both-using-android-design-support-library) way. And it works :) –  Mar 01 '18 at 06:30

1 Answers1

0

I struggled with same problem for a while until I found that if you call notifyDataSetChanged of SectionsPageAdapter after having set the icons, tab icons will not be displayed.

Just make sure to set icons every time after calling notifyDataSetChanged()

private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;
TabLayout tabLayout;

private int[] tabIcons = {
    R.drawable.icon_tab_settings,
    R.drawable.icon_tab_edit,
    R.drawable.icon_tab_recordings,
    R.drawable.icon_tab_pentagram
};

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    ...

    mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
    mViewPager = findViewById(R.id.container);
    mViewPager.setAdapter(mSectionsPagerAdapter);
    mViewPager.setCurrentItem(1);
    tabLayout = findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(mViewPager);

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


    ...
}

public void refreshView(){
    if(mSectionsPagerAdapter!=null){
        mSectionsPagerAdapter.notifyDataSetChanged();

        //refresh tab icons again
        tabLayout.getTabAt(0).setIcon(tabIcons[0]);
        tabLayout.getTabAt(1).setIcon(tabIcons[1]);
        tabLayout.getTabAt(2).setIcon(tabIcons[2]);
        tabLayout.getTabAt(3).setIcon(tabIcons[3]);
    } 
}