如何在 Android TextView 周围添加边框？

Question

是否可以在 Android TextView 周围绘制边框？

Answer 1

您可以将可绘制的形状（矩形）设置为视图的背景。

<TextView android:text="Some text" android:background="@drawable/back"/>

和矩形drawable back.xml（放入res/drawable文件夹中）：

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
   <solid android:color="@android:color/white" />
   <stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>

您可以使用@android:color/transparent使纯色具有透明背景。
您还可以使用填充将文本与边框分开。
有关详细信息，请参阅：http://developer.android.com/guide/主题/资源/drawable-resource.html

Answer 2

让我总结一下几种不同的（非编程）方法。

使用形状可绘制

将以下内容保存为可绘制文件夹中的 XML 文件（例如 my_border.xml）：

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

    <!-- View background color -->
    <solid
        android:color="@color/background_color" >
    </solid>

    <!-- View border color and width -->
    <stroke
        android:width="1dp"
        android:color="@color/border_color" >
    </stroke>

    <!-- The radius makes the corners rounded -->
    <corners
        android:radius="2dp"   >
    </corners>

</shape>

然后将其设置为 TextView 的背景：

<TextView
    android:id="@+id/textview1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/my_border" />

更多帮助：

• 可绘制形状（Android 文档）
• Android 开发人员提示技巧：XML Drawables（第一部分）

使用 9-patch

9-patch 是一个可拉伸的背景图像。如果你制作一个带有边框的图像，那么它会给你的 TextView 一个边框。您需要做的就是制作图像，然后将其设置为 TextView 中的背景。

<TextView
    android:id="@+id/textview1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/my_ninepatch_image" />

以下是一些展示如何制作 9-patch 图像的链接：

• 绘制 9-patch< /a>
• 简单的九补丁生成器
• Android UI 9 补丁的简单指南
• 创建&在 Android 中使用 9 块图像

如果我只想要顶部边框怎么办？

使用图层列表

您可以使用图层列表将两个矩形堆叠在一起。通过使第二个矩形比第一个矩形稍小，您可以制作边框效果。第一个（下方）矩形是边框颜色，第二个矩形是背景颜色。

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

    <!-- Lower rectangle (border color) -->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/border_color" />
        </shape>
    </item>

    <!-- Upper rectangle (background color) -->
    <item android:top="2dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/background_color" />
        </shape>
    </item>
</layer-list>

设置 android:top="2dp" 会将顶部偏移（使其变小）2dp。这允许第一个（下部）矩形显示出来，产生边框效果。您可以将其应用到 TextView 背景，就像上面完成 shape 可绘制对象一样。

以下是有关图层列表的更多链接：

• 了解 Android 的
• 如何在可绘制形状XML选择器中制作底部边框？
• 在可绘制的 Android 视图上创建边框xml，在 3 面？

使用 9 块

您可以只制作带有单个边框的 9 块图像。其他一切都与上面讨论的相同。

使用视图

这是一种技巧，但如果您需要在两个视图之间添加分隔符或向单个 TextView 添加边框，那么它会很有效。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textview1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <!-- This adds a border between the TextViews -->
    <View
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@android:color/black" />

    <TextView
        android:id="@+id/textview2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

以下是更多链接：

• 如何在 Android 中画一条线
• 如何在活动中的编辑文本之间放置水平除数线
• 如何添加水平 1px相对布局中图像视图上方的行？

Answer 3

简单的方法是为 TextView 添加一个视图。底部边框线示例：

<LinearLayout android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent">
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:text="@string/title"
        android:id="@+id/title_label"
        android:gravity="center_vertical"/>
    <View
        android:layout_width="fill_parent"
        android:layout_height="0.2dp"
        android:id="@+id/separator"
        android:visibility="visible"
        android:background="@android:color/darker_gray"/>

</LinearLayout>

对于其他方向边框，请调整分隔视图的位置。

Answer 4

我通过扩展文本视图并手动绘制边框解决了这个问题。
我什至添加了这样您可以选择边框是点线还是虚线。

public class BorderedTextView extends TextView {
        private Paint paint = new Paint();
        public static final int BORDER_TOP = 0x00000001;
        public static final int BORDER_RIGHT = 0x00000002;
        public static final int BORDER_BOTTOM = 0x00000004;
        public static final int BORDER_LEFT = 0x00000008;

        private Border[] borders;

