【问题标题】:How to add page title and icon in android FragmentPagerAdapter如何在 android FragmentPagerAdapter 中添加页面标题和图标
【发布时间】:2015-07-07 05:27:43
【问题描述】:

我想在标题页标题中显示带有相应图标的标题。如下图,但只能显示标题和缺少的图标。

这是我的示例代码。

public class SectionsPagerAdapter extends FragmentPagerAdapter {

    public SectionsPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        // getItem is called to instantiate the fragment for the given page.
        // Return a DummySectionFragment (defined as a static inner class
        // below) with the page number as its lone argument.

        Log.e("POSITION", "position=" + position);
        Fragment fragment;
        switch (position) {
        case 0:
         //Fragment1
        case 1:
         //Fragment2
        case 2:
         //Fragment3
        case 3:
         //Fragment4
        case 4:
         //Fragment5

        }
        return null;

    }

    @Override
    public int getCount() {
        return NUM_PAGES;
    }

    // using both these techniques but could not get icon in title
    /*
     * public int getIconResId(int index) { return ICONS[index % ICONS.length]; }
     */

    public int getPageIconResId(int position) {
        return ICONS[position];
    }

    @Override
    public CharSequence getPageTitle(int position) {
        Locale l = Locale.getDefault();
        switch (position) {
        case 0:
        return getString(R.string.title_section1).toUpperCase(l);
        case 1:
        return getString(R.string.title_section2).toUpperCase(l);
        case 2:
        return getString(R.string.title_section3).toUpperCase(l);
        case 3:
        return getString(R.string.title_section4).toUpperCase(l);
        case 4:
        return getString(R.string.title_section5).toUpperCase(l);
        }
        return null;
    }

    }

在 onCreate 中:

mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());

    // Set up the ViewPager with the sections adapter.
    mViewPager = (ViewPager) findViewById(R.id.pager);
    mViewPager.setAdapter(mSectionsPagerAdapter);

使用这个xml文件在fragment中显示fragment页面适配器;

<android.support.v4.view.ViewPager
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/rlv2"
        android:layout_marginTop="-30dp" >

        <android.support.v4.view.PagerTitleStrip
            android:id="@+id/pager_title_strip"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingBottom="4dp"
            android:paddingTop="4dp"  
            android:textColor="@color/black"
            android:textStyle="bold" />
    </android.support.v4.view.ViewPager>

我需要我的应用程序的输出图像。请您知道如何显示带有图标和标题的部分页面适配器。

【问题讨论】:

    标签: android fragmentpageradapter


    【解决方案1】:

    如果您使用的是设计支持库TabLayout,您可以直接调用:

    tabLayout.getTabAt(i).setIcon();
    

    【讨论】:

    • 这个答案很好地完成了工作并节省了时间。谢谢。
    • 打电话但在哪里?我正在使用 TabLayout 并且没有一个答案有效,如果您在 bindViewPager 中调用它,那么您将收到一个空引用错误。您能否像 @Dharma 那样在 ActionsAdapter 类中更新您的答案?
    • 这就是方式,但是,Tablayout/ViewPager 中存在一些错误,即在片段刷新后图标被删除。每次都需要重新插入。
    【解决方案2】:

    我从 Stever 得到了解决方案。

    Drawable myDrawable;
    String title;
    
    @Override
    public CharSequence getPageTitle(int position) {
       switch (position) {
        case 0:
           myDrawable = getResources().getDrawable(R.drawable.img_section1);
           title = getResources().getString(R.string.title_section1);
           break;
        case 1:
           myDrawable = getResources().getDrawable(R.drawable.img_section2);
           title = getResources().getString(R.string.title_section2);
           break;
        case 2:
           myDrawable = getResources().getDrawable(R.drawable.img_section3);
           title = getResources().getString(R.string.title_section3);
           break;
        case 3:
           myDrawable = getResources().getDrawable(R.drawable.img_section4);
           title = getResources().getString(R.string.title_section4);
           break;
        case 4:
           myDrawable = getResources().getDrawable(R.drawable.img_section5);
           title = getResources().getString(R.string.title_section5);
           break;
        default:
          //TODO: handle default selection
           break;
        }
    
        SpannableStringBuilder sb = new SpannableStringBuilder("   " + title); // space added before text for convenience
        try {
            myDrawable.setBounds(5, 5, myDrawable.getIntrinsicWidth(), myDrawable.getIntrinsicHeight());
            ImageSpan span = new ImageSpan(myDrawable, DynamicDrawableSpan.ALIGN_BASELINE);
            sb.setSpan(span, 0, 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
            return sb;
        } catch (Exception e) {
            // TODO: handle exception
        }
    

    谢谢你。

    【讨论】:

    • getResources() 被调用。
    • 如果由于文本大写而无法正常工作,请参见 stackoverflow.com/a/32780701/630833。
    • 如何做到这一点,我创建了每个选项卡有 2 个图像的选择器。当我选择一个选项卡时,我的图像颜色将是白色,在选择器中处于选中状态,否则图像默认为黑色。我在上面的 myDrawable 中尝试过。但它不起作用。
    【解决方案3】:

    对我来说它是这样工作的:

    @Override
        public CharSequence getPageTitle(int position) {
            SpannableStringBuilder sb;
            ImageSpan span;
            switch (position) {
                case 0:
                    myDrawable = getResources().getDrawable(R.drawable.heart_18);
                    sb = new SpannableStringBuilder("  Page1"); // space added before text for convenience
    
                    myDrawable.setBounds(0, 0, myDrawable.getIntrinsicWidth(), myDrawable.getIntrinsicHeight());
                    span = new ImageSpan(myDrawable, ImageSpan.ALIGN_BASELINE);
                    sb.setSpan(span, 0, 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    
                    return sb;
                case 1:
                    myDrawable = getResources().getDrawable(R.drawable.star_grey_18);
                     sb = new SpannableStringBuilder("  Page2"); // space added before text for convenience
    
                    myDrawable.setBounds(0, 0, myDrawable.getIntrinsicWidth(), myDrawable.getIntrinsicHeight());
                    span = new ImageSpan(myDrawable, ImageSpan.ALIGN_BASELINE);
                    sb.setSpan(span, 0, 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    
                    return sb;
                case 2:
                    myDrawable = getResources().getDrawable(R.drawable.star_pink_18);
                    sb = new SpannableStringBuilder("  Page3"); // space added before text for convenience
    
                    myDrawable.setBounds(0, 0, myDrawable.getIntrinsicWidth(), myDrawable.getIntrinsicHeight());
                    span = new ImageSpan(myDrawable, ImageSpan.ALIGN_BASELINE);
                    sb.setSpan(span, 0, 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    
                    return sb;
            }
        }
    }
    

    【讨论】:

    • 您好,它不能与 TabLayout 一起使用,我怎样才能使它工作?
    【解决方案4】:

    你可以使用:

    myTabLayout.getTabAt(index).setIcon(R.drawable.myIcon);
    

    【讨论】:

      【解决方案5】:

      在这里寻找解决方案

      像这样创建图标数组 private int[] tabIcons = { R.drawable.ic_tab_favourite, R.drawable.ic_tab_call, R.drawable.ic_tab_contacts};

      和 setIcon 到 tabLayout

      tabLayout = (TabLayout) findViewById(R.id.tabs);
      

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

      这里有更多

      链接1:https://www.androidhive.info/2015/09/android-material-design-working-with-tabs/

      链接2:http://www.androiddeft.com/tablayout-viewpager-android/

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2020-04-28
        • 1970-01-01
        • 1970-01-01
        • 2012-07-03
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多