Control de la galería de Xamarin. AndroidXamarin.Android Gallery control

Gallery es un widget de diseño que se usa para mostrar los elementos en una lista de desplazamiento horizontal y coloca la selección actual en el centro de la vista.Gallery is a layout widget used to display items in a horizontally scrolling list and positions the current selection at the center of the view.

Importante

Este widget quedó en desuso en Android 4,1 (nivel de API 16).This widget was deprecated in Android 4.1 (API level 16).

En este tutorial, creará una galería de fotos y mostrará un mensaje de notificación cada vez que se seleccione un elemento de la galería.In this tutorial, you'll create a gallery of photos and then display a toast message each time a gallery item is selected.

Una vez establecido el diseño de Main.axml para la vista de contenido, el Gallery se captura desde el diseño con FindViewById.After the Main.axml layout is set for the content view, the Gallery is captured from the layout with FindViewById. El AdapterThe Adapter a continuación, se utiliza la propiedad para establecer un adaptador personalizado (ImageAdapter) como el origen de todos los elementos que se van a mostrar en el dallery.property is then used to set a custom adapter ( ImageAdapter) as the source for all items to be displayed in the dallery. El ImageAdapter se crea en el paso siguiente.The ImageAdapter is created in the next step.

Para hacer algo cuando se hace clic en un elemento de la galería, se suscribe un delegado anónimo a la ItemClickTo do something when an item in the gallery is clicked, an anonymous delegate is subscribed to the ItemClick .event. Muestra un ToastIt shows a Toast que muestra la posición de índice (basada en cero) del elemento seleccionado (en un escenario real, la posición se podría usar para obtener la imagen de tamaño completo para otra tarea).that displays the index position (zero-based) of theselected item (in a real world scenario, the position could be used to get the full sized image for some other task).

En primer lugar, hay algunas variables de miembro, incluida una matriz de identificadores que hacen referencia a las imágenes guardadas en el directorio de recursos Dibujables (Resources/drawable).First, there are a few member variables, including an array of IDs that reference the images saved in the drawable resources directory (Resources/drawable).

A continuación se encuentra el constructor de clase, donde el ContextNext is the class constructor, where the Context para una instancia de ImageAdapter se define y se guarda en un campo local.for an ImageAdapter instance is defined and saved to a local field. A continuación, se implementan algunos métodos necesarios heredados de BaseAdapter.Next, this implements some required methods inherited from BaseAdapter. El constructor y el CountThe constructor and the Count la propiedad se explica por sí misma.property are self-explanatory. Normalmente, GetItem(int)Normally, GetItem(int) debe devolver el objeto real situado en la posición especificada en el adaptador, pero se omite en este ejemplo.should return the actual object at the specified position in the adapter, but it's ignored for this example. Del mismo modo, GetItemId(int)Likewise, GetItemId(int) debe devolver el ID. de fila del elemento, pero no es necesario aquí.should return the row id of the item, but it's not needed here.

El método realiza el trabajo para aplicar una imagen a un ImageViewThe method does the work to apply an image to an ImageView que se incrustará en el Gallerythat will be embedded in the Gallery En este método, el miembro ContextIn this method, the member Context se usa para crear un nuevo ImageView.is used to create a new ImageView. El ImageViewThe ImageView se prepara aplicando una imagen de la matriz local de recursos Dibujables, estableciendo el Gallery.LayoutParamsis prepared by applying an image from the local array of drawable resources, setting the Gallery.LayoutParams alto y ancho de la imagen, estableciendo la escala para que quepa el ImageViewheight and width for the image, setting the scale to fit the ImageView dimensiones y, por último, establecer el fondo para usar el atributo con estilo adquirido en el constructor.dimensions, and then finally setting the background to use the styleable attribute acquired in the constructor.

Vea ImageView.ScaleType para ver otras opciones de escalado de imágenes.See ImageView.ScaleType for other image scaling options.

TutorialWalkthrough

Inicie un nuevo proyecto denominado HelloGallery.Start a new project named HelloGallery.

captura de pantalla del nuevo proyecto de Android en el cuadro de diálogo Nueva soluciónScreenshot of new Android project in the New Solution dialog

Busque algunas fotos que le gustaría usar o Descargue estas imágenes de ejemplo.Find some photos you'd like to use, or download these sample images. Agregue los archivos de imagen al directorio Resources/drawable del proyecto.Add the image files to the project's Resources/Drawable directory. En la ventana propiedades , establezca la acción de compilación para cada en AndroidResource.In the Properties window, set the Build Action for each to AndroidResource.

Abra Resources/layout/main. axml e inserte lo siguiente:Open Resources/Layout/Main.axml and insert the following:

<?xml version="1.0" encoding="utf-8"?>
<Gallery xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gallery"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
/>

Abra MainActivity.cs e inserte el código siguiente para la OnCreate()Open MainActivity.cs and insert the following code for the OnCreate() formamethod:

protected override void OnCreate (Bundle bundle)
{
    base.OnCreate (bundle);

    // Set our view from the "main" layout resource
    SetContentView (Resource.Layout.Main);

    Gallery gallery = (Gallery) FindViewById<Gallery>(Resource.Id.gallery);

    gallery.Adapter = new ImageAdapter (this);

    gallery.ItemClick += delegate (object sender, Android.Widget.AdapterView.ItemClickEventArgs args) {
        Toast.MakeText (this, args.Position.ToString (), ToastLength.Short).Show ();
    };
}

Cree una nueva clase denominada ImageAdapter que subclases BaseAdapter:Create a new class called ImageAdapter that subclasses BaseAdapter:

public class ImageAdapter : BaseAdapter
{
    Context context;

    public ImageAdapter (Context c)
    {
          context = c;
    }

    public override int Count { get { return thumbIds.Length; } }

    public override Java.Lang.Object GetItem (int position)
    {
          return null;
    }

    public override long GetItemId (int position)
    {
          return 0;
    }

    // create a new ImageView for each item referenced by the Adapter
    public override View GetView (int position, View convertView, ViewGroup parent)
    {
          ImageView i = new ImageView (context);

          i.SetImageResource (thumbIds[position]);
          i.LayoutParameters = new Gallery.LayoutParams (150, 100);
          i.SetScaleType (ImageView.ScaleType.FitXy);

          return i;
    }

    // references to our images
    int[] thumbIds = {
            Resource.Drawable.sample_1,
            Resource.Drawable.sample_2,
            Resource.Drawable.sample_3,
            Resource.Drawable.sample_4,
            Resource.Drawable.sample_5,
            Resource.Drawable.sample_6,
            Resource.Drawable.sample_7
     };
}

Ejecute la aplicación.Run the application. Debería ser similar a la captura de pantalla siguiente:It should look like the screenshot below:

Captura de pantalla de HelloGallery que muestra imágenes de ejemplo

ReferenciasReferences

Algunas partes de esta página son modificaciones basadas en el trabajo creado y compartido por el proyecto de código abierto de Android y que se usan según los términos descritos en la licencia de atribución de Creative Commons 2,5.Portions of this page are modifications based on work created and shared by the Android Open Source Project and used according to terms described in the Creative Commons 2.5 Attribution License.