6

我正在尝试按照此https://guides.codepath.com/android/Google-Play-Style-Tabs-using-TabLayout#add-custom-view-to-tablayout使用 tablayout 制作标签

现在我正在尝试使用图像跨度显示图标而不是文本。但是如果没有运气,任何人都可以帮助指出本教程中缺少的内容吗?

这是代码

public class HomeActivity extends FragmentActivity {

//Fragments List
public ArrayList <Fragment> fragmentList;

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

    setUpFragmentList();

    // Get the ViewPager and set it's PagerAdapter so that it can display items
    ViewPager viewPager = (ViewPager) findViewById(R.id.home_viewpager);
    viewPager.setAdapter(new HomeFragmentPagerAdapter(getSupportFragmentManager(), HomeActivity.this, fragmentList));

    // Give the TabLayout the ViewPager
    TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
    //start this 2 are to set the tab to fill entire screen
    tabLayout.setTabMode(TabLayout.MODE_FIXED);
    tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
    //end this 2 are to set the tab to fill entire screen

    tabLayout.setupWithViewPager(viewPager);
    tabLayout.getTabAt(1).setIcon(R.drawable.ic_tab_down_activity);

}

private void setUpFragmentList() {
    fragmentList = new ArrayList<>();

    fragmentList.add(new MyActivitesFragment());
    fragmentList.add(new ChatListFragment());
    fragmentList.add(new QuickMatchFragment());
    fragmentList.add(new FilterMatchFragment());
}
}


public class HomeFragmentPagerAdapter extends FragmentPagerAdapter {
private String tabTitles[] = new String[] { "Tab1", "Tab2", "Tab3" ,"Tab4"};
private Context context;

private ArrayList <Fragment> fragmentList;

private int[] imageResId = {
        // unclicked
        R.drawable.ic_tab_down_activity,
        R.drawable.ic_tab_down_chat,
        R.drawable.ic_tab_down_find,
        R.drawable.ic_tab_down_filter
};

public HomeFragmentPagerAdapter(FragmentManager fm, Context context, ArrayList <Fragment> fragmentList) {
    super(fm);
    this.context = context;
    this.fragmentList = fragmentList;
}

@Override
public int getCount() {
    return fragmentList.size();
}

@Override
public Fragment getItem(int position) {
    return fragmentList.get(position);
}

@Override
public CharSequence getPageTitle(int 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;
}
}
4

4 回答 4

5

在您的自定义选项卡布局文件中,只需将 textAllCaps 设置为 false。它将起作用:)原因,图像正在被转换为字符,那么如果它是真的,那么将它们转换为大写将不会渲染图像。

<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">16sp</item>
    <item name="android:textColor">?android:textColorSecondary</item>
    <item name="textAllCaps">false</item>
</style>
于 2015-08-06T21:46:35.200 回答
3

显然我已经通过使用 TabLayout.getTabAt(i).setIcon(imageResId[i]); 找到了解决方案。

起初我的意图是能够从 viewpager 适配器设置所有图标。但因为我不知道也没有时间找到解决方案。我会改为使用我发现的其他技巧。

并且还切换图像我使用 TabLayout.TabLayoutOnPageChangeListener

希望这对需要这个的人也有帮助。=]

于 2015-08-11T04:00:44.393 回答
0

好吧,我猜您缺少 xml 中的要点。为您的选项卡布局设置文本外观样式。即 textAllCaps = false 否则图像跨度将不起作用。

于 2015-07-25T08:08:19.133 回答
-1

您还没有添加任何选项卡。

像这样添加一个选项卡:tabLayout.addTab(tabLayout.newTab().setText("Tab One"));。

于 2015-07-24T14:06:51.120 回答