有没有一种简单的方法可以在 Android 视图的顶部和底部添加边框？

Question

我有一个 TextView，我想沿着其顶部和底部边框添加黑色边框。我尝试添加 android:drawableTop 和 android:drawableBottom 到 TextView，但这只会导致整个视图变黑。

<TextView
    android:background="@android:color/green"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:drawableTop="@android:color/black"
    android:drawableBottom="@android:color/black"
    android:text="la la la" />

有没有一种方法可以轻松地向 Android 中的视图（特别是 TextView）添加顶部和底部边框？

Answer 1

在Android 2.2的，你可以做到以下几点。

创建一个XML可绘制如/res/drawable/textlines.xml和方式指定为一个TextView的背景属性。

<TextView
android:text="My text with lines above and below"
android:background="@drawable/textlines"
/>

/res/drawable/textlines.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
      <shape 
        android:shape="rectangle">
            <stroke android:width="1dp" android:color="#FF000000" />
            <solid android:color="#FFDDDDDD" />

        </shape>
   </item>

   <item android:top="1dp" android:bottom="1dp"> 
      <shape 
        android:shape="rectangle">
            <stroke android:width="1dp" android:color="#FFDDDDDD" />
            <solid android:color="#00000000" />
        </shape>
   </item>

</layer-list>

在一面的情况是，你必须指定一个不透明的背景颜色，透明胶片将无法正常工作。 （至少我认为他们做了，但我错了）。在上面的例子可以看到，纯色第一形状#FFdddddd在第二形状笔划颜色复制的。

Answer 2

以使得边界被显示在容器外我用一招。与此特技仅一条线被绘制背景将被显示的基本视图的

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:bottom="1dp"
        android:left="-2dp"
        android:right="-2dp"
        android:top="-2dp">
        <shape android:shape="rectangle" >
            <stroke
                android:width="1dp"
                android:color="#FF000000" />

            <solid android:color="#00FFFFFF" />

            <padding android:left="10dp"
                android:right="10dp"
                android:top="10dp"
                android:bottom="10dp" />
        </shape>
    </item>

</layer-list>

Answer 3

选项1：形状绘制对象

这是最简单的选择，如果你想围绕一个布局或视图中，你可以设置背景边框。在drawable文件夹中创建一个XML文件看起来是这样的：

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

    <solid android:color="#8fff93" />

    <stroke
        android:width="1px"
        android:color="#000" />

</shape>

您可以删除solid如果你不想填充。在您的布局/视图的集background="@drawable/your_shape_drawable"。

选项2：背景视图

下面是一个小把戏，我在RelativeLayout使用。基本上，你有你想给一个边界视角下的一个黑色的正方形，然后给该视图一些填充（不是保证金！），所以黑色四边形表示通过在边缘处。

显然，这只是正常工作，如果认为没有任何透明区域。如果是这样，我会建议你写一个自定义的BorderView只绘制边界 - 它应该只是一个代码几十行

<View
    android:id="@+id/border"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/image"
    android:layout_alignLeft="@+id/image"
    android:layout_alignRight="@+id/image"
    android:layout_alignTop="@+id/main_image"
    android:background="#000" />

<ImageView
    android:id="@+id/image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_...
    android:padding="1px"
    android:src="@drawable/..." />

如果你想知道，它的确实有adjustViewBounds=true 的工作。但是，如果你想有一个完整的RelativeLayout背景这是行不通的，因为那里是阻止你填充一个RelativeLayout一个View的错误。在这种情况下，我建议Shape绘制。

选项3：9的贴剂

一个最终选择是使用一个9补丁抽拉像这样的：

您可以使用它在这里你可以设置android:background="@drawable/..."任何观点。是的它确实需要6x6的 - 我想5x5的和没有工作

这种方法的缺点是你不能很容易改变颜色，但如果你想花哨的边界（例如，仅在顶部和底部的边界，在这个问题），那么你可能无法做这些与Shape绘制，这是不很厉害。

选项4：额外的观点

我忘了，如果你只是想上方和下方您的看法边界提这个非常简单的选项。你可以把你的观点在垂直LinearLayout（如果没有的话），然后添加上方和下方空Views这样的：

<View android:background="#000" android:layout_width="match_parent" android:layout_height="1px"/>

Answer 4

