¿Cómo pongo un borde alrededor de una vista de texto de Android?

¿Es posible dibujar un borde alrededor de una vista de texto?

Puede establecer una forma dibujable (un rectángulo) como fondo para la vista.

 

Y rectángulo drawable.xml (poner en la carpeta res / drawable):

     

Puede usar @android:color/transparent para que el color sólido tenga un fondo transparente. También puede usar el relleno para separar el texto del borde. para obtener más información, consulte: http://developer.android.com/guide/topics/resources/drawable-resource.html

Permítanme resumir algunos métodos diferentes (no programáticos).

Usando una forma dibujable

Guarde lo siguiente como un archivo XML en su carpeta dibujable (por ejemplo, my_border.xml):

             

Entonces simplemente configúrelo como fondo de su TextView:

  

Más ayuda:

  • Forma Drawable (documentos de Android)
  • Consejos y trucos para desarrolladores de Android: XML Drawables (Parte I)

Usando un parche de 9

Un parche de 9 es una imagen de fondo estirable. Si crea una imagen con un borde, le dará a su TextView un borde. Todo lo que necesita hacer es crear la imagen y luego establecerla en segundo plano en su TextView.

  

Aquí hay algunos enlaces que mostrarán cómo hacer una imagen de 9 parches:

  • Dibuja el parche 9
  • Generador simple de nueve parches
  • Una guía simple para 9 parches para la interfaz de usuario de Android
  • Creación y uso de imágenes de 9 parches en Android

¿Qué pasa si solo quiero el borde superior?

Usando una lista de capas

Puede usar una lista de capas para astackr dos rectangularjs uno encima del otro. Al hacer que el segundo rectángulo sea un poco más pequeño que el primer rectángulo, puede hacer un efecto de borde. El primer rectángulo (inferior) es el color del borde y el segundo rectángulo es el color de fondo.

                

Configuración android:top="2dp" desplaza la parte superior (la hace más pequeña) por 2dp. Esto permite que el primer rectángulo (inferior) se muestre, dando un efecto de borde. Puede aplicar esto al fondo de TextView de la misma forma que se hizo anteriormente.

Aquí hay algunos enlaces más sobre listas de capas:

  • Comprender la de Android
  • ¿Cómo hacer que el borde inferior en el selector de XML de forma dibujable?
  • ¿Crear bordes en una vista de Android en xml dibujable, en 3 lados?

Usando un parche de 9

Puede hacer una imagen de 9 parches con un solo borde. Todo lo demás es lo mismo que se discutió anteriormente.

Usando una vista

Esto es un truco, pero funciona bien si necesita agregar un separador entre dos vistas o un borde a un solo TextView.

       

Aquí hay algunos más enlaces:

  • Cómo dibujar una línea en Android
  • Cómo poner una línea de divisor horizontal entre los textos de edición en una actividad
  • ¿Cómo agregar una línea horizontal de 1px encima de la vista de la imagen en una disposición relativa?

La forma simple es agregar una vista para su TextView. Ejemplo para la línea del borde inferior:

     

Para los bordes de la otra dirección, ajuste la ubicación de la vista del separador.

He resuelto este problema extendiendo la vista de texto y dibujando un borde de forma manual. Incluso agregué para que pueda seleccionar si un borde está punteado o discontinuo.

 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; } } 

Y la clase de borde:

 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; } } 

Espero que esto ayude a alguien 🙂

Solo estaba viendo una respuesta similar: se puede hacer con un trazo y la siguiente anulación:

 @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); } 

Encontré una mejor manera de poner un borde alrededor de un TextView.

Use una imagen de nueve parches para el fondo. Es bastante simple, el SDK viene con una herramienta para hacer la imagen de 9 parches, y no implica absolutamente ninguna encoding.

El enlace es http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch .

Puede establecer el borde por dos métodos. Uno es dibujable y el segundo es programático.

Usando Drawable

       

Programático


 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; } 

Consulte el siguiente enlace para hacer esquinas redondeadas http://androidcookbook.com/Recipe.seam?recipeId=2318

La carpeta dibujable, bajo res, en un proyecto de Android no está restringida a bitmaps (archivos PNG o JPG), sino que también puede contener formas definidas en archivos XML.

Estas formas pueden ser reutilizadas en el proyecto. Una forma se puede usar para poner un borde alrededor de un diseño. Este ejemplo muestra un borde rectangular con esquinas curvas. Se crea un nuevo archivo llamado customborder.xml en la carpeta dibujable (en Eclipse use el menú Archivo y seleccione Nuevo luego Archivo, con la carpeta dibujable seleccionada escriba en el nombre del archivo y haga clic en Finalizar).

Se ingresa el XML que define la forma del borde:

       

El atributo android:shape se establece en rectángulo (los archivos shape también admiten oval, línea y anillo). Rectángulo es el valor predeterminado, por lo que este atributo podría omitirse si se trata de un rectángulo definido. Consulte la documentación de Android sobre formas en http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape para obtener información detallada sobre un archivo de formas.

Las esquinas del elemento configuran las esquinas del rectángulo para que sean redondeadas. Es posible establecer un radio diferente en cada esquina (ver la referencia de Android).

Los atributos de relleno se utilizan para mover el contenido de la Vista a la que se aplica la forma, para evitar que el contenido se solape con el borde.

El color del borde aquí se establece en un gris claro (valor RGB hexadecimal).

Las formas también admiten degradados, pero eso no se está utilizando aquí. Nuevamente, vea los recursos de Android para ver cómo se define un degradado. La forma se aplica a laypout usando android:background="@drawable/customborder" .

Dentro del diseño, se pueden agregar otras vistas de forma normal. En este ejemplo, se ha agregado un solo TextView y el texto es blanco (FFFFFF hexadecimal RGB). El fondo se establece en azul, más cierta transparencia para reducir el brillo (A00000FF valor hexadecimal alfa RGB). Finalmente, el diseño se compensa con el borde de la pantalla colocándolo en otro diseño con una pequeña cantidad de relleno. El archivo de diseño completo es así:

       

Puede agregar algo como esto en su código:

     

Tengo una forma de hacerlo muy simple, y me gustaría compartirlo.

Cuando quiero unir mi TextViews, simplemente los pongo en LinearLayout. Establecí el color de fondo de LinearLayout y agregué un relleno a mi TextView. El resultado es exactamente como si cuadraras la vista de texto.

La solución más simple que he encontrado (y que realmente funciona):

  

Aquí está mi clase de ayuda ‘simple’ que devuelve un ImageView con el borde. Simplemente colócalo en tu carpeta de utilidades y llámalo así:

 ImageView selectionBorder = BorderDrawer.generateBorderImageView(context, borderWidth, borderHeight, thickness, Color.Blue); 

Aquí está el código.

 /** * 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; } } 

Esto puede ayudarte.

    

Cree una vista de borde con el color de fondo como el color del borde y el tamaño de su vista de texto. establece el relleno de la vista de borde como el ancho del borde. Establezca el color de fondo de vista de texto como el color que desea para la vista de texto. Ahora agregue su vista de texto dentro de la vista de borde.

Cambiando la respuesta de Konstantin Burov porque no funciona en mi caso:

           

compileSdkVersion 26 (Android 8.0), minSdkVersion 21 (Android 5.0), targetSdkVersion 26, implementación ‘com.android.support:appcompat-v7:26.1.0’, gradle: 4.1

En realidad, es muy simple. Si desea un rectángulo negro simple detrás de Textview, simplemente agregue android:background="@android:color/black" dentro de las tags TextView. Me gusta esto: