在android中为标签添加徽章

Question

我想在我的应用程序中添加徽章,就像在iPhone中一样.

iPhone中使用的徽章的屏幕截图位于以下链接中:

我在Android应用程序中做了一些像徽章的图像,其屏幕截图在以下链接中:

这不是我想要的徽章,我想要像iPhone一样的标签上的徽章

谁能建议我在android中添加标签到tab？请帮我.

提前致谢.

Answer 1

这可以通过使用Android ViewBadger实现.检查一下

Answer 2

这是如何在选项卡中添加徽章的示例

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,tab indicator.xml是标签的标准drawable,我从sdk获得,我建议你也应该从sdk中的api文件夹中获取它,因为你还需要要从drawable文件夹中复制一些图像,你可以找到它 your_sdk_drive:\ sdk\platforms\android-8

Answer 3

我也在android sdk中找到了解决方案,但没有找到,所以我去为它写了一个自定义的TabWidget.

简短版本:

• 扩展TabWidget类并重写方法:drawChild(Canvas canvas,View child,long drawingTime)
• 在绘画中,您只需在画布上绘制一个位图.使用child.getRight()获取子项的x位置,并减去徽章Bitmap的宽度.还要绘制徽章编号的文本.
• 要保持每个选项卡的状态,可以使用带有每个选项卡索引的键的HashMap.
• 为了能够从任何地方更新选项卡,我使用了一个单例类,其中包含我从主活动初始化的小部件.

可在此处找到更多信息,包括示例android项目的源代码:

http://nilisoft.com/?p=622

请享用!