¿Cómo crear CircularDialog en Android?

CircularDialog es otra mejor manera de representar información o datos en una aplicación de Android. Puede ver estos diálogos circulares en la mayoría de las aplicaciones que se utilizan para mostrar el mensaje de finalización del proceso en una forma atractiva. En este artículo, vamos a ver cómo implementar Diálogos circulares en la aplicación de Android. qué

CircularDialog in Android Sample GIF

Aplicación de Diálogos Circulares

  • Se utiliza para representar el mensaje de forma atractiva.
  • Los diálogos circulares son una forma única de representar mensajes en el cuadro de diálogo de alerta.
  • Crear una experiencia de usuario de buena calidad.

Atributos del diálogo circular

Atributos

Descripción

CDConstants.ÉXITO Para mostrar el mensaje de éxito en un diálogo circular.
 .setAnimación Úselo para establecer Establecer animación en Diálogo circular.
.setTextSize Úselo para establecer Establecer tamaño de texto en el cuadro de diálogo circular.
.setDuración Úselo para configurar el tiempo de animación en milisegundos.
 CDConstants.LARGE Úselo para establecer el tamaño del diálogo.

Implementación paso a paso

Paso 1: Crear un nuevo proyecto

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Tenga en cuenta que seleccione Java como lenguaje de programación.

Paso 2: agregue la dependencia y el repositorio de JitPack

Navegue a Gradle Scripts > build.gradle(Module:app) y agregue la siguiente dependencia en la sección de dependencias.   

implementación ‘com.github.hassanusman:CircularDialogs:1.2’

Agregue el repositorio de JitPack a su archivo de compilación. Agréguelo a su root build.gradle al final de los repositorios dentro de la sección allprojects{ }.

todos los proyectos {

 repositorios {

   …

   experto {url «https://jitpack.io»}

     }

}

Después de agregar esta dependencia, sincronice su proyecto y ahora avanzaremos hacia su implementación.  

Paso 3: trabajar con el archivo activity_main.xml

Vaya a la aplicación > res > diseño > actividad_principal.xml y agregue el siguiente código a ese archivo. A continuación se muestra el código para el archivo  activity_main.xml .

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
  
    <!--After clicking button you will
        get circular dialog-->
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="CLICK" />
      
</RelativeLayout>

Paso 4: trabajar con el archivo MainActivity.java

Vaya al archivo MainActivity.java y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.java . Se agregan comentarios dentro del código para comprender el código con más detalle.

Java

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
  
import androidx.appcompat.app.AppCompatActivity;
  
import com.example.circulardialog.CDialog;
import com.example.circulardialog.extras.CDConstants;
  
public class MainActivity extends AppCompatActivity {
  
    // Initialize button
    Button button;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        // Called button by Id
        button = (Button) findViewById(R.id.button);
  
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                  
                // Circular Dialog Box Created
                new CDialog(MainActivity.this).createAlert("Great",
                        CDConstants.SUCCESS,   // Type of dialog
                        CDConstants.LARGE)     // Size of dialog
                        .setAnimation(CDConstants.SLIDE_FROM_BOTTOM_TO_TOP)  // Animation for enter/exit
                        .setDuration(2000)   // in milliseconds
                        .setTextSize(CDConstants.LARGE_TEXT_SIZE)  // CDConstants.LARGE_TEXT_SIZE, 
                                                                   // CDConstants.NORMAL_TEXT_SIZE
                        .show();
            }
        });
    }
}

Ahora haga clic en la opción de ejecución , tomará algún tiempo construir Gradle. Después de eso, obtendrá la salida en su dispositivo como se indica a continuación.

Producción:

Publicación traducida automáticamente

Artículo escrito por chinmaymunje96 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *