Добавление значков на вкладки в TabLayout в Android

Я хочу добавить значки на свои вкладки в TabLayout в Android. Я попробовал Icon Array и метод getTitle. Никаких иконок у меня не было. Вкладки остаются только с текстом заголовка, текст в массиве текста заголовка вообще не используется. Вот мой код:

import statements...

public class scatter extends FragmentActivity {
    some variable declarations...

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_scatter);
        sensorUID = getIntent().getStringExtra("sUID");
        tankname = getIntent().getStringExtra("tNAME");
        SCALE_C = (getIntent().getStringExtra("tSCALEC"));
        SCALE_M = (getIntent().getStringExtra("tSCALEM"));
        DPs = (getIntent().getStringExtra("tDP"));
        UNITs = (getIntent().getStringExtra("tUNIT"));
        numVar = Integer.parseInt(DPs);

       final ViewPager pager = (ViewPager) findViewById(R.id.viewPager);
        pager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));

        TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
        tabLayout.addTab(tabLayout.newTab().setText("Graph"));
        tabLayout.addTab(tabLayout.newTab().setText("Values"));

        tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
        pager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
        tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {

            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                pager.setCurrentItem(tab.getPosition());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });

    }



    private class MyPagerAdapter extends FragmentPagerAdapter {


        public MyPagerAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public Fragment getItem(int pos) {
            Fragment fragment;
            Bundle args = new Bundle();
            args.putString("senID", sensorUID);
            args.putInt("numVar", numVar);

            switch (pos) {
                case 0:
                    fragment = FirstFragment.newInstance("FirstFragment, Instance 1");
                    break;
                case 1:
                    fragment = SecondFragment.newInstance("SecondFragment, Instance 1");
                    break;
                default:
                    fragment = FirstFragment.newInstance("FirstFragment, Instance 1");
                    break;
            }
            fragment.setArguments(args);
            return fragment;
        }


        @Override
        public int getCount() {
            return 2;
        }
    }
}

person Shivam Srivastava    schedule 23.10.2015    source источник
comment
Чтобы изменить это, вам нужно будет создать пользовательские вкладки: CustomTabs в android   -  person activesince93    schedule 23.10.2015


Ответы (2)


TabLayout.Tab имеет метод setIcon().

    TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
    tabLayout.addTab(tabLayout.newTab().setText("Graph").setIcon(R.drawable.ic_graph));
    tabLayout.addTab(tabLayout.newTab().setText("Values").setIcon(R.drawable.ic_values));
person kris larson    schedule 23.10.2015
comment
Работает как шарм, Бог знает, почему на stackoverflow были все эти странные решения. - person Shivam Srivastava; 23.10.2015

как сказал актив, так как для этого вы можете использовать собственный макет вкладок-

определение пользовательского стиля в styles.xml, а затем применение стиля к вашему TabLayout:

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">#0000FF</item>
</style>

Затем вы можете переопределить этот стиль для своего TabLayout:

<android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    style="@style/MyCustomTabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
</android.support.design.widget.TabLayout>

Есть несколько других стилей, которые можно настроить для TabLayout:

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
<item name="tabMaxWidth">@dimen/tab_max_width</item>
<item name="tabIndicatorColor">?attr/colorAccent</item>
<item name="tabIndicatorHeight">2dp</item>
<item name="tabPaddingStart">12dp</item>
<item name="tabPaddingEnd">12dp</item>
<item name="tabBackground">?attr/selectableItemBackground</item>
<item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
<item name="tabSelectedTextColor">?android:textColorPrimary</item>
</style>

<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textSize">14sp</item>
<item name="android:textColor">?android:textColorSecondary</item>
<item name="textAllCaps">true</item>
</style>

В настоящее время класс TabLayout не предоставляет чистую модель абстракции, позволяющую размещать значки на вкладке. Существует много опубликованных обходных путей, один из которых заключается в том, чтобы вернуть SpannableString, содержащую ваш значок в ImageSpan, из вашего

Метод getPageTitle(position) PagerAdapter, как показано во фрагменте кода ниже:

private int[] imageResId = {
    R.drawable.ic_one,
    R.drawable.ic_two,
    R.drawable.ic_three};
public CharSequence getPageTitle(int position) {     
Drawable image = ContextCompat.getDrawable(context, imageResId[position]);
 image.setBounds(0, 0, image.getIntrinsicWidth(),          

image.getIntrinsicHeight());
SpannableString sb = new SpannableString(" ");
ImageSpan imageSpan = new ImageSpan(image, ImageSpan.ALIGN_BOTTOM);
sb.setSpan(imageSpan, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return sb;}

По умолчанию вкладка, созданная TabLayout, задает для свойства textAllCaps значение true, что предотвращает визуализацию ImageSpans. Вы можете переопределить это поведение, изменив свойство tabTextAppearance.

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
  <item name="tabTextAppearance">@style/MyCustomTextAppearance</item>
</style>

<style name="MyCustomTextAppearance" parent="TextAppearance.Design.Tab">
  <item name="textAllCaps">false</item>
</style>

вы можете добавить значок и текст следующим образом: @Override public CharSequence getPageTitle(int position) { // Генерировать заголовок на основе позиции элемента Drawable image = context.getResources(). image.setBounds(0, 0, image.getIntrinsicWidth(),

image.getIntrinsicHeight());
// Replace blank spaces with image icon
SpannableString sb = new SpannableString("   " + tabTitles[position]);
ImageSpan imageSpan = new ImageSpan(image, ImageSpan.ALIGN_BOTTOM);
sb.setSpan(imageSpan, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return sb;
}
person sud    schedule 23.10.2015