仅包含图标的表格布局
仅包含图标的表格布局
提问于 2015-06-17 21:07:28
我正在使用设计支持来创建选项卡。我还将ViewPager用于可滑动的标签。
现在，我不知道如何在选项卡中只使用图标而不是文本。我试着找出答案，但没有成功。
我的代码：
Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager = (ViewPager) findViewById(R.id.pager);
setupViewPager(viewPager);
setupTablayout();
}
private void setupTablayout() {
tabLayout = (TabLayout) findViewById(R.id.tabLayout);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setupWithViewPager(viewPager);
}
class MyPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public MyPagerAdapter(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) {
mFragmentTitleList.get(position)
}
}
private void setupViewPager(ViewPager viewPager) {
MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager());
adapter.addFrag(new frag(), "CAT");
adapter.addFrag(new frag(), "DOG");
adapter.addFrag(new frag(), "BIRD");
viewPager.setAdapter(adapter);
}回答 12
Stack Overflow用户
发布于 2015-06-18 19:44:41
一种方法是在TabLayout.setupWithViewPager()方法之后设置图标。
mTabLayout.setupWithViewPager(mViewPager);
for (int i = 0; i < mTabLayout.getTabCount(); i++) {
mTabLayout.getTabAt(i).setIcon(R.drawable.your_icon);
}Stack Overflow用户
发布于 2015-06-18 20:35:31
下面的链接中显示的教程应该涵盖了您想要的内容。https://github.com/codepath/android_guides/wiki/Google-Play-Style-Tabs-using-TabLayout#add-icons-to-tablayout
我复制了下面的相关部分。
将图标添加到TabLayout
目前，TabLayout类没有提供允许在选项卡中显示图标的干净抽象模型。有许多已发布的变通方法，其中之一是从PagerAdapter的getPageTitle( ImageSpan )方法返回一个位置，其中包含您的图标，如下面的代码片段所示：
private int[] imageResId = {
R.drawable.ic_one,
R.drawable.ic_two,
R.drawable.ic_three
};
// ...
@Override
public CharSequence getPageTitle(int position) {
// Generate title based on item position
// return tabTitles[position];
Drawable image = context.getResources().getDrawable(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>Stack Overflow用户
发布于 2016-06-01 13:46:21
在新版本的TabLayout中，谷歌添加了TabItem，它可以很容易地通过你的可扩展标记语言添加图标，代码如下：
<android.support.design.widget.TabLayout
app:tabTextColor="@color/gray"
app:tabMode="fixed"
app:tabBackground="@color/red"
app:tabIndicatorHeight="4dp"
app:tabIndicatorColor="@color/purple"
app:tabPadding="2dp"
app:tabSelectedTextColor="@color/white"
app:tabMinWidth="64dp"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<!--add height and width to TabItem -->
<android.support.design.widget.TabItem
android:text="@string/tab_text"/>
<android.support.design.widget.TabItem
android:icon="@drawable/ic_android"/>
</android.support.design.widget.TabLayout>请参阅更多here。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30892545
复制相关文章
相似问题