Зробіть свій значок a TextView
, дозволяючи встановити числове значення на будь-яке, що вам подобається, зателефонувавши setText()
. Встановіть фон TextView
як XML- <shape>
малюнок, за допомогою якого ви можете створити суцільне або градієнтне коло з межею. Малюнок XML, який можна малювати, масштабуватиметься відповідно до подання, оскільки його розмір буде більшим чи меншим.
res / drawable / 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-значними числами. Якщо цей ефект небажаний, спробуйте підхід із заокругленим прямокутником, як показано нижче. При невеликих числах прямокутник все одно буде виглядати як коло, коли радіуси сходяться між собою.
res / drawable / 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>
Сподіваємось, цього достатньо для того, щоб принаймні змусити вас вказати у правильному напрямку!