        public BorderedTextView(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);
            init();
        }

        public BorderedTextView(Context context, AttributeSet attrs) {
            super(context, attrs);
            init();
        }

        public BorderedTextView(Context context) {
            super(context);
            init();
        }
        private void init(){
            paint.setStyle(Paint.Style.STROKE);
            paint.setColor(Color.BLACK);
            paint.setStrokeWidth(4);        
        }
        @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);
            if(borders == null) return;

            for(Border border : borders){
                paint.setColor(border.getColor());
                paint.setStrokeWidth(border.getWidth());

                if(border.getStyle() == BORDER_TOP){
                    canvas.drawLine(0, 0, getWidth(), 0, paint);                
                } else
                if(border.getStyle() == BORDER_RIGHT){
                    canvas.drawLine(getWidth(), 0, getWidth(), getHeight(), paint);
                } else
                if(border.getStyle() == BORDER_BOTTOM){
                    canvas.drawLine(0, getHeight(), getWidth(), getHeight(), paint);
                } else
                if(border.getStyle() == BORDER_LEFT){
                    canvas.drawLine(0, 0, 0, getHeight(), paint);
                }
            }
        }

        public Border[] getBorders() {
            return borders;
        }

        public void setBorders(Border[] borders) {
            this.borders = borders;
        }
}

和边界类：

public class Border {
    private int orientation;
    private int width;
    private int color = Color.BLACK;
    private int style;
    public int getWidth() {
        return width;
    }
    public void setWidth(int width) {
        this.width = width;
    }
    public int getColor() {
        return color;
    }
    public void setColor(int color) {
        this.color = color;
    }
    public int getStyle() {
        return style;
    }
    public void setStyle(int style) {
        this.style = style;
    }
    public int getOrientation() {
        return orientation;
    }
    public void setOrientation(int orientation) {
        this.orientation = orientation;
    }
    public Border(int Style) {
        this.style = Style;
    }
}

希望这对某人有帮助:)

Answer 5

我发现的最简单的解决方案（并且实际上有效）：

<TextView
    ...
    android:background="@android:drawable/editbox_background" />

Answer 6

您可以通过两种方法设置边框。一种是通过可绘制的，第二种是通过编程的。

使用 Drawable

<shape>
    <solid android:color="@color/txt_white"/>
    <stroke android:width="1dip" android:color="@color/border_gray"/>
    <corners android:bottomLeftRadius="10dp"
             android:bottomRightRadius="0dp"
             android:topLeftRadius="10dp"
             android:topRightRadius="0dp"/>
    <padding android:bottom="0dip"
             android:left="0dip"
             android:right="0dip"
             android:top="0dip"/>
</shape>

---

编程

---

public static GradientDrawable backgroundWithoutBorder(int color) {

    GradientDrawable gdDefault = new GradientDrawable();
    gdDefault.setColor(color);
    gdDefault.setCornerRadii(new float[] { radius, radius, 0, 0, 0, 0,
                                           radius, radius });
    return gdDefault;
}

Answer 7

通过材质组件库，您可以使用 MaterialShapeDrawable。

    <TextView
        android:id="@+id/textview"
        .../>

然后，您可以以编程方式应用 MaterialShapeDrawable：

    TextView textView = findViewById(R.id.textview);
    MaterialShapeDrawable shapeDrawable = new MaterialShapeDrawable();
    shapeDrawable.setFillColor(ContextCompat.getColorStateList(this,android.R.color.transparent));
    shapeDrawable.setStroke(1.0f, ContextCompat.getColor(this,R.color....));
    ViewCompat.setBackground(textView,shapeDrawable);

Answer 8

我只是在看一个类似的答案——它可以通过 Stroke 和以下覆盖来完成：

@Override
public void draw(Canvas canvas, MapView mapView, boolean shadow) {

Paint strokePaint = new Paint();
strokePaint.setARGB(255, 0, 0, 0);
strokePaint.setTextAlign(Paint.Align.CENTER);
strokePaint.setTextSize(16);
strokePaint.setTypeface(Typeface.DEFAULT_BOLD);
strokePaint.setStyle(Paint.Style.STROKE);
strokePaint.setStrokeWidth(2);

Paint textPaint = new Paint();
textPaint.setARGB(255, 255, 255, 255);
textPaint.setTextAlign(Paint.Align.CENTER);
textPaint.setTextSize(16);
textPaint.setTypeface(Typeface.DEFAULT_BOLD);

canvas.drawText("Some Text", 100, 100, strokePaint);
canvas.drawText("Some Text", 100, 100, textPaint);

super.draw(canvas, mapView, shadow); 
}

