[英]How to add border to EditText in android
嗨,我想在 android 应用程序中添加一个文本框,就像上面的图片一样。 我使用了edittext控件,但无法显示边框。
在 drawable 文件夹中创建一个新的 xml 文件edit_text_border.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"/>
如今,正确的方法是使用具有相应样式的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>
其中 color 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"
尝试以下代码:
在 drawable 文件夹中创建 shape.xml 文件并在其中编写以下代码:
<?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>
android:background="@drawable/shape"
使用这个 xml在 drawable shape_border_and_background_login.xml 中创建 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"
/>
您可以通过多种方式做到这一点。
您可以在 xml 中创建可绘制对象(具有圆角和边框的形状项的选择器可绘制对象)- 类似问题(和示例代码)
或者您可以创建一个 9-patch 图像并使用它。 (文档和示例)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.