Android 在具有1个字符的TextView周围创建偶数边框

您好，我想在android视图中重新创建此“设计”。基本上是文本视图周围的均匀边界

我创建了一个文本视图：

            <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="R"
            android:textSize="30sp"
            android:background="@drawable/border_red"
            android:gravity="center" />

我添加了一个可绘制的形状：

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

    <solid android:color="@android:color/transparent"/>
    <stroke
        android:width="4dp"
        android:color="#ff687b" />
    <corners android:radius="4dp"/>
    <padding android:right="0dp" android:left="0dp" android:bottom="0dp" android:top="0dp"/>
</shape>

android previewer和应用程序中的奇怪行为我得到了这种奇怪的行为：

我还没有定义任何填充物。它们都设置为

0dp

，但边框似乎已经有了某种边距/填充

此行为使在角色周围创建均匀的矩形边框变得困难：-(

---

问题出在哪里，我做错了什么？

使用android:includeFontPadding=“false”从

文本视图中删除字体填充

<TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="R"
            android:textSize="30sp"
            android:includeFontPadding="false"
            android:background="@drawable/border_red"
            android:gravity="center" />




这将删除
文本视图
顶部和底部的大部分
填充

要得到一个完美的正方形，您必须为
TextView
提供
宽度和
高度的固定值，使用
android:includeFontPadding=“false”
从
TextView

<TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="R"
            android:textSize="30sp"
            android:includeFontPadding="false"
            android:background="@drawable/border_red"
            android:gravity="center" />




这将删除
文本视图
顶部和底部的大部分
填充

要得到一个完美的正方形，您必须为
文本视图
提供固定的
宽度
和
高度
，如果您不同意，这是可以的。我向您展示，让您了解。：）

<TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="R"
            android:textSize="30sp"
            android:includeFontPadding="false"
            android:background="@drawable/border_red"
            android:gravity="center" />

使用与上面相同的XML

这是我的布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.vzw.www.myapplication.MainActivity"
    android:orientation="vertical"
    android:padding="10dp">


    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/red_border"
        android:padding="10dp">


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:includeFontPadding="false"
            android:text="H"
            android:textStyle="bold"/>

    </LinearLayout>

</LinearLayout>



这是这个的结果


您也可以通过创建自定义文本视图来实现这一点。。。但我不想谈这个。。。但如果你愿意，你可以。实际上，这是一个更好的解决方案
 如果你不同意，那没关系。我向你展示，让你学习。：）

使用与上面相同的XML

这是我的布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.vzw.www.myapplication.MainActivity"
    android:orientation="vertical"
    android:padding="10dp">


    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/red_border"
        android:padding="10dp">


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:includeFontPadding="false"
            android:text="H"
            android:textStyle="bold"/>

    </LinearLayout>

</LinearLayout>



这是这个的结果


您也可以通过创建自定义文本视图来实现这一点。。。但我不想谈这个。。。但如果你愿意，你可以。实际上，这是一个更好的解决方案
 将文本视图放在线性或相对布局中。。。在该布局中添加填充。。然后将边框添加到该视图，而不是文本视图。使用线性布局作为父级并将边框添加到其中，与将边框添加到文本视图没有区别您错了..但是可以。将文本视图放在线性或相对布局中。。。在该布局中添加填充。。然后将边框添加到该视图中，而不是文本视图中。使用线性布局作为父级并将边框添加到其中，与将边框添加到文本视图中没有区别。你错了。。但没问题。@rubiktubik你尝试过上面的解决方案吗？我尝试过这个解决方案，它稍微好一点，但我仍然无法为边框提供相同的填充。使用固定宽度和高度在不同的环境下可能会出现问题screens@rubiktubik没有办法将
TextView
尺寸缩小到精确的像素完美文本大小。为了获得所需的结果，您必须给出固定大小，而不是
wrap\u content
。而且在图像（R）中，左侧和右侧填充比顶部和底部填充更多。因此，您可以通过为
顶部和底部
以及
左侧和右侧
提供不同的填充来获得结果。这不是最佳解决方案。看看我的答案。提供静态宽度和高度的视图并不好，因为在dp方面，存在更小/更大的设备。我不会投反对票，但这是错误的@PrithviBhola@DroiDev我不明白将
文本视图
包装在
线性布局
中的意义。这没什么区别。我建议对
顶部和底部
以及
左侧和右侧
进行不同的填充，这是必需的。@rubiktubik您尝试过上述解决方案吗？我尝试过这个解决方案，它使效果更好一些，但我仍然无法对边框进行相同的填充。使用固定宽度和高度在不同的环境下可能会出现问题screens@rubiktubik没有办法将
TextView
尺寸缩小到精确的像素完美文本大小。为了获得所需的结果，您必须给出固定大小，而不是
wrap\u content
。而且在图像（R）中，左侧和右侧填充比顶部和底部填充更多。因此，您可以通过为
顶部和底部
以及
左侧和右侧
提供不同的填充来获得结果。这不是最佳解决方案。看看我的答案。提供静态宽度和高度的视图并不好，因为在dp方面，存在更小/更大的设备。我不会投反对票，但这是错误的@PrithviBhola@DroiDev我不明白将
文本视图
包装在
线性布局
中的意义。这没什么区别。我建议对
顶部和底部
和
左侧和右侧
进行不同的填充，这是必需的情况。我认为这种情况下
顶部和底部
和
左侧和右侧
填充不合适。请检查问题中
（R）
的图像，
顶部和底部
以及
左侧和右侧
填充不同。因此，需要为
顶部和底部
以及
左侧和右侧
提供不同的填充。然后，正如我开始时所说，创建自定义视图更好。对于自定义视图，您还将以编程方式提供不同的填充，这与在XML中提供填充相同。因为如果您注意到，文本高度大于其宽度，并且我们需要方形视图，因此您必须提供不同的填充。而在使用Paint/Rect/Canvas时则不需要。可以绘制自定义边框。我建议你调查一下。您可以完全消除填充，找到高度，做一些数学运算，并计算适当的填充。在这种情况下，
top和bottom
和
left和right
填充是没有的