Answer 9

您可以在代码中添加类似这样的内容：

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle" >
    <solid android:color="#ffffff" />
    <stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>

Answer 10

您可以将可绘制的形状（带角的矩形）设置为视图的背景。

<TextView android:background="@drawable/frame"/>

和矩形可绘制frame.xml（放入res/drawable文件夹中）：

<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <solid android:color="@android:color/white" />
    <stroke android:width="1dip"
     android:color="#3d4caf"/>
    <corners android:radius="50dp"/>
</shape>

Answer 11

我找到了一种更好的方法来在 TextView 周围添加边框。

使用九块图像作为背景。非常简单，SDK 附带了一个制作 9 补丁图像的工具，并且完全不涉及编码。

链接是 http://developer.android.com /guide/topics/graphics/2d-graphics.html#nine-patch。

Answer 12

检查下面的链接以制作圆角
http://androidcookbook.com/Recipe.seam?recipeId=2318

可绘制文件夹Android 项目中的 res 下的 不限于位图（PNG 或 JPG 文件），还可以保存 XML 文件中定义的形状。

然后可以在项目中重复使用这些形状。形状可用于在布局周围放置边框。此示例显示了带有弯角的矩形边框。将在可绘制文件夹中创建一个名为 customborder.xml 的新文件（在 Eclipse 中，使用“文件”菜单并选择“新建”，然后选择“文件”，在选定的可绘制文件夹中输入文件名，然后单击“完成”）。

输入定义边框形状的 XML：

<?xml version="1.0" encoding="UTF-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <corners android:radius="20dp"/>
    <padding android:left="10dp" android:right="10dp" android:top="10dp" android:bottom="10dp"/>
    <solid android:color="#CCCCCC"/>
</shape>

属性 android:shape 设置为矩形（形状文件还支持椭圆形、直线和环形）。矩形是默认值，因此如果定义的是矩形，则可以省略此属性。请参阅有关形状的 Android 文档 http://developer.android .com/guide/topics/resources/drawable-resource.html#Shape 了解有关形状文件的详细信息。

元素角将矩形角设置为圆角。可以在每个角上设置不同的半径（请参阅 Android 参考）。

padding 属性用于移动应用形状的视图的内容，以防止内容与形状重叠。
边界。

这里的边框颜色设置为浅灰色（CCCCCC 十六进制 RGB 值）。

形状也支持渐变，但这里没有使用渐变。再次，请参阅 Android 资源以了解渐变是如何定义的。使用 android:background="@drawable/customborder" 将形状应用于布局。

在布局中可以照常添加其他视图。在此示例中，添加了单个 TextView，文本为白色（FFFFFF 十六进制 RGB）。背景设置为蓝色，加上一些透明度以降低亮度（A00000FF 十六进制 alpha RGB 值）。最后，通过将布局放置到具有少量填充的另一个布局中，使布局从屏幕边缘偏移。完整的布局文件如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
              android:padding="5dp">
    <LinearLayout android:orientation="vertical"
                  android:layout_width="fill_parent"
                  android:layout_height="fill_parent"
                  android:background="@drawable/customborder">
        <TextView android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:text="Text View"
                android:textSize="20dp"
                android:textColor="#FFFFFF"
                android:gravity="center_horizontal"
                android:background="#A00000FF" />
    </LinearLayout>
</LinearLayout>

Answer 13

我有一个方法，非常简单，我想分享给大家。

当我想要对 TextView 进行平方时，我只需将它们放入 LinearLayout 中即可。我设置了 LinearLayout 的背景颜色，并为 TextView 添加了边距。结果就像平方 TextView 一样。

Answer 14

您可以为文本视图创建自定义背景。
步骤

1. 转到您的项目。
2. 转到资源并右键单击可绘制。
3. 点击新建->可绘制资源文件
4. 为您的文件命名将
5. 以下代码粘贴到文件中

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:width="1dp"
        android:color="@color/colorBlack" />
    <padding
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp"
        android:top="1dp" />
    <corners android:radius="6dp" />
    <solid android:color="#ffffffff" />
</shape>

6. 对于您想要将其用作背景的文本视图，

   android:background="@drawable/your_fileName"

Answer 15

