GalleryView en Android con ejemplo

En Android, la Galería es una vista que puede mostrar elementos en una lista de desplazamiento horizontal bloqueada en el centro y, por lo tanto, el usuario puede seleccionar una vista, y luego la vista seleccionada por el usuario se mostrará en el centro de la lista Horizontal. Se puede agregar un número «N» de artículos usando el adaptador. El adaptador es un componente de puente entre el componente de la interfaz de usuario y la fuente de datos (puede ser una array de elementos definidos en código Java o desde una base de datos). Los elementos proporcionados en el adaptador se mostrarán en la galería del ejemplo.

Punto importante: la clase de galería quedó obsoleta en el nivel 16 de la API. En su lugar, están disponibles otros widgets de desplazamiento horizontal como HorizontalScrollView y ViewPager de la biblioteca de soporte.

Manera de definir una etiqueta de Galería

XML

<!-- By using android:spacing we can give spacing between images
     android:animationDuration="3000" -> for animation running -->
<Gallery
  android:id="@+id/languagesGallery"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginTop="100dp"
  android:unselectedAlpha="50"
  android:spacing="5dp"
  android:animationDuration="2000"
  android:padding="10dp" />

Métodos importantes de G alleryView en android

Métodos

Descripción

setAnimationDuration(int)

Para establecer la duración de la ejecución de una animación de transición 

(en milisegundos) siempre que haya un cambio en el diseño. 

Esto se puede configurar en xml también a través de android:animationDuration=”3000″

establecer espacio(int)

Para establecer el espacio entre los elementos de una galería. Esto se puede configurar en xml 

también vía android:spacing=”5dp”

setUnselectedAlpha(float)

Para establecer el alfa en los elementos que no están seleccionados. Esto se puede configurar en xml

también vía android:unselectedAlpha=”0.25″

Veamos la implementación de métodos importantes:

Java

// get the reference of Gallery first
Gallery simpleGallery = (Gallery) findViewById(R.id.languagesGallery);
 
// set 3000 milliseconds for animation duration between each items of Gallery
// xml equivalent -> android:animationDuration="2000"
simpleGallery.setAnimationDuration(2000);
 
// set space between the items of Gallery
// xml equivalent -> android:spacing="15dp"
simpleGallery.setSpacing(15);
 
// set 0.25 value for the alpha of unselected items of Gallery
// xml equivalent -> android:unselectedAlpha="0.25"
simpleGallery.setUnselectedAlpha(0.25f);

Atributos de GalleryView

Atributos

Descripción

identificación Para identificar de forma única una galería
relleno Para configurar el relleno desde el lado izquierdo, derecho, superior o inferior de una Galería.
relleno derecho Para establecer el relleno desde el lado derecho de una Galería.
paddingLeft Para establecer el relleno desde el lado izquierdo de una Galería.
acolchado superior Para configurar el relleno desde la parte superior de una Galería.
fondo acolchado Para establecer el relleno desde la parte inferior de una Galería.
relleno Para establecer el relleno de todos los lados de una Galería.
antecedentes

Para establecer el fondo de una galería. Para el fondo, podemos

establecer colores (usando colors.xml) o imágenes que se guardan en la carpeta dibujable

A través del código Java también, podemos establecer el color de fondo de la siguiente manera

simpleGallery.setBackgroundColor(Color.GFGGreencolor); // establecer el color deseado

duración de la animación

Para establecer la duración de la ejecución de una animación de transición (en milisegundos)

a través de Java, 

simpleGallery.setAnimationDuration(<No de milisegundos>); 

espaciado

Para establecer el espacio entre los elementos de una galería. 

a través de Java,

simpleGallery.setSpacing(10); // Podemos establecer el espacio entre los elementos según nuestro requisito

no seleccionadoAlfa

Para establecer el alfa en los elementos que no están seleccionados.

a través de Java,

simpleGallery.setUnselectedAlpha(0.25f)

Ejemplo

qué artículo. 

GalleryView in Android Sample GIF

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: trabajar con el archivo activity_main.xml

Vaya al archivo activity_main.xml y consulte el siguiente código. A continuación se muestra el código para el archivo activity_main.xml .

