Apakah mungkin menggambar batas di sekitar tampilan teks?
Apakah mungkin menggambar batas di sekitar tampilan teks?
Jawaban:
Anda dapat mengatur bentuk yang dapat digambar (persegi panjang) sebagai latar belakang tampilan.
<TextView android:text="Some text" android:background="@drawable/back"/>
Dan rect. drawable back.xml (dimasukkan ke dalam folder 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>
Anda dapat menggunakan @android:color/transparent
warna solid untuk memiliki latar belakang transparan. Anda juga dapat menggunakan padding untuk memisahkan teks dari perbatasan. untuk informasi lebih lanjut, lihat: http://developer.android.com/guide/topics/resources/drawable-resource.html
Biarkan saya merangkum beberapa metode (non-programatik) yang berbeda.
Simpan yang berikut ini sebagai file XML di folder yang dapat digambar (misalnya, 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>
Kemudian atur saja sebagai latar belakang untuk TextView Anda:
<TextView
android:id="@+id/textview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/my_border" />
Lebih banyak bantuan:
9-patch adalah gambar latar yang dapat diregangkan. Jika Anda membuat gambar dengan perbatasan maka itu akan memberi TextView Anda perbatasan. Yang perlu Anda lakukan adalah membuat gambar dan kemudian mengaturnya ke latar belakang di TextView Anda.
<TextView
android:id="@+id/textview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/my_ninepatch_image" />
Berikut adalah beberapa tautan yang akan menunjukkan cara membuat gambar 9-patch:
Menggunakan daftar layer
Anda dapat menggunakan daftar lapisan untuk menumpuk dua persegi panjang di atas satu sama lain. Dengan membuat persegi panjang kedua hanya sedikit lebih kecil dari persegi panjang pertama, Anda dapat membuat efek perbatasan. Kotak pertama (bawah) adalah warna batas dan kotak kedua adalah warna latar belakang.
<?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>
Pengaturan android:top="2dp"
mengimbangi bagian atas (membuatnya lebih kecil) dengan 2dp. Ini memungkinkan kotak (bawah) pertama terlihat, memberikan efek batas. Anda bisa menerapkan ini pada latar belakang TextView dengan cara yang sama seperti shape
drawable dilakukan di atas.
Berikut ini beberapa tautan tentang daftar lapisan:
Menggunakan 9-patch
Anda bisa membuat gambar 9-patch dengan satu perbatasan. Yang lainnya sama dengan yang dibahas di atas.
Menggunakan Tampilan
Ini semacam trik tetapi berfungsi baik jika Anda perlu menambahkan pemisah antara dua tampilan atau perbatasan ke satu 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>
Berikut beberapa tautan:
border: 1px solid #999;
tidak seharusnya serumit ini .
Cara sederhana adalah menambahkan tampilan untuk TextView Anda. Contoh untuk garis batas bawah:
<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>
Untuk batas arah lainnya, harap sesuaikan lokasi tampilan pemisah.
Saya telah memecahkan masalah ini dengan memperluas tampilan teks dan menggambar perbatasan secara manual. Saya bahkan menambahkan sehingga Anda dapat memilih apakah perbatasan putus-putus atau putus-putus.
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;
}
}
Dan kelas perbatasan:
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;
}
}
Semoga ini bisa membantu seseorang :)
Saya hanya melihat jawaban yang serupa - itu dapat dilakukan dengan Stroke dan penggantian berikut:
@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);
}
Anda dapat mengatur perbatasan dengan dua metode. Satu dengan drawable dan yang kedua adalah terprogram.
<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>
Terprogram
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;
}
Solusi paling sederhana yang saya temukan (dan yang benar-benar berfungsi):
<TextView
...
android:background="@android:drawable/editbox_background" />
Saya menemukan cara yang lebih baik untuk meletakkan perbatasan di sekitar TextView.
Gunakan gambar sembilan-tambalan untuk latar belakang. Ini cukup sederhana, SDK dilengkapi dengan alat untuk membuat gambar 9-patch, dan sama sekali tidak melibatkan pengodean.
Tautannya adalah http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch .
Anda dapat menambahkan sesuatu seperti ini dalam kode Anda:
<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>
Periksa tautan di bawah ini untuk membuat sudut membulat http://androidcookbook.com/Recipe.seam?recipeId=2318
Folder yang dapat digambar, dalam resolusi, dalam proyek Android tidak terbatas pada bitmap (file PNG atau JPG), tetapi juga dapat menyimpan bentuk yang ditentukan dalam file XML.
Bentuk-bentuk ini kemudian dapat digunakan kembali dalam proyek. Bentuk dapat digunakan untuk meletakkan batas di sekitar tata letak. Contoh ini menunjukkan perbatasan persegi panjang dengan sudut melengkung. File baru bernama customborder.xml dibuat di folder drawable (di Eclipse gunakan menu File dan pilih New then File, dengan folder drawable pilih jenis dalam nama file dan klik Finish).
XML yang mendefinisikan bentuk batas dimasukkan:
<?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>
Atribut android:shape
diatur ke kotak (bentuk file juga mendukung oval, garis, dan dering). Rectangle adalah nilai default, jadi atribut ini bisa ditinggalkan jika itu adalah rectangle yang didefinisikan. Lihat dokumentasi Android tentang bentuk di http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape untuk informasi terperinci tentang file bentuk.
Sudut elemen menetapkan sudut persegi panjang untuk dibulatkan. Dimungkinkan untuk mengatur radius yang berbeda di setiap sudut (lihat referensi Android).
Atribut padding digunakan untuk memindahkan konten View ke mana bentuk diterapkan, untuk mencegah konten tumpang tindih perbatasan.
Warna tepi di sini diatur ke abu-abu terang (nilai RGB heksadesimal).
Bentuk juga mendukung gradien, tetapi itu tidak digunakan di sini. Sekali lagi, lihat sumber daya Android untuk melihat bagaimana gradien didefinisikan. Bentuknya diterapkan pada laypout menggunakan android:background="@drawable/customborder"
.
Dalam tata letak, tampilan lain dapat ditambahkan seperti biasa. Dalam contoh ini, satu TextView telah ditambahkan, dan teks berwarna putih (FFFFFF hexadecimal RGB). Latar diatur ke biru, ditambah transparansi untuk mengurangi kecerahan (nilai RGB alpha heksadesimal A00000FF). Akhirnya tata letak diimbangi dari tepi layar dengan menempatkannya ke tata letak lain dengan sedikit bantalan. File tata letak lengkap dengan demikian:
<?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>
Saya memiliki cara untuk melakukannya dengan sangat sederhana, dan saya ingin membagikannya.
Ketika saya ingin mengosongkan mi TextViews, saya hanya meletakkannya di LinearLayout. Saya mengatur warna latar belakang LinearLayout saya, dan saya menambahkan margin ke TextView saya. Hasilnya persis seperti jika Anda mengkuadratkan TextView.
Mengubah jawaban Konstantin Burov karena tidak berfungsi dalam kasus saya:
<?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, implementasi 'com.android.support:appcompat-v7:26.1.0', gradle: 4.1
Anda dapat membuat latar belakang khusus untuk tampilan teks Anda. Langkah 1. Pergi ke proyek Anda. 2. Pergi ke sumber daya dan klik kanan untuk menggambar. 3. Klik New -> Drawable Resource File 4. Beri nama untuk Anda file 5. Tempel kode berikut dalam file
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="1dp" android:color="@color/colorBlack" />
<padding android:left="1dp"
android:top="1dp"
android:right="1dp"
android:bottom="1dp" />
<corners android:radius="6dp" />
<solid android:color="#ffffffff" />
Untuk tampilan teks Anda di mana Anda ingin menggunakannya sebagai backgroud,
android: background = "@ drawable / your_fileName"
Ini adalah kelas pembantu 'sederhana' saya yang mengembalikan ImageView dengan perbatasan. Jatuhkan saja ini di folder utils Anda, dan namai seperti ini:
ImageView selectionBorder = BorderDrawer.generateBorderImageView(context, borderWidth, borderHeight, thickness, Color.Blue);
Ini kodenya.
/**
* 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;
}
}
selectionBorder
?
Ini dapat membantu Anda.
<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
Buat tampilan tepi dengan warna latar belakang sebagai warna tepi dan ukuran tampilan teks Anda. mengatur padding tampilan perbatasan sebagai lebar perbatasan. Atur warna latar belakang tampilan teks sebagai warna yang Anda inginkan untuk tampilan teks. Sekarang tambahkan tampilan teks Anda di dalam tampilan perbatasan.
Coba ini:
<shape>
<solid android:color="@color/txt_white"/>
<stroke android:width="1dip" android:color="@color/border_black"/>
</shape>
Ada banyak cara untuk menambahkan perbatasan ke textView. Yang paling sederhana adalah dengan membuat custom drawable dan mengaturnya android:background="@drawable/textview_bg"
untuk textView Anda.
Textview_bg.xml akan berada di bawah Drawables dan bisa jadi seperti ini. Anda dapat memiliki solid
atau gradient
latar belakang (atau tidak sama sekali jika tidak diperlukan), corners
untuk menambahkan jari-jari sudut dan stroke
menambahkan batas.
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>
setBackground pada tampilan teks xml Anda,
tambahkan file rounded_textview.xml ke direktori yang dapat digambar.
<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>
atur file yang dapat digambar di latar textView.
Sebenarnya sangat sederhana. Jika Anda ingin kotak hitam sederhana di belakang Textview, cukup tambahkan android:background="@android:color/black"
di dalam tag TextView. Seperti ini:
<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"/>