要在只有底部添加1dp白色边框，并有一个透明背景，你可以用比这里最简单的答案如下。

有关的TextView或其他视图中添加：

android:background="@drawable/borderbottom"

和在drawable目录添加下面的XML，称为borderbottom.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:top="-2dp" android:left="-2dp" android:right="-2dp">
        <shape android:shape="rectangle">
            <stroke android:width="1dp" android:color="#ffffffff" />
            <solid android:color="#00000000" />
        </shape>
    </item>
</layer-list>

如果你想有一个边框顶部，改变android:top="-2dp"到android:bottom="-2dp"

在颜色不需要是白色和背景不需要是透明的任一。

，可以不需要该solid元件。这将取决于你的设计（感谢V. Kalyuzhnyu）。

基本上，此XML将创建使用矩形形状的边界，但再压入顶部，右侧和左侧超越对形状渲染区域。只是这使得底部边框可见。

Answer 5

所以我想做一些稍有不同：在底部只有一个边界，以模拟一个ListView分频器。我修改皮特Delport答案，并得到这个：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
   <item>
      <shape 
        android:shape="rectangle">
            <solid android:color="@color/background_trans_light" />    

        </shape>
   </item>

    <!-- this mess is what we have to do to get a bottom border only. -->
   <item android:top="-2dp"
         android:left="-2dp"
         android:right="-2dp"
         android:bottom="1px"> 
      <shape 
        android:shape="rectangle">    
            <stroke android:width="1dp" android:color="@color/background_trans_mid" />
            <solid android:color="@null" />
        </shape>
   </item>

</layer-list>

注意在使用PX代替DP得到正好1像素分频器（一些电话的DPIs将使1DP线消失）。

Answer 6

目前公认的答案是行不通的。它创建的视图作为抗混叠的结果的左侧和右侧薄垂直边框。

此版本完美。它还允许你独立设置边框的宽度，你也可以在左/右侧，如果你想添加边框。唯一的缺点是，它不是不支持透明度。

创建名为/res/drawable/top_bottom_borders.xml用下面的代码的XML可绘制并将其指定为一个TextView的背景属性。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#DDDD00" /> <!-- border color -->
        </shape>
    </item>

    <item
        android:bottom="1dp" 
        android:top="1dp">   <!-- adjust borders width here -->
        <shape android:shape="rectangle">
            <solid android:color="#FFFFFF" />  <!-- background color -->
        </shape>
    </item>
</layer-list>

<强>通过棉花糖测试Android KitKat上

Answer 7

正如@Nic哈伯德说，有加边框线非常简单的方法。

<View
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="#000000" >
</View>

您可以改变高度和背景颜色，以任何你想要的。

Answer 8

您也可以换一个的FrameLayout视图，然后设置框的背景色和填充到你想要的东西;然而，TextView的，默认情况下有一个“透明”的背景，所以你需要改变的TextView的背景色也。

Answer 9

我的答案是基于@Emile版本，但我用透明色，而不是固体。结果 这个例子将绘制2DP底部边界。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape android:shape="rectangle" >
            <stroke  android:width="2dp"
                     android:color="#50C0E9" />
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item  android:bottom="2dp" >
        <shape android:shape="rectangle" >
            <stroke  android:width="2dp"
                     android:color="@color/bgcolor" />
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
</layer-list>

@颜色/的bgcolor 在至极，你绘制边框视图的背景颜色。

如果你想改变边界变化的位置的一个偏移量：

android:bottom="2dp"
android:top="2dp"
android:right="2dp"
android:left="2dp"

或将它们结合起来以具有2个或更多的边界：

android:bottom="2dp" android:top="2dp"

Answer 10

为什么不只是创建一个背景色1DP高看？然后它可以被容易地放置在要

Answer 11

只是为了我的解决方案添加到列表中..

我想延伸超过原来的形状的半透明底部边界（因此，半透明边框是外父矩形）。

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
  <item>
    <shape android:shape="rectangle" >      
      <solid android:color="#33000000" /> <!-- Border colour -->
    </shape>
  </item>
  <item  android:bottom="2dp" >
    <shape android:shape="rectangle" >     
      <solid android:color="#164586" />
    </shape>
  </item>
</layer-list>

这使我;

Answer 12

