在Android的标签页中添加徽章

问题描述

| 我想将徽章添加到我的应用程序中的标签，就像在iPhone中一样。 iPhone中使用的徽章的屏幕快照位于以下链接中：我已经在android应用中完成了徽章之类的图像，其屏幕截图位于以下链接中：这不是我想要的徽章，我想要在iPhone上的标签上徽章有人可以建议我在Android标签中添加徽章吗？请帮我。提前致谢。

解决方法

这可以通过使用Android ViewBadger实现。检查这个 , 这是如何在标签中添加徽章的示例 chat_tab.xml

<RelativeLayout xmlns:android=\"http://schemas.android.com/apk/res/android\"
    android:layout_width=\"0dip\" 
    android:layout_height=\"64dip\"
    android:layout_weight=\"1\" 
    android:layout_marginLeft=\"-3dip\" 
    android:layout_marginRight=\"-3dip\" 
    android:orientation=\"vertical\" 
    android:background=\"@drawable/tab_indicator\" >

    <ImageView
        android:id=\"@+id/chat_icon\"
        android:layout_width=\"wrap_content\"
        android:layout_height=\"wrap_content\"
        android:src=\"@drawable/chat_icon\"
        android:layout_centerHorizontal=\"true\"/>

    <TextView
        android:id=\"@+id/new_notifications\" 
        android:layout_width=\"wrap_content\"
        android:layout_height=\"wrap_content\"
        android:layout_alignTop=\"@+id/chat_icon\"
        android:layout_toRightOf=\"@+id/chat_icon\"
        android:layout_marginLeft=\"-8dp\"
        android:layout_marginTop=\"0dp\"
        android:paddingTop=\"2dp\"
        android:paddingLeft=\"5dp\"
        android:paddingRight=\"5dp\"
        android:paddingBottom=\"2dp\"
        android:textSize=\"8sp\"
        android:textStyle=\"bold\"
        android:textColor=\"@android:color/primary_text_dark\"
        android:background=\"@drawable/badge\"
        android:visibility=\"gone\"/>

    <TextView 
        android:layout_width=\"wrap_content\"
        android:layout_height=\"wrap_content\"
        android:text=\"@string/chat\"
        style=\"@android:attr/tabWidgetStyle\"
        android:textColor=\"@android:color/tab_indicator_text\"
        android:layout_centerHorizontal=\"true\"
        android:layout_alignParentBottom=\"true\"/>


</RelativeLayout>

这是badge.xml（通知背景为红色圆圈），TextView id：new_notifications背景

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

    <stroke android:width=\"2dp\" android:color=\"#FFFFFF\" />

    <corners android:radius=\"10dp\"/>

    <padding android:left=\"2dp\" />

    <solid android:color=\"#ff2233\"/>

</shape>

然后，您可以在代码中简单地执行

LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View chatTab = inflater.inflate(R.layout.chat_tab,null);

        tvNewNotifications = (TextView) chatTab.findViewById(R.id.new_notifications);

        intent = new Intent().setClass(MainTab.this,Chat.class);
        tabSpec = tabHost
                .newTabSpec(\"chat\")
                .setIndicator(chatTab)
                .setContent(intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP));

如您所见，我的相对布局有一个背景@drawable/tab_indicator选项卡indicator.xml是框架的标准可绘制选项卡，我是从sdk中获得的，我建议您也应该从sdk中的api文件夹中获取它因为您还需要从可绘制文件夹中复制一些图像，所以可以找到它 your_sdk_drive：\\ sdk \\ platforms \\ android-8 , 我也在android sdk中寻找了一个解决方案，但没有找到，于是我去为它编写了一个自定义TabWidget。简短版本：扩展TabWidget类并重写方法：drawChild（画布画布，查看子级，长drawingTime）在绘画中，您只需在画布上绘制一个位图。您可以通过child.getRight（）获得孩子的x位置，并减去徽章位图的宽度。还要在其顶部绘制徽章编号的文本。为了保持每个标签的状态，您可以使用带有键的HashMap作为每个标签的索引。为了能够从任何地方更新选项卡，我使用了单例类，并将其内部的小部件从主要活动初始化。在此处可以找到更多信息，包括示例android项目的源代码： http://nilisoft.com/?p=622 请享用！ , 您想重新绘制标签页的图像，请查看此答案。更新Android标签页图标 , 在调整了一些其他解决方案之后，我想出了一些简单的方法，希望对您有所帮助。创建自定义选项卡布局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是一个椭圆形的可绘制对象，其中填充了您想要的徽章颜色

<?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) 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);

android android 徽章标签标签添加添加添加页中

在Android的标签页中添加徽章

问题描述

解决方法

相关问答