¿Cómo creo un ListView con esquinas redondeadas en Android?

¿Cómo creo un ListView con esquinas redondeadas en Android?

Aquí hay una forma de hacerlo (¡gracias a la documentación de Android!):

Agregue lo siguiente en un archivo (digamos customshape.xml) y luego colóquelo en (res / drawable / customshape.xml)

     

Una vez que haya terminado con la creación de este archivo, simplemente configure el fondo de una de las siguientes maneras:

A través de Code: listView.setBackgroundResource(R.drawable.customshape);

A través de XML , simplemente agregue el siguiente atributo al contenedor (por ejemplo, LinearLayout o a cualquier campo):

 android:background="@drawable/customshape" 

Espero que alguien lo encuentre útil…

Aunque eso funcionó, también eliminó todo el color de fondo. Estaba buscando una manera de hacer solo el borde y simplemente reemplazar ese código de diseño XML con este y ¡estaba listo para empezar!

      

@ kris-van-bael

Para aquellos que tienen problemas con la selección, resalte para la fila superior e inferior donde aparece el rectángulo de fondo en la selección, necesita configurar el selector para su vista de lista en color transparente.

 listView.setSelector(R.color.transparent); 

En color.xml simplemente agregue lo siguiente:

 #00000000 

Las otras respuestas son muy útiles, ¡gracias a los autores!

Pero no pude ver cómo personalizar el rectángulo al resaltar un elemento al seleccionarlo, en lugar de deshabilitar el resaltado @alvins @bharat dojeha.

Lo siguiente me funciona para crear un contenedor de elementos de vista de lista redondeada sin contorno y un gris más claro cuando se selecciona con la misma forma:

Su xml necesita contener un selector como, por ejemplo, (en res / drawable / customshape.xml):

                   

Luego debe implementar un adaptador de lista y anular el método getView para establecer el selector personalizado como fondo

  @Override public View getView(int position, View convertView, ViewGroup parent) { //snip convertView.setBackgroundResource(R.drawable.customshape); //snip } 

y también debe ‘ocultar’ el rectángulo del selector predeterminado, por ejemplo, en onCreate (también oculto mi delgada línea divisoria gris entre los elementos):

 listView.setSelector(android.R.color.transparent); listview.setDivider(null); 

Este enfoque resuelve una solución general para los objetos dibujables, no solo ListViewItem con varios estados de selección.

Actualizar

La solución en estos días es usar un CardView con soporte para esquinas redondeadas integradas.


Respuesta original *

Otra forma que encontré fue enmascarar su diseño dibujando una imagen en la parte superior del diseño. Puede ser que te ayude. Echa un vistazo a las esquinas recortadas redondeadas de Android XML

Otra solución para la selección resalta los problemas con los elementos primero y último de la lista:

Agregue relleno a la parte superior e inferior de su fondo de lista igual o mayor que el radio. Esto garantiza que el resaltado de selección no se superponga con las curvas de la esquina.

Esta es la solución más fácil cuando necesita resaltar la selección no transparente.

         

de hecho, creo que la mejor solución se describe en este enlace:

http://blog.synyx.de/2011/11/android-listview-with-rounded-corners/

en resumen, utiliza un fondo diferente para los elementos superior, medio e inferior, de modo que los superiores e inferiores se redondearían.

Esto fue increíblemente útil para mí. Me gustaría sugerir otra solución para resaltar perfectamente las esquinas redondeadas si está utilizando su propio CustomAdapter .

Definiendo archivos XML

Antes que nada, ve dentro de tu carpeta dibujable y crea 4 formas diferentes:

  • shape_top

       

  • shape_normal

       

  • shape_bottom

       

  • shape_rounded

       

Ahora, cree un diseño de fila diferente para cada forma, es decir, para shape_top :

  • También puede hacer esto programáticamente cambiando el fondo.

       

Y defina un selector para cada lista de formas, es decir, para shape_top :

         

Cambia tu Adaptador Personalizado

Finalmente, defina las opciones de diseño dentro de su CustomAdapter :

 if(position==0) { convertView = mInflater.inflate(R.layout.list_layout_top, null); } else { convertView = mInflater.inflate(R.layout.list_layout_normal, null); } if(position==getCount()-1) { convertView = mInflater.inflate(R.layout.list_layout_bottom, null); } if(getCount()==1) { convertView = mInflater.inflate(R.layout.list_layout_unique, null); } 

¡Y eso está hecho!

para hacer borde u tiene que hacer otro archivo xml con propiedad de sólido y esquinas en la carpeta dibujable y lo llama en segundo plano

Estoy usando una vista personalizada que distribuyo sobre las otras y que solo dibuja las 4 esquinas pequeñas del mismo color que el fondo. Esto funciona independientemente de los contenidos de la vista y no asigna mucha memoria.

 public class RoundedCornersView extends View { private float mRadius; private int mColor = Color.WHITE; private Paint mPaint; private Path mPath; public RoundedCornersView(Context context) { super(context); init(); } public RoundedCornersView(Context context, AttributeSet attrs) { super(context, attrs); init(); TypedArray a = context.getTheme().obtainStyledAttributes( attrs, R.styleable.RoundedCornersView, 0, 0); try { setRadius(a.getDimension(R.styleable.RoundedCornersView_radius, 0)); setColor(a.getColor(R.styleable.RoundedCornersView_cornersColor, Color.WHITE)); } finally { a.recycle(); } } private void init() { setColor(mColor); setRadius(mRadius); } private void setColor(int color) { mColor = color; mPaint = new Paint(); mPaint.setColor(mColor); mPaint.setStyle(Paint.Style.FILL); mPaint.setAntiAlias(true); invalidate(); } private void setRadius(float radius) { mRadius = radius; RectF r = new RectF(0, 0, 2 * mRadius, 2 * mRadius); mPath = new Path(); mPath.moveTo(0,0); mPath.lineTo(0, mRadius); mPath.arcTo(r, 180, 90); mPath.lineTo(0,0); invalidate(); } @Override protected void onDraw(Canvas canvas) { /*Paint paint = new Paint(); paint.setColor(Color.RED); canvas.drawRect(0, 0, mRadius, mRadius, paint);*/ int w = getWidth(); int h = getHeight(); canvas.drawPath(mPath, mPaint); canvas.save(); canvas.translate(w, 0); canvas.rotate(90); canvas.drawPath(mPath, mPaint); canvas.restre(); canvas.save(); canvas.translate(w, h); canvas.rotate(180); canvas.drawPath(mPath, mPaint); canvas.restre(); canvas.translate(0, h); canvas.rotate(270); canvas.drawPath(mPath, mPaint); } }