徽章TextView文本未与中心对齐

时间:2017-08-24 18:11:16

标签: android android-layout textview android-7.0-nougat

Android开发的全新内容...我在按钮上有徽章文字,但由于某种原因,文字未与中心对齐。

我创建了一个新片段并将Component Tree设置为relativeLayout

然后我添加了按钮和textview。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/relativeLayout"
    android:layout_width="match_parent"
    android:layout_height="200dp">

    <Button
        android:id="@+id/intercom_button"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_marginEnd="8dp"
        android:layout_marginTop="40dp"
        android:background="@drawable/ic_intercom_logo"
        android:elevation="10dp"
        android:outlineProvider="bounds"
        android:shadowColor="@color/brownishGrey"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/intercom_badge_textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@id/intercom_button"
        android:layout_alignRight="@id/intercom_button"
        android:layout_alignTop="@id/intercom_button"
        android:layout_marginEnd="8dp"
        android:layout_marginTop="35dp"
        android:background="@drawable/badge_circle"
        android:elevation="11dp"
        android:paddingEnd="8dp"
        android:paddingLeft="8dp"
        android:paddingRight="8dp"
        android:text="10"
        android:textAlignment="center"
        android:gravity="center"
        android:textColor="#FFF"
        android:textSize="10dp"
        app:layout_constraintEnd_toEndOf="@+id/intercom_button"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

drawable/badge_circle我用过。

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:useLevel="false"
    android:thickness="8dp"
    android:innerRadius="0dp"
    >

    <solid
        android:color="#F00"
        />
    <stroke
        android:width="1dip"
        android:color="#F00" />

    <padding
        android:top="2dp"
        android:bottom="2dp"/>

</shape>

这导致

enter image description here

根据我的理解,它正在发生,因为textview属性设置为

layout_width:wrap_content 
layout_height:wrap_content

但是,如果我将它们设置为静态约束,如

layout_width:16dp
layout_height:16dp

文字仍然没有对齐。设置重力或文本对齐也无济于事

android:textAlignment="center"
android:gravity="center"

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:2)

badge_circle.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:useLevel="false"
    android:thickness="8dp"
    android:innerRadius="0dp"
    >

    <solid
        android:color="#F00"
        />
    <stroke
        android:width="1dip"
        android:color="#F00" />


</shape>

更改为TextView

<TextView
    android:id="@+id/intercom_badge_textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignEnd="@id/intercom_button"
    android:layout_alignRight="@id/intercom_button"
    android:layout_alignTop="@id/intercom_button"
    android:layout_marginTop="35dp"
    android:background="@drawable/badge_circle"
    android:elevation="11dp"
    android:paddingTop="5dp"
    android:paddingBottom="5dp"
    android:paddingEnd="8dp"
    android:paddingLeft="8dp"
    android:paddingRight="8dp"
    android:text="10"
    android:textAlignment="center"
    android:gravity="center|center_horizontal|center_vertical"
    android:textColor="#FFF"
    android:textSize="10dp"
    app:layout_constraintEnd_toEndOf="@+id/intercom_button"
    app:layout_constraintTop_toTopOf="parent"
    tools:layout_editor_absoluteX="357dp" />

我从徽章圈内移除了填充并添加到textview ....似乎已修复...