更改 Konstantin Burov 答案，因为在我的情况下不起作用：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white" />
            <stroke android:width="2dip" android:color="#4fa5d5"/>
            <corners android:radius="7dp"/>
        </shape>
    </item>
</selector>

compileSdkVersion 26 (Android 8.0)，
minSdkVersion 21（Android 5.0），
targetSdkVersion 26,
实现 'com.android.support:appcompat-v7:26.1.0',
等级：4.1

Answer 16

这是我的“简单”辅助类，它返回带边框的 ImageView。只需将其放入您的 utils 文件夹中，然后像这样调用它：

ImageView selectionBorder = BorderDrawer.generateBorderImageView(context, borderWidth, borderHeight, thickness, Color.Blue);

这是代码。

/**
 * Because creating a border is Rocket Science in Android.
 */
public class BorderDrawer
{
    public static ImageView generateBorderImageView(Context context, int borderWidth, int borderHeight, int borderThickness, int color)
    {
        ImageView mask = new ImageView(context);

        // Create the square to serve as the mask
        Bitmap squareMask = Bitmap.createBitmap(borderWidth - (borderThickness*2), borderHeight - (borderThickness*2), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(squareMask);

        Paint paint = new Paint();
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(color);
        canvas.drawRect(0.0f, 0.0f, (float)borderWidth, (float)borderHeight, paint);

        // Create the darkness bitmap
        Bitmap solidColor = Bitmap.createBitmap(borderWidth, borderHeight, Bitmap.Config.ARGB_8888);
        canvas = new Canvas(solidColor);

        paint.setStyle(Paint.Style.FILL);
        paint.setColor(color);
        canvas.drawRect(0.0f, 0.0f, borderWidth, borderHeight, paint);

        // Create the masked version of the darknessView
        Bitmap borderBitmap = Bitmap.createBitmap(borderWidth, borderHeight, Bitmap.Config.ARGB_8888);
        canvas = new Canvas(borderBitmap);

        Paint clearPaint = new Paint();
        clearPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

        canvas.drawBitmap(solidColor, 0, 0, null);
        canvas.drawBitmap(squareMask, borderThickness, borderThickness, clearPaint);

        clearPaint.setXfermode(null);

        ImageView borderView = new ImageView(context);
        borderView.setImageBitmap(borderBitmap);

        return borderView;
    }
}

Answer 17

有很多方法可以向 textView 添加边框。最简单的方法是创建一个自定义可绘制对象并将其设置为 textView 的 android:background="@drawable/textview_bg"。

textview_bg.xml 将位于 Drawables 下，可以是这样的。
您可以使用实心或渐变背景（如果不需要，则什么都没有），角来添加角半径和描边< /code> 添加边框。

textview_bg.xml

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

        <corners
            android:radius="@dimen/dp_10"/>

        <gradient
            android:angle="225"
            android:endColor="#FFFFFF"
            android:startColor="#E0E0E0" />

        <stroke
            android:width="2dp"
            android:color="#000000"/>

    </shape>

Answer 18

这可能对你有帮助。

<RelativeLayout
    android:id="@+id/textbox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:background="@android:color/darker_gray" >

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_margin="3dp"
        android:background="@android:color/white"
        android:gravity="center"
        android:text="@string/app_name"
        android:textSize="20dp" />

</RelativeLayout

Answer 19

创建一个边框视图，其背景颜色为边框颜色，文本视图大小为文本视图。将边框视图填充设置为边框的宽度。将文本视图背景颜色设置为文本视图所需的颜色。现在将文本视图添加到边框视图内。

Answer 20

试试这个：

<shape>
    <solid android:color="@color/txt_white"/>
    <stroke android:width="1dip" android:color="@color/border_black"/>
</shape>

Answer 21

  <View
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="@android:color/black" />

这段代码足够你可以放在任何你想要的地方

Answer 22

在您的 xml 文本视图上设置背景，

将 rounded_textview.xml 文件添加到您的可绘制目录中。

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
   <solid android:color="@android:color/white" />
   <stroke android:width="2dip" android:color="#4f5g52"/>
</shape>

在textView背景中设置可绘制文件。

Answer 23

其实很简单。如果您想要在 Textview 后面有一个简单的黑色矩形，只需在 TextView 标记内添加 android:background="@android:color/black" 即可。像这样：

<TextView
    android:textSize="15pt" android:textColor="#ffa7ff04"
    android:layout_alignBottom="@+id/webView1"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:background="@android:color/black"/>