style studio rounded radius programacion custom corners android android-button rounded-corners

studio - radius to button android



Botón redondeado en Android (9)

Quiero crear botones redondeados en un programa de Android. He mirado ¿Cómo crear EditText con esquinas redondeadas?

Lo que quiero lograr es:

  1. Botones de borde redondeado
  2. Cambiar el fondo / apariencia del botón en diferentes estados (como Onclick, Focus)
  3. Use mi propio PNG para el fondo y no cree una forma.

Cree un recurso Dibujable llamado btnOval -> luego código pasado;

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" android:padding="10dp"> <solid android:color="#6E6E6E"/> </shape>

y el usuario dentro de la etiqueta del botón como,

<Button andorid:width="" android:hieght="" android:background="@Drawable/btnOval" />


Es mucho mejor colocar los estados y las formas de los botones en un archivo selector de xml. Eso debería hacer que tu aplicación funcione más rápido / mejor. Pruebe esto (cortesía de Introducción al desarrollo de aplicaciones para Android). No spam aquí solo mostrando esto no es mi código.

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:state_pressed="true" > <shape android:shape="rectangle" > <corners android:radius="12dip" /> <stroke android:width="1dip" android:color="#333333" /> <gradient android:angle="-90" android:startColor="#333333" android:endColor="#555555" /> </shape> </item> <item android:state_focused="true"> <shape android:shape="rectangle" > <corners android:radius="12dip" /> <stroke android:width="1dip" android:color="#333333" /> <solid android:color="#58857e"/> </shape> </item> <item > <shape android:shape="rectangle" > <corners android:radius="12dip" /> <stroke android:width="1dip" android:color="#333333" /> <gradient android:angle="-90" android:startColor="#333333" android:endColor="#555555" /> </shape> </item> </selector>

Consejo de diseño de PS: los degradados y los rectángulos redondeados se utilizan mejor cuando apenas se puede decir que están allí, y se usan de manera inteligente.


Esto se puede hacer usando el atributo de la esquina. Mira el siguiente XML.

<item> <shape android:shape="rectangle" > <stroke android:height="1.0dip" android:width="1.0dip" android:color="#ffee82ee" /> <solid android:color="#ffee82ee" /> <corners android:bottomLeftRadius="102.0dip" android:bottomRightRadius="102.0dip" android:radius="102.0dip" android:topLeftRadius="102.0dip" android:topRightRadius="102.0dip" /> </shape> </item>


Extienda ImageView manera:

public class RoundedImageView extends ImageView { private static final String TAG = "RoundedImageView"; private float mRadius = 0f; public RoundedImageView(Context context) { super(context); } public RoundedImageView(Context context, AttributeSet attrs) { super(context, attrs); // retrieve styles attributes TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundedView); mRadius = a.getDimension(R.styleable.RoundedView_radius, 0f); a.recycle(); } @Override protected void onDraw(Canvas canvas) { // only do this if we actually have a radius if(mRadius > 0) { RectF rect = new RectF(0, 0, getWidth(), getHeight()); Path clipPath = new Path(); clipPath.addRoundRect(rect, mRadius, mRadius, Path.Direction.CW); canvas.clipPath(clipPath); } super.onDraw(canvas); } }

Y aplique su recurso de fondo normal a él y debe recortarse con esquinas redondeadas.


Los botones redondeados también se pueden crear utilizando la forma de anillo que se puede dibujar, consulte http://www.zoftino.com/android-shape-drawable-examples

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:innerRadius="0dp" android:shape="ring" android:thickness="40dp" android:useLevel="false"> <solid android:color="@color/colorPrimary" /> <padding android:bottom="50dp" android:left="16dp" android:right="16dp" android:top="50dp"/> </shape>


Puede hacer un botón de esquina redondeada sin tener que recurrir a un ImageView.

Un recurso selector de fondo, button_background.xml :

<?xml version="1.0" encoding="utf-8" ?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Non focused states --> <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/button_unfocused" /> <item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/button_unfocused" /> <!-- Focused states --> <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/button_focus" /> <item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/button_focus" /> <!-- Pressed --> <item android:state_pressed="true" android:drawable="@drawable/button_press" /> </selector>

Para cada estado, un recurso dibujable, por ejemplo, button_press.xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <stroke android:width="1dp" android:color="#FF404040" /> <corners android:radius="6dp" /> <gradient android:startColor="#FF6800" android:centerColor="#FF8000" android:endColor="#FF9700" android:angle="90" /> </shape>

Tenga en cuenta el atributo corners , esto le da esquinas redondeadas!

A continuación, establezca el fondo dibujable en el botón:

android:background="@drawable/button_background"

EDITAR (9/2018) : la misma técnica se puede utilizar para crear un botón circular. Un círculo es en realidad solo un botón cuadrado con un radio de tamaño establecido en la mitad del lado del cuadrado

Además, en el ejemplo anterior, el stroke y el gradient no son elementos necesarios, solo son ejemplos y formas en las que podrá ver la forma de la esquina redondeada


Si necesita un botón redondeado en Android, cree un archivo XML "RoundShapeBtn.xml" como dibujable.

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" android:padding="10dp"> <solid android:color="#6E6E6E"/> <!-- this one is ths color of the Rounded Button --> <corners android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" android:topLeftRadius="10dp" android:topRightRadius="10dp"/> </shape>

Agregue esto a su código de botón:

android:background="@drawable/RoundShapeBtn"


crear un archivo xml en una carpeta dibujable en android como:

rounded_button.xml

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <corners android:radius="20dp"/> // if you want clear round shape then make radius size is half of your button`s height. <solid android:color="#EEFFFFFF"/> // Button Colour <padding android:bottom="5dp" android:left="10dp" android:right="10dp" android:top="5dp"/> </shape>

Ahora este archivo xml como fondo de tus botones.

<Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:background="@drawable/rounded_button" android:text="@string/button_text" android:textColor="@color/black"/>


Google recomienda que no imites los elementos de la interfaz de usuario de otras plataformas. No pondría botones de estilo redondeados de iOS en una aplicación de Android.