Блог

Мне нужно показать многострочное текстовое описание под значками моих вкладок (на самом деле мне нужны две строки, но я пытаюсь описать это в целом).

Использование описания из одного слова ухудшит читаемость, и я не хочу использовать макет вкладки с возможностью прокрутки, потому что мне нужно показать только 4 варианта.

Кроме того, использование TextView в качестве пользовательского представления для макета вкладки просто кажется неправильным.

Я пытался создать пользовательский макет для элемента вкладки и использовать его, но по какой-то причине слова прерываются посередине.

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

Решается с помощью пользовательского макета и OnTabSelectedListener.

Мой пользовательский макет (tab_item.xml ):

 <?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<ImageView
    android:id="@ id/tab_item_icon"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:layout_marginTop="8dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:srcCompat="@drawable/some_icon_drawable" />

<TextView
    android:id="@ id/tab_item_text"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="8dp"
    android:layout_marginBottom="8dp"
    android:autoText="false"
    android:breakStrategy="simple"
    android:singleLine="false"
    android:text="Two Lines Text View"
    android:textAlignment="center"
    android:textAllCaps="true"
    android:textSize="10sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@ id/tab_item_icon" /></androidx.constraintlayout.widget.ConstraintLayout>
  

Мои настройки и метод:

     private void setTabs(){
    TabLayout tabLayout = view.findViewById(R.id.tabLayout);

    icons.add(R.drawable.some_drawable_1);
    icons.add(R.drawable.some_drawable_2);
    icons.add(R.drawable.some_drawable_3);
    icons.add(R.drawable.some_drawable_4);

    tabsNames.add(getString(R.string.some_tab_name_1));
    tabsNames.add(getString(R.string.some_tab_name_2));
    tabsNames.add(getString(R.string.some_tab_name_3));
    tabsNames.add(getString(R.string.some_tab_name_4));

    new TabLayoutMediator(tabLayout, viewPager,
            (tab, position) -> tab.setCustomView(R.layout.tab_item)
    ).attach();

    for(int currTab = 0; currTab < tabsNames.size() ; currTab  ){
        tabTextView = (tabLayout.getTabAt(currTab).getCustomView().findViewById(R.id.tab_item_text));
        tabImageView = (tabLayout.getTabAt(currTab).getCustomView().findViewById(R.id.tab_item_icon));
        tabTextView.setText(tabsNames.get(currTab));
        tabImageView.setImageDrawable(getResources().getDrawable(icons.get(currTab), null));
    }

    tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            tabTextView = (tabLayout.getTabAt(tab.getPosition()).getCustomView().findViewById(R.id.tab_item_text));
            tabImageView = (tabLayout.getTabAt(tab.getPosition()).getCustomView().findViewById(R.id.tab_item_icon));
            tabTextView.setTextColor(getResources().getColor(R.color.colorPrimary));
            tabImageView.setColorFilter(getResources().getColor(R.color.colorPrimary));
        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {
            tabTextView = (tabLayout.getTabAt(tab.getPosition()).getCustomView().findViewById(R.id.tab_item_text));
            tabImageView = (tabLayout.getTabAt(tab.getPosition()).getCustomView().findViewById(R.id.tab_item_icon));
            tabTextView.setTextColor(getResources().getColor(R.color.colorPrimaryDark));
            tabImageView.setColorFilter(getResources().getColor(R.color.colorPrimaryDark));
        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {
            tabTextView = (tabLayout.getTabAt(tab.getPosition()).getCustomView().findViewById(R.id.tab_item_text));
            tabImageView = (tabLayout.getTabAt(tab.getPosition()).getCustomView().findViewById(R.id.tab_item_icon));
            tabTextView.setTextColor(getResources().getColor(R.color.colorPrimary));
            tabImageView.setColorFilter(getResources().getColor(R.color.colorPrimary));
        }
    });

    tabLayout.getTabAt(0).select();
}