devstory

Le Tutoriel de Android ImageSwitcher

  1. L'aperçu de ImageSwitcher
  2. Exemple avec Android ImageSwitcher
  3. Phụ lục: Thiết kế giao diện

1. L'aperçu de ImageSwitcher

C'est l'image d'une l'application qui utilise ImageSwitcher:
    • TODO: More infos

    2. Exemple avec Android ImageSwitcher

    Créez un projet nommé AndroidImageSwitcher:
    • File > New Project > Empty Activity
    Vous devez préparer quelques images afin de les utiliser dans des exemples ci- dessous:
    image1.png
    image2.png
    image3.png
    Copiez ces images dans le dossier drawable.
    L'interface de l'application:
    If you are interested in the steps to design the interface of this application, please see the appendix at the end of the article.
    main_actvity.xml
    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
    
        <ImageSwitcher
            android:id="@+id/imageSwitcher"
            android:layout_width="0dp"
            android:layout_height="279dp"
            android:layout_marginStart="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginTop="27dp"
            android:layout_marginEnd="16dp"
            android:layout_marginRight="16dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginTop="16dp"
            android:layout_marginEnd="16dp"
            android:layout_marginRight="16dp"
            android:orientation="horizontal"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/imageSwitcher">
    
            <Space
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1" />
    
            <Button
                android:id="@+id/button_previous "
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="0"
                android:text="Previous" />
    
            <Button
                android:id="@+id/button_next"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="0"
                android:text="Next" />
    
            <Space
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1" />
        </LinearLayout>
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    MainActivity.java
    package org.o7planning.androidimageswitcher;
    
    import android.os.Bundle;
    import android.app.ActionBar.LayoutParams;
    import android.graphics.Color;
    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;
    
    import androidx.appcompat.app.AppCompatActivity;
    
    public class MainActivity extends AppCompatActivity {
    
        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);
    
            // Animation when switching to another image.
            Animation out= AnimationUtils.loadAnimation(this, android.R.anim.fade_out);
            Animation in= AnimationUtils.loadAnimation(this, android.R.anim.fade_in);
    
            // Set animation when switching images.
            imageSwitcher.setInAnimation(in);
            imageSwitcher.setOutAnimation(out);
    
            //
            imageSwitcher.setFactory(new ViewFactory() {
    
                // Returns the view to show Image
                // (Usually should use 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);
            }
        }
    
        // Find Image ID corresponding to the name of the image (in the drawable folder).
        public int getDrawableResIdByName(String resName)  {
            String pkgName = this.getPackageName();
            // Return 0 if not found.
            int resID = this.getResources().getIdentifier(resName , "drawable", pkgName);
            Log.i("MyLog", "Res Name: " + resName + "==> Res ID = " + resID);
            return resID;
        }
    
    }
    L'exécution de l'application:

    3. Phụ lục: Thiết kế giao diện

    I don't know why ImageSwitcher is not available on design window of Android Studio 3.6.x, so you can't drag it into the interface. The best way is to add the following XML code to the activity_main.xml file and you will get ImageSwitcher on the interface.
    <ImageSwitcher
            android:layout_width="100dp"
            android:layout_height="100dp" />
    Set ID, Text for components on the interface.

    Tutoriels de programmation Android

    Show More