Apakah ada cara untuk membuat EditText
sudut yang membulat?
280
Apakah ada cara untuk membuat EditText
sudut yang membulat?
Ada cara yang lebih mudah daripada yang ditulis oleh CommonsWare. Cukup buat sumber daya yang EditText
dapat digambar yang menentukan cara yang akan diambil:
<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="#FFFFFF"/>
<corners
android:bottomRightRadius="15dp"
android:bottomLeftRadius="15dp"
android:topLeftRadius="15dp"
android:topRightRadius="15dp"/>
</shape>
Lalu, cukup referensi gambar ini di tata letak Anda:
<?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"
>
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dip"
android:background="@drawable/rounded_edittext" />
</LinearLayout>
Anda akan mendapatkan sesuatu seperti:
Berdasarkan komentar Mark, saya ingin menambahkan cara Anda dapat membuat status yang berbeda untuk EditText
:
<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/rounded_edittext_states.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:state_enabled="true"
android:drawable="@drawable/rounded_focused" />
<item
android:state_focused="true"
android:state_enabled="true"
android:drawable="@drawable/rounded_focused" />
<item
android:state_enabled="true"
android:drawable="@drawable/rounded_edittext" />
</selector>
Ini adalah negara bagian:
<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/rounded_edittext_focused.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="#FFFFFF"/>
<stroke android:width="2dp" android:color="#FF0000" />
<corners
android:bottomRightRadius="15dp"
android:bottomLeftRadius="15dp"
android:topLeftRadius="15dp"
android:topRightRadius="15dp"/>
</shape>
Dan ... sekarang, EditText
seharusnya terlihat seperti:
<?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">
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
android:background="@drawable/rounded_edittext_states"
android:padding="5dip"/>
</LinearLayout>
EditText
memiliki latar belakang yang berbeda untuk fokus, dinonaktifkan, ditekan, dan dipilih, selain standar. Berfokus, khususnya, mungkin penting untuk maju jika kita mendapatkan beberapa perangkat Android yang tidak memiliki layar sentuh, seperti Google TV.android:radius
Ini adalah solusi yang sama (dengan beberapa kode bonus tambahan) hanya dalam satu file XML:
Anda kemudian hanya mengatur atribut latar belakang ke file edittext_rounded_corners.xml:
sumber
topRightRadius
dantopLeftRadius
keempat sudut akhirnya bulat. Tolong bantu. :(Coba yang ini,
1.Buat file rounded_edittext.xml di Drawable Anda
2. Terapkan latar belakang untuk EditText Anda dalam file xml
3. Anda akan mendapatkan output seperti ini
sumber
Terima kasih atas jawaban Norfeldt. Saya telah membuat sedikit perubahan pada gradiennya untuk efek bayangan batin yang lebih baik.
Tampak hebat dalam tata letak latar belakang yang ringan ..
sumber
Menurut cara berpikir saya, itu sudah memiliki sudut-sudut bulat.
Jika Anda ingin mereka lebih bulat, Anda perlu:
EditText
latar belakang (ditemukan di SDK Anda)StateListDrawable
sumber daya XML yang menggabungkanEditText
latar belakang tersebut menjadi satuDrawable
, dan memodifikasinya untuk menunjuk ke file PNG sembilan-patch Anda yang lebih bulatStateListDrawable
sebagai latar belakang untukEditText
widget Andasumber
Jika Anda ingin hanya sudut yang melengkung tidak seluruhnya, maka gunakan kode di bawah ini.
Itu hanya akan melengkung empat sudut
EditText
.sumber
Hanya untuk menambah jawaban lain, saya menemukan bahwa solusi paling sederhana untuk mencapai sudut-sudut membulat adalah dengan mengatur yang berikut sebagai latar belakang untuk Edittext Anda.
sumber
Dengan Perpustakaan Komponen Bahan Anda dapat menggunakan
MaterialShapeDrawable
untuk menggambar bentuk kustom .Dengan yang
EditText
dapat Anda lakukan:Kemudian buat
MaterialShapeDrawable
:Itu membutuhkan versi 1.1.0 dari perpustakaan.
sumber