在安卓中如何给EditText添加边框

23

你好,我想在安卓应用程序中添加一个像上面图片中那样的文本框。我使用了edittext控件,但是无法显示边框。


5个回答

60
在drawable文件夹中创建一个名为edit_text_border.xml的新xml文件,或者按照您的选择命名。然后添加以下代码:
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid
        android:color="@android:color/transparent"/>

    <corners
        android:bottomRightRadius="12dp"
        android:bottomLeftRadius="12dp"
        android:topLeftRadius="12dp"
        android:topRightRadius="12dp"/>
    <stroke
        android:color="#ffffff"
        android:width="1dp"/>
</shape>
你可以调整描边的颜色和半径值以满足您的需求。最后,在您的edittext中像下面这样设置它的背景。
<EditText
    android:id="@+id/edit_text"
    android:background="@drawable/edit_text_border"/>

5
@android:color/transparent - user5959404

16

现在,正确的做法是使用具有相应样式的TextInputLayout
它不仅会绘制一个轮廓背景,而且还会保留漂亮的提示动画。

<com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginEnd="16dp"
        android:hint="@string/some_hint"
        app:boxCornerRadiusBottomEnd="5dp"
        app:boxCornerRadiusBottomStart="5dp"
        app:boxCornerRadiusTopEnd="5dp"
        app:boxCornerRadiusTopStart="5dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/editText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:maxLines="1"
            tools:ignore="KeyboardInaccessibleWidget" />

    </com.google.android.material.textfield.TextInputLayout>

如果您想更改行的颜色-这有点棘手:

创建一个样式:

<style name="Til" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
      <item name="boxStrokeColor">@color/text_input_box_stroke</item>
</style>

颜色 res/color/text_input_box_stroke.xml 的取值为:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--    TODO play with these around -->
    <item android:color="#0cc" android:state_focused="true"/>
    <item android:color="#fcc" android:state_hovered="true"/>
    <item android:color="#f0f"/>
</selector>

将新款式应用于TextInputLayout,如style="@style/Til"

别忘了在app/build.gradle中添加依赖项:

implementation "com.google.android.material:material:1.1.0-alpha09"

3

请尝试以下代码:

  1. Create shape.xml file in drawable folder and write following code in it:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android">
    
    <!-- Background Color -->
    <solid android:color="#ffffff" />
    
    <!-- Border Color -->
    <stroke android:width="1dp" android:color="#ff9900" />
    
    <!-- Round Corners -->
    <corners android:radius="5dp" />
    </shape>
    
    1. Now inside your EditText use this xml by adding android:background="@drawable/shape"

1
在drawable中创建XML文件 shape_border_and_background_login.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle"
    >
    <corners android:radius="25dip" />
    <solid android:color="#55ffffff">

    </solid>
    <stroke
        android:width="2dp"
        android:color="@color/white" />
</shape>

将形状文件添加到EditText的背景中:
 <EditText
                      android:id="@+id/edt_email"
                      android:layout_width="0dp"
                      android:layout_height="wrap_content"
                      android:layout_weight="10"
                    android:background="@drawable/shape_border_and_background_login"
                      android:inputType="textPersonName"
                      android:padding="@dimen/size15"
                      android:textSize="@dimen/size17"
                     />

0

你可以用多种方式来实现这个。

你可以在xml中创建一个drawable(一个带有圆角和边框的形状项的选择器drawable)- 类似问题(和示例代码)

或者你可以创建一个9-patch图像并直接使用它。(文档和示例


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接