添加徽章到标签

时间:2014-08-27 21:51:06

标签: android

如何向标签添加徽章?我正在使用此代码

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    viewPager = (ViewPager) findViewById(R.id.pager);
    actionBar = getActionBar();
    mAdapter = new TabsPagerAdapter(getSupportFragmentManager());

    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) {
        }
    });
}

main activity.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.v4.view.ViewPager
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </android.support.v4.view.ViewPager>

</FrameLayout>

选项卡适配器java

public class TabsPagerAdapter extends FragmentPagerAdapter {

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

    @Override
    public Fragment getItem(int index) {

        switch (index) {
        case 0:

            return new RandomsFragment();
        case 1:
            return new ChatsFragment();
        }
        return null;
    }

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

}

我正在关注标签:http://www.androidhive.info/2013/10/android-tab-layout-with-swipeable-views-1/

我不明白如何为标签添加徽章。

3 个答案:

答案 0 :(得分:5)

第一步是为每个标签创建自定义布局:

     <?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/text1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:gravity="center_vertical"
    android:paddingLeft="6dip"
    android:minHeight="?android:attr/listPreferredItemHeight"
/>

然后,当您想要向操作栏添加标签时,您必须执行以下操作:

     private void addTabs(ActionBar actionBar)
{
    ActionBar.Tab tab1=actionBar.newTab();

    tab1.setTabListener(this);
    tab1.setCustomView(R.layout.tab);
    TextView txt1 = (TextView)tab1.getCustomView().findViewById(R.id.text1);
    txt1.setText("Tab 1");

    ActionBar.Tab tab2=actionBar.newTab();

    tab2.setTabListener(this);
    tab2.setCustomView(R.layout.tab);
    TextView txt2 = (TextView)tab2.getCustomView().findViewById(R.id.text1);
    txt2.setText("Tab 2");

    ActionBar.Tab tab3=actionBar.newTab();
    tab3.setCustomView(R.layout.tab);
    tab3.setTabListener(this);
    TextView txt3 = (TextView)tab3.getCustomView().findViewById(R.id.text1);
    txt3.setText("Tab 3");

    actionBar.addTab(tab1);
    actionBar.addTab(tab2);
    actionBar.addTab(tab3);
}

所以为了访问它们并添加badgeView:

View v = getActionBar().getTabAt(0).getCustomView();
            BadgeView badge = new BadgeView(getActivity(), v);
            badge.setText("1");
            badge.show();

结果将是:

enter image description here

答案 1 :(得分:1)

在调整了一些其他解决方案后,我想出了一些简单的东西,希望这会对某人有所帮助。

创建自定义标签布局tab_badge.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent">

<TextView
android:id="@+id/tab_badge"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@drawable/badge_background"
android:gravity="center"
android:layout_centerVertical="true"
android:textColor="@color/colorWhite"
android:textSize="20sp"
android:textStyle="bold"/>

<TextView
android:id="@+id/tab_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="16sp"
android:textColor="@color/colorWhite"
android:text="test"
android:textStyle="bold"
android:gravity="center"
android:textAppearance="@style/Widget.AppCompat.Light.ActionBar.TabText"
android:layout_toRightOf="@+id/tab_badge"/>

</RelativeLayout>

badge_background.xml是一个椭圆形的drawable,填充了徽章所需的颜色

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"      android:shape="oval" >
 <solid android:color="@color/colormaterialred500" />
 </shape>

扩展textview以获取myBadgeView类:

public class myBadgeView extends TextView {

private View target;

public myBadgeView(Context context, View target) {
super(context);
init(context, target);
}

private void init(Context context, View target) {
this.target = target;
}

public void updateTabBadge(int badgeNumber) {
if (badgeNumber > 0) {
    target.setVisibility(View.VISIBLE);
    ((TextView) target).setText(Integer.toString(badgeNumber));
}
else {
    target.setVisibility(View.GONE);
}
}
}

在您的活动中声明tablayout,如下所示:

tabLayout = (TabLayout) findViewById(R.id.tab_layout);
TabLayout.Tab tab1 = tabLayout.newTab();
tab1.setCustomView(R.layout.tab_badge);
TextView tab_text_1 = (TextView) tab1.getCustomView().findViewById(R.id.tab_text);
tab_text_1.setText("Tab1");
tabLayout.addTab(tab1);
badge1 = new myBadgeView(this,     tab1.getCustomView().findViewById(R.id.tab_badge));     tab1.getCustomView().findViewById(R.id.tab_badge);

 //set the badge for the tab
 badge1.updateTabBadge(badge_value_1);

答案 2 :(得分:0)

AFAIK,徽章不支持开箱即用。您可能会发现此图书馆很有用:https://github.com/jgilfelt/android-viewbadger