Сделайте свой значок TextView
, что позволит вам установить числовое значение на что угодно, вызвав setText()
. Установите фон TextView
в виде рисованного XML <shape>
, с помощью которого вы можете создать сплошной или градиентный круг с рамкой. Отрисовка XML будет масштабироваться, чтобы соответствовать представлению, поскольку оно изменяет размер с большим или меньшим количеством текста.
Рез / рисуем / badge_circle.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#F00" />
<stroke
android:width="2dip"
android:color="#FFF" />
<padding
android:left="5dip"
android:right="5dip"
android:top="5dip"
android:bottom="5dip" />
</shape>
Вы должны взглянуть на то, как овал / круг масштабируется с большими 3-4-значными числами. Если этот эффект нежелателен, попробуйте подход с закругленными прямоугольниками, как показано ниже. С небольшими числами прямоугольник все равно будет выглядеть как круг, когда радиусы сходятся вместе.
Рез / рисуем / badge_circle.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:radius="10dip"/>
<solid
android:color="#F00" />
<stroke
android:width="2dip"
android:color="#FFF" />
<padding
android:left="5dip"
android:right="5dip"
android:top="5dip"
android:bottom="5dip" />
</shape>
Создав масштабируемый фон, вы просто добавляете его к фону TextView
, например:
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="10"
android:textColor="#FFF"
android:textSize="16sp"
android:textStyle="bold"
android:background="@drawable/badge_circle"/>
Наконец, эти значки TextView
можно разместить в макете поверх соответствующих кнопок / вкладок. Вероятно, я бы сделал это, сгруппировав каждую кнопку с ее значком в RelativeLayout
контейнере, например:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="@+id/myButton"
android:layout_width="65dip"
android:layout_height="65dip"/>
<TextView
android:id="@+id/textOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@id/myButton"
android:layout_alignRight="@id/myButton"
android:text="10"
android:textColor="#FFF"
android:textSize="16sp"
android:textStyle="bold"
android:background="@drawable/badge_circle"/>
</RelativeLayout>
Надеюсь, этого достаточно, чтобы хотя бы указать вам правильное направление!