首先使用下面所示的内容的XML文件，并将其命名border.xml并将其放置在res目录内的布局文件夹内

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke android:width="1dp" android:color="#0000" />
    <padding android:left="0dp" android:top="1dp" android:right="0dp"
        android:bottom="1dp" />
</shape>

，该代码使用内部

在

TextView tv = (TextView)findElementById(R.id.yourTextView);
tv.setBackgroundResource(R.layout.border);

此将就TextView的顶部和底部的黑线。

Answer 13

要改变这样的：

<TextView
    android:text="My text"
    android:background="@drawable/top_bottom_border"/>

我更喜欢在 “可拉伸/ top_bottom_border.xml” 这种方法：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <gradient
                android:angle="270"
                android:startColor="#000"
                android:centerColor="@android:color/transparent"
                android:centerX="0.01" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient
                android:angle="90"
                android:startColor="#000"
                android:centerColor="@android:color/transparent"
                android:centerX="0.01" />
        </shape>
    </item>
</layer-list>

这不仅使得边框，而不是一个矩形，如果你的背景有颜色出现。

Answer 14

写下下面的代码

<View
    android:layout_width="wrap_content"
    android:layout_height="2dip"
    android:layout_below="@+id/topics_text"
    android:layout_marginTop="7dp"
    android:layout_margin="10dp"
    android:background="#ffffff" />

Answer 15

要添加边框使用的插图的InsetDrawable边界最简单的方法，下面将展示上边框仅为：

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

        <solid android:color="@color/light_gray" />
        <stroke
            android:width=".5dp"
            android:color="@color/dark_gray" />
    </shape>
</inset>

Answer 16

尝试用LinearLayout中包裹的图像，并将其设置的背景，你想要文本周围边框的颜色。然后设置TextView的填充是你想为你的边框厚度。

Answer 17

您也可以使用9路做你的工作。创建它，以便着色像素不乘法的高度，但只有透明像素。

Answer 18

下面是一种方法来实现它。

    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape android:shape="rectangle">
                <stroke
                    android:width="1dp"
                    android:color="@color/grey_coaching_text" />
            </shape>
        </item>

        <item
            android:bottom="1dp"
            android:top="1dp">
            <shape android:shape="rectangle">
                <solid android:color="@color/white" />
            </shape>
        </item>
    </layer-list>

中风和第二个用于固体背景第一项。隐藏的左和右边界。

Answer 19

只要在View

的顶部和底部视图添加

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@color/your_color"
        app:layout_constraintBottom_toTopOf="@+id/textView"
        app:layout_constraintEnd_toEndOf="@+id/textView"
        app:layout_constraintStart_toStartOf="@+id/textView" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:gravity="center"
        android:text="Testing"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@color/your_color"
        app:layout_constraintEnd_toEndOf="@+id/textView"
        app:layout_constraintStart_toStartOf="@+id/textView"
        app:layout_constraintTop_toBottomOf="@+id/textView" />

</android.support.constraint.ConstraintLayout>

Answer 20

// Just simply add border around the image view or view

<ImageView
                android:id="@+id/imageView2"
                android:layout_width="90dp"
                android:layout_height="70dp"
                android:layout_centerVertical="true"
                android:layout_marginRight="10dp"
                android:layout_toLeftOf="@+id/imageView1"
                android:background="@android:color/white"
                android:padding="5dip" />

// After that dynamically put color into your view or image view object

objView.setBackgroundColor(Color.GREEN);

//VinodJ/Abhishek

Answer 21

<shape xmlns:android="http://schemas.android.com/apk/res/android">

<solid android:color="@color/light_grey1" />
<stroke
    android:width="1dip"
    android:color="@color/light_grey1" />

<corners
    android:bottomLeftRadius="0dp"
    android:bottomRightRadius="0dp"
    android:topLeftRadius="5dp"
    android:topRightRadius="5dp" />

    </shape>

Answer 22

<TextView
    android:id="@+id/textView3"
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="#72cdf4"
    android:text=" aa" />

只是要添加边框

添加文本低于此的TextView

Answer 23

只是为了强制执行 @phreakhead 的 和 用户1051892的 答案， <item android:bottom|android:left|android:right|android:top> 如果为负数，则必须大于 <stroke android:width>. 。如果没有，项目的绘画将与笔画的绘画混合，您可能会认为这些值不起作用。