如何为可滑动标签添加图标

Posted 2023-04-15

【中文标题】如何为可滑动标签添加图标

【英文标题】：how to add the icon for swipeable tabs

【发布时间】：2014-02-27 00:25:12

【问题描述】：

我正在从here 下载代码我想显示带有图标的选项卡如何可能请帮助我。

 public class MainActivity extends FragmentActivity implements
            ActionBar.TabListener 

    private ViewPager viewPager;
    private TabsPagerAdapter mAdapter;
    private ActionBar actionBar;
    // Tab titles
    private String[] tabs =  "Text", "Photo", "Record" ,"Tag";


    @TargetApi(Build.VERSION_CODES.HONEYCOMB)
    @SuppressLint("NewApi")
    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Initilization
        viewPager = (ViewPager) findViewById(R.id.pager);
        actionBar = getActionBar();
        mAdapter = new TabsPagerAdapter(getSupportFragmentManager());

        final int[] ICONS = new int[] 
            R.drawable.ic_launcher,
            R.drawable.ic_launcher,
            R.drawable.ic_launcher,
            R.drawable.ic_launcher,
    ;

        viewPager.setAdapter(mAdapter);
        actionBar.setHomeButtonEnabled(false);
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);        

        // Adding Tabs
        for (String tab_name : tabs) 
            actionBar.addTab(actionBar.newTab().setText(tab_name)
                    .setTabListener(this));


        

        /**
         * on swiping the viewpager make respective tab selected
         * */
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() 

            @Override
            public void onPageSelected(int position) 
                // on changing the page
                // make respected tab selected
                actionBar.setSelectedNavigationItem(position);
            

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) 
            

            @Override
            public void onPageScrollStateChanged(int arg0) 
            
        );
    

    @Override
    public void onTabReselected(Tab tab, FragmentTransaction ft) 
    

    @Override
    public void onTabSelected(Tab tab, FragmentTransaction ft) 
        // on tab selected
        // show respected fragment view
        viewPager.setCurrentItem(tab.getPosition());
    

    @Override
    public void onTabUnselected(Tab tab, FragmentTransaction ft) 
    

【参考方案1】：

如果您使用的是TabLayout，只需执行此操作（此示例使用三个选项卡）：

 //An array containing your icons from the drawable directory
 final int[] ICONS = new int[]
            R.drawable.icon_1,
            R.drawable.icon_2,
            R.drawable.icon_3
    ;

    //Get reference to your Tablayout
    TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(mViewPager);

    tabLayout.getTabAt(0).setIcon(ICONS[0]);
    tabLayout.getTabAt(1).setIcon(ICONS[1]);
    tabLayout.getTabAt(2).setIcon(ICONS[2]);

【讨论】：

谢谢！这个对我有用。其他相关 SO 问题的解决方案标记为“已弃用”。

【参考方案2】：

在你的 for 循环中添加 .setIcon(resources.getDrawable(DrawableIDHere))，并稍微改变你的 for 循环。

// Adding Tabs
for (int i=0; i < tabs.length; i++)

actionBar.addTab(actionBar.newTab().setText(tabs[i])
                         .setIcon(resources.getDrawable(ICONS[i]))
                         .setTabListener(this));
//endfor

另外，不要忘记将正确的可绘制 ID 放入您的 ICONS 数组中！

【讨论】：

.setIcon(resources.GetDrwable(ICONS[i])) 资源无法解析错误..这是什么？？

你需要改用getResources()

【参考方案3】：

// here you add an array of your icon   
 final int[] ICONS = new int[] 
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
            ;

    // add this following code to solve your problem
    // here NewsFeedActivity.this.getResources() is used to get the drawable folder resource
    // instead of NewsFeedActivity you have to use your activity name here  
    for (int i=0; i < tabs.length; i++)
            
            actionBar.addTab(actionBar.newTab().setText(tabs[i])
                                     .setIcon(NewsFeedActivity.this.getResources().getDrawable(ICONS[i]))
                                     .setTabListener(this));
            //endfor

【讨论】：

我在代码中添加了注释，这是我在堆栈溢出中的第一条注释。

我认为代码很容易解释并且代码注释很好。感谢您的提交。

【参考方案4】：

您好，请查看ViewPagerIndicator 库。

这是可滑动标签的一个很好的例子。