Vista emergente en Android

En este artículo, se agrega PopView en Android. Cuando los usuarios toquen la vista, aparecerá una animación emergente con un efecto de polvo circular. También puede aparecer una nueva vista después de abrir la vista anterior. PopView se puede usar para ocultar la vista o cambiar la vista. Hace que la interfaz de usuario sea más atractiva. Si se va a crear una aplicación de Lanzador , en esa aplicación puede cerrar las aplicaciones usadas recientemente. Esta vista nos ayudará a lograr una mejor experiencia de usuario.

Acercarse:

Paso 1: agregue la biblioteca de soporte en el archivo build.gradle y agregue la dependencia en la sección de dependencias. Permitirá a los desarrolladores usar las funciones incorporadas directamente.

XML

             
dependencies {     
      implementation 'rb.popview:popview:0.1.0'
}          

Paso 2: agregue el siguiente código en el archivo image_view.xml . En este archivo, agregue ImageView al diseño. Este archivo se utiliza para inflar la vista.

image_view.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="0dp"
        android:layout_height="150dp"
        android:layout_weight="1"
        android:src="@drawable/gfg_first" />
</LinearLayout> 

Paso 3: agregue el siguiente código en el archivo activity_main.xml . En este archivo, agregue ImageView al diseño.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:gravity="center">
   
    <ImageView
        android:id="@+id/imageView"
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="150dp"
        app:srcCompat="@drawable/gfg_first" />
   
    <ImageView
        android:layout_weight="1"
        android:id="@+id/changeImage"
        android:layout_width="0dp"
        android:layout_height="150dp"
        app:srcCompat="@drawable/gfg_second"
       />
</LinearLayout>

Paso 4: agregue el siguiente código en el archivo MainActivity.java . En este archivo, agregue OnClickListner a ImageViews, de modo que cada vez que el usuario toque setOnClickListener , se invocará automáticamente. Aquí se elimina una imagen y se reemplaza otra, por lo que image_view.XML se infla para reemplazar la imagen anterior.

MainActivity.java

          
package org.geeksforgeeks.popView          
  
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import rb.popview.PopField;
  
public class MainActivity extends AppCompatActivity {
  
    ImageView popImage, changeImage;
  
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
        // Attach popField to the layout
        final PopField popField = PopField.attach2Window(this);
  
        popImage = findViewById(R.id.imageView);
        changeImage = findViewById(R.id.changeImage);
  
        popImage.setOnClickListener(
                 new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //It will pop the view.
                popField.popView(v);
            }
        });
  
        changeImage.setOnClickListener(
                    new View.OnClickListener() {
            @Override
            public void onClick(View v) {
  
                // It is used to inflate the image_view
                // so that when the gfg_two image will pop
                // gfg_first image will take place of it.
                LayoutInflater layoutInflater = 
                        (LayoutInflater) getApplicationContext()
                        .getSystemService(
                        Context.LAYOUT_INFLATER_SERVICE);
                final View addView = layoutInflater
                                     .inflate(R.layout.image_view
                                     , null);
                ImageView newImageView = addView
                                         .findViewById(R.id.imageView2);
                newImageView.setImageDrawable(
                             getResources()
                            .getDrawable(R.drawable.gfg_first));
                popField.popView(v,addView);
            }
        });
    }
}

Producción:

Referencias:

Publicación traducida automáticamente

Artículo escrito por madhavmaheshwarimm20 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 *