Hướng dẫn sử dụng Android ImageSwitcher

Xem thêm các chuyên mục:

1- Tổng quan về ImageSwitcher
2- Ví dụ với Android ImageSwitcher

1- Tổng quan về ImageSwitcher

Đây là hình ảnh một ứng dụng sử dụng ImageSwitcher:
  • TODO: Viết chém gió thêm.

2- Ví dụ với Android ImageSwitcher

Tạo project có tên AndroidImageSwitcher:
Bạn cần một vài ảnh tham gia vào trong ví dụ:
image1.png
image2.png
image3.png
Copy các ảnh trên vào thư mục drawable.
Giao diện ứng dụng:
main_actvity.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:paddingBottom="@dimen/activity_vertical_margin"
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   tools:context=".MainActivity">

   <ImageSwitcher
       android:layout_width="match_parent"
       android:layout_height="250dp"
       android:id="@+id/imageSwitcher"
       android:layout_alignParentTop="true"
       android:layout_centerHorizontal="true" />

   <Button
       style="?android:attr/buttonStyleSmall"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Previous"
       android:id="@+id/button_previous"
       android:layout_marginLeft="94dp"
       android:layout_marginStart="94dp"
       android:layout_alignParentBottom="true"
       android:layout_alignParentLeft="true"
       android:layout_alignParentStart="true" />

   <Button
       style="?android:attr/buttonStyleSmall"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Next"
       android:id="@+id/button_next"
       android:layout_alignTop="@+id/button_previous"
       android:layout_toRightOf="@+id/button_previous"
       android:layout_toEndOf="@+id/button_previous" />
   
</RelativeLayout>
MainActivity.java 
package org.o7planning.androidimageswitcher;

import android.app.ActionBar.LayoutParams;
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
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 imageSwitcher;
    private Button buttonPrevious;
    private Button buttonNext;

    private final String[] imageNames={"image1", "image2", "image3"};
    private int currentIndex;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        buttonPrevious = (Button) findViewById(R.id.button_previous);
        buttonNext = (Button) findViewById(R.id.button_next);

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

        // Hoạt hình khi chuyển sang ảnh khác.
        Animation out= AnimationUtils.loadAnimation(this, android.R.anim.fade_out);
        Animation in= AnimationUtils.loadAnimation(this, android.R.anim.fade_in);

        // Sét đặt hiệu ứng hoạt hình khi chuyển ảnh.
        imageSwitcher.setInAnimation(in);
        imageSwitcher.setOutAnimation(out);

        //
        imageSwitcher.setFactory(new ViewFactory() {

            // Trả về View để hiển thị ảnh.
            // (Thông thường sử dung ImageView).
            @Override
            public View makeView() {
                ImageView imageView = new ImageView(getApplicationContext());

                imageView.setBackgroundColor(Color.LTGRAY);
                imageView.setScaleType(ImageView.ScaleType.CENTER);

                ImageSwitcher.LayoutParams params= new ImageSwitcher.LayoutParams(
                        LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
                imageView.setLayoutParams(params);
                return imageView;
            }
        });

        this.currentIndex=0;
        this.showImage(this.currentIndex);

        buttonPrevious.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                previousImage();
            }
        });

        buttonNext.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                nextImage();
            }
        });
    }


    private void previousImage()  {
        if(currentIndex > 0) {
            currentIndex--;
        }else  {
            Toast.makeText(getApplicationContext(), "No Previous Image", Toast.LENGTH_SHORT).show();
            return;
        }
        this.showImage(currentIndex);
    }

    private void nextImage()  {
        if(currentIndex < this.imageNames.length-1) {
            currentIndex++;
        }else  {
            Toast.makeText(getApplicationContext(), "No Next Image", Toast.LENGTH_SHORT).show();
            return;
        }
        this.showImage(currentIndex);
    }


    private void showImage(int imgIndex)  {
        String imageName= this.imageNames[imgIndex];

        int resId= getDrawableResIdByName(imageName);
        if(resId!=  0) {
            this.imageSwitcher.setImageResource(resId);
        }
    }
 
    // Tìm ID của Image ứng với tên của ảnh (Trong thư mục mipmap).
    public int getDrawableResIdByName(String resName)  {
        String pkgName = this.getPackageName();
 
        // Trả về 0 nếu không tìm thấy.
        int resID = this.getResources().getIdentifier(resName , "drawable", pkgName);
        Log.i("MyLog", "Res Name: " + resName + "==> Res ID = " + resID);
        return resID;
    }

}
Chạy ứng dụng:

Xem thêm các chuyên mục: