Android: selector de imágenes

A veces, no desea que una imagen aparezca abruptamente en la pantalla, sino que desea aplicar algún tipo de animación a la imagen cuando pasa de una imagen a otra. Esto es compatible con Android en forma de ImageSwitcher.

Un conmutador de imágenes le permite agregar algunas transiciones en las imágenes a través de la forma en que aparecen en la pantalla. Para utilizar Image Switcher, primero debe definir su componente XML. Su sintaxis se da a continuación:

<ImageSwitcher
   android:id="@+id/imageSwitcher1"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_centerHorizontal="true"
   android:layout_centerVertical="true" >
</ImageSwitcher>

Ahora creamos una instancia de ImageSwithcer en un archivo java y obtenemos una referencia de este componente XML. Su sintaxis se da a continuación:

private ImageSwitcher imageSwitcher;
imageSwitcher = (ImageSwitcher)findViewById(R.id.imageSwitcher1);

Lo siguiente que tenemos que hacer es implementar la interfaz ViewFactory e implementar un método no implementado que devuelve un imageView. Su sintaxis está debajo:

imageSwitcher.setImageResource(R.drawable.ic_launcher);
imageSwitcher.setFactory(new ViewFactory() {
   public View makeView() {
      ImageView myView = new ImageView(getApplicationContext());
      return myView;
   }
}

Lo último que debe hacer es agregar Animación al ImageSwitcher. Necesita definir un objeto de la clase Animation a través de la clase AnimationUtilities llamando a un método estático loadAnimation. Su sintaxis se da a continuación:

Animation in = AnimationUtils.loadAnimation(this,android.R.anim.slide_in_left);
imageSwitcher.setInAnimation(in);
imageSwitcher.setOutAnimation(out);

El método setInAnimaton establece la animación de la apariencia del objeto en la pantalla, mientras que setOutAnimation hace lo contrario. El método loadAnimation () crea un objeto de animación.

Aparte de estos métodos, hay otros métodos definidos en la clase ImageSwitcher. Se definen a continuación:

No Señor	Método y descripción
1	setImageDrawable(Drawable drawable) Establece una imagen con el selector de imágenes. La imagen se pasa en forma de mapa de bits.
2	setImageResource(int resid) Establece una imagen con el selector de imágenes. La imagen se pasa en forma de ID de número entero
3	setImageURI(Uri uri) Establece una imagen con el selector de imágenes. La imagen se pasa en forma de URI
4	ImageSwitcher(Context context, AttributeSet attrs) Devuelve un objeto de conmutador de imágenes con algunos atributos ya configurados pasados en el método
5	onInitializeAccessibilityEvent (AccessibilityEvent event) Inicializa un evento de accesibilidad con información sobre esta vista, que es el origen del evento.
6	onInitializeAccessibilityNodeInfo (AccessibilityNodeInfo info) Inicializa un AccessibilityNodeInfo con información sobre esta vista

Ejemplo

El siguiente ejemplo demuestra algunos de los efectos del conmutador de imágenes en el mapa de bits. Contiene una aplicación básica que le permite ver los efectos de animación en las imágenes.

Para experimentar con este ejemplo, debe ejecutarlo en un dispositivo real.

Pasos	Descripción
1	Utilizará Android Studio IDE para crear una aplicación de Android en un paquete com.example.sairamkrishna.myapplication.
2	Modifique el archivo src / MainActivity.java para agregar el código necesario.
3	Modifique res / layout / activity_main para agregar los componentes XML respectivos
4	Ejecute la aplicación y elija un dispositivo Android en ejecución e instale la aplicación en él y verifique los resultados

A continuación se muestra el contenido del archivo de actividad principal modificado src/MainActivity.java.

En el siguiente código tp y abc indica el logo de tutorialspoint.com

package com.example.sairamkrishna.myapplication;

import android.app.Activity;
import android.app.ActionBar.LayoutParams;
import android.os.Bundle;
import android.view.View;

import android.widget.Button;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.ViewSwitcher.ViewFactory;

public class MainActivity extends Activity {
   private ImageSwitcher sw;
   private Button b1,b2;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      b1 = (Button) findViewById(R.id.button);
      b2 = (Button) findViewById(R.id.button2);

      sw = (ImageSwitcher) findViewById(R.id.imageSwitcher);
      sw.setFactory(new ViewFactory() {
         @Override
         public View makeView() {
            ImageView myView = new ImageView(getApplicationContext());
            myView.setScaleType(ImageView.ScaleType.FIT_CENTER);
            myView.setLayoutParams(new 
               ImageSwitcher.LayoutParams(LayoutParams.WRAP_CONTENT,
                  LayoutParams.WRAP_CONTENT));
            return myView;
         }
      });

      b1.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            Toast.makeText(getApplicationContext(), "previous Image",
               Toast.LENGTH_LONG).show();
            sw.setImageResource(R.drawable.abc);
         }
      });

      b2.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            Toast.makeText(getApplicationContext(), "Next Image",
               Toast.LENGTH_LONG).show();
            sw.setImageResource(R.drawable.tp);
         }
      });
   }
}

A continuación se muestra el contenido modificado del xml res/layout/activity_main.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" 
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   android:paddingBottom="@dimen/activity_vertical_margin" 
   tools:context=".MainActivity">
      
   <TextView android:text="Gestures  Example" 
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/textview"
      android:textSize="35dp"
      android:layout_alignParentTop="true"
      android:layout_centerHorizontal="true" />
      
   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Tutorials point"
      android:id="@+id/textView"
      android:layout_below="@+id/textview"
      android:layout_centerHorizontal="true"
      android:textColor="#ff7aff24"
      android:textSize="35dp" />
      
   <ImageSwitcher
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/imageSwitcher"
      android:layout_below="@+id/textView"
      android:layout_centerHorizontal="true"
      android:layout_marginTop="168dp" />
      
   <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/left"
        android:id="@+id/button"
        android:layout_below="@+id/textView"
        android:layout_centerHorizontal="true" />

   <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/right"
        android:id="@+id/button2"
        android:layout_alignParentBottom="true"
        android:layout_alignLeft="@+id/button"
        android:layout_alignStart="@+id/button" />
      
</RelativeLayout>

A continuación se muestra el contenido de Strings.xml archivo.

<resources>
    <string name="app_name">My Application</string>
    <string name="left"><![CDATA[<]]></string>
    <string name="right"><![CDATA[>]]></string>
</resources>

A continuación se muestra el contenido de AndroidManifest.xml archivo.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.example.sairamkrishna.myapplication"

   <application
      android:allowBackup="true"
      android:icon="@drawable/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" >
      
      <activity
         android:name="com.example.sairamkrishna.myapplication.MainActivity"
         android:label="@string/app_name" >
         
         <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
         </intent-filter>
         
      </activity>
      
   </application>
</manifest>

Intentemos ejecutar la aplicación que acabamos de modificar. Supongo que habías creado tuAVDmientras realiza la configuración del entorno. Para ejecutar la aplicación desde Android Studio, abra uno de los archivos de actividad de su proyecto y haga clic en el icono Ejecutar de la barra de herramientas. Android Studio instala la aplicación en su AVD y la inicia y, si todo está bien con su configuración y aplicación, se mostrará la siguiente ventana del emulador:

Ahora, si miras la pantalla de tu dispositivo, verás los dos botones.

Ahora simplemente seleccione el botón superior de la flecha derecha. Una imagen aparecería desde la derecha y se movería hacia la izquierda. Se muestra a continuación:

Ahora toque el botón de abajo, que traerá de vuelta la imagen anterior con alguna transición. Se muestra a continuación:

↰ Previous page Next page ↱