Одним из решений здесь является раздувание пользовательского макета для каждой вкладки, что даст вам больше контроля над появлением каждой вкладки. Это делается с помощью метода setCustomView().
Обратите внимание: это будет выглядеть по-разному на разных разрешениях экрана.
Всегда сложно сделать его идеальным на каждом устройстве, но, по крайней мере, с помощью этого метода вы получите больше контроля, так как вы можете использовать разные XML-файлы с разным размером для разных разрешений/размеров экрана.
Один из подходов заключался в том, чтобы размер шрифта был как можно большим, без обрезания на каждом размере экрана.
У меня есть простой пример работы, который ограничивает текст на каждой вкладке одной строкой, однако в этом простом примере он также заставляет длинный текст на боковых вкладках эллипсизовать без изменения размера шрифта. Следующим шагом будет выяснить оптимальный размер шрифта для каждого размера экрана и создать для каждой отдельной макету xml.
Тэги: custom_tab.Файл XML, с android:singleLine="true" указано:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/custom_text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="?attr/selectableItemBackground"
android:gravity="center"
android:textSize="16dip"
android:textColor="#ffffff"
android:singleLine="true"
/>
</LinearLayout>
Вот макет для MainActivity:
<RelativeLayout
android:id="@+id/main_layout"
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="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
app:tabMode="fixed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/toolbar"
android:background="?attr/colorPrimary"
android:elevation="6dp"
app:tabTextColor="#d3d3d3"
app:tabSelectedTextColor="#ffffff"
app:tabIndicatorColor="#ff00ff"
android:minHeight="?attr/actionBarSize"
/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="@id/tab_layout"/>
</RelativeLayout>
Вот код активности, который включает в себя FragmentPagerAdapter:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
// Get the ViewPager and set it's PagerAdapter so that it can display items
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
PagerAdapter pagerAdapter =
new PagerAdapter(getSupportFragmentManager(), MainActivity.this);
viewPager.setAdapter(pagerAdapter);
// Give the TabLayout the ViewPager
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.setupWithViewPager(viewPager);
// Iterate over all tabs and set the custom view
for (int i = 0; i < tabLayout.getTabCount(); i++) {
TabLayout.Tab tab = tabLayout.getTabAt(i);
tab.setCustomView(pagerAdapter.getTabView(i));
}
}
class PagerAdapter extends FragmentPagerAdapter {
String tabTitles[] = new String[] { "Aufzeichnung", "Berichte", "Neue Aufgabe", };
Context context;
public PagerAdapter(FragmentManager fm, Context context) {
super(fm);
this.context = context;
}
@Override
public int getCount() {
return tabTitles.length;
}
@Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return new BlankFragment();
case 1:
return new BlankFragment();
case 2:
return new BlankFragment();
}
return null;
}
@Override
public CharSequence getPageTitle(int position) {
// Generate title based on item position
return tabTitles[position];
}
public View getTabView(int position) {
View tab = LayoutInflater.from(MainActivity.this).inflate(R.layout.custom_tab, null);
TextView tv = (TextView) tab.findViewById(R.id.custom_text);
tv.setText(tabTitles[position]);
return tab;
}
}
}
И вот с помощью вышеуказанного кода:
Обратите внимание, что если вы удалите android:singleLine="true", это выглядит так, подобно тому, как она выглядит в вашем вопросе:
Таковы два режима TabLayout. Если вы использовали фиксированный, то все вкладки имеют одинаковый размер. Это означает, что для вкладок 1 и 3 меньше места.Если вы используете прокручиваемую, текст находится в одной строке, а вкладка занимает минимальное пространство и имеет левую гравитацию. Для разработки Android вы все равно не должны относиться к себе с одним размером экрана. Возможно, вам стоит подумать о внедрении чего-то вроде: http://stackoverflow.com/a/31363206/2977237. – tachyonflux
Почему бы вам не попробовать создать собственный макет вкладки и управлять им. Используйте пользовательский макет в качестве вкладки и дайте слушателям макет детей. – Tauqir