XML

<LinearLayout
    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"
    android:background="#fff"
    android:orientation="vertical"
    tools:context=".MainActivity">
 
    <!-- create a ImageView and Gallery -->
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="fill_parent"
        android:layout_height="200dp"
        android:scaleType="fitXY" />
     
    <!-- By using android:spacing we can give spacing between images
         android:animationDuration="3000" -> for animation running -->
    <Gallery
        android:id="@+id/languagesGallery"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        android:animationDuration="2000"
        android:padding="10dp"
        android:spacing="5dp"
        android:unselectedAlpha="50" />
 
</LinearLayout>

Paso 3: 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.AdapterView;
import android.widget.Gallery;
import android.widget.ImageView;
import androidx.appcompat.app.AppCompatActivity;
 
public class MainActivity extends AppCompatActivity {
 
    Gallery simpleGallery;
 
    // CustomizedGalleryAdapter is a java class which extends BaseAdapter
    // and implement the override methods.
    CustomizedGalleryAdapter customGalleryAdapter;
    ImageView selectedImageView;
 
    // To show the selected language, we need this
    // array of images, here taken 10 different kind of most popular programming languages
    int[] images = {R.drawable.python, R.drawable.javascript, R.drawable.java, R.drawable.python, R.drawable.r,
            R.drawable.python, R.drawable.javascript, R.drawable.python, R.drawable.r, R.drawable.javascript};
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        // Our layout is activity_main
        // get the reference of Gallery. As we are showing languages it is named as languagesGallery
        // meaningful names will be good for easier understanding
        simpleGallery = (Gallery) findViewById(R.id.languagesGallery);
 
        // get the reference of ImageView
        selectedImageView = (ImageView) findViewById(R.id.imageView);
 
        // initialize the adapter
        customGalleryAdapter = new CustomizedGalleryAdapter(getApplicationContext(), images);
 
        // set the adapter for gallery
        simpleGallery.setAdapter(customGalleryAdapter);
 
        // Let us do item click of gallery and image can be identified by its position
        simpleGallery.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                // Whichever image is clicked, that is set in the  selectedImageView
                // position will indicate the location of image
                selectedImageView.setImageResource(images[position]);
            }
        });
    }
}

Paso 4: Cree una nueva clase CustomGalleryAdapter.java 

Esto puede estar en la misma ubicación que MainActivity.java para una referencia más fácil. En este paso, creamos un CustomGalleryAdapter y se extiende desde BaseAdapter e implementa los métodos anulados. Dentro del código, se crea un ImageView en tiempo de ejecución en el método getView y finalmente se configura la imagen en ImageView.

Java

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;
 
public class CustomizedGalleryAdapter extends BaseAdapter {
 
    private Context context;
    private int[] images;
 
    public CustomizedGalleryAdapter(Context c, int[] images) {
        context = c;
        this.images = images;
    }
 
    // returns the number of images, in our example it is 10
    public int getCount() {
        return images.length;
    }
 
    // returns the Item  of an item, i.e. for our example we can get the image
    public Object getItem(int position) {
        return position;
    }
 
    // returns the ID of an item
    public long getItemId(int position) {
        return position;
    }
 
    // returns an ImageView view
    public View getView(int position, View convertView, ViewGroup parent) {
        // position argument will indicate the location of image
        // create a ImageView programmatically
        ImageView imageView = new ImageView(context);
 
        // set image in ImageView
        imageView.setImageResource(images[position]);
 
        // set ImageView param
        imageView.setLayoutParams(new Gallery.LayoutParams(200, 200));
        return imageView;
    }
}

Producción

Al ejecutar el código de Android en el estudio de Android, podemos obtener el resultado como se muestra en el video adjunto. Esta es una función útil que se utiliza en muchas aplicaciones de Android. Necesitamos considerar los puntos importantes mencionados anteriormente. es decir, los widgets de desplazamiento horizontal son HorizontalScrollView y ViewPager de la biblioteca de soporte están disponibles y, por lo tanto, los prefieren para los últimos dispositivos.

Publicación traducida automáticamente

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