Płynna animka przenikania obrazków

Data publikacji: 2012-03-07 , Wyświetleń: 1475

fade anim Ostatnimi czasy przyszło mi zrobić płynną animkę przejścia listy obrazków z katalogu. Wydawało się że to będzie prościutkie ale jakoś nie udało mi się tego "z palca" napisać w 5 min.

 

Początek

Mamy sobie katalog na karcie SD z którego będziemy pobierali liste obrazków do wyświetlenia. To jest łatwe:

private File[] files;
...
File f = new File(Environment.getExternalStorageDirectory(), "test");

files = f.listFiles();

W zmiennej files mamy tablicę plików z katalogu "test" na karcie SD.

 

XML widoku activity

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >



    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/ic_launcher" />
    
    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/ic_launcher" />

</RelativeLayout>

Kod animki (całe Activity)

public class ImgFadeTestActivity extends Activity {
    /** Called when the activity is first created. */
	
	private ImageView img1, img2;
	private boolean switcher = true;
	private File[] files;
	private int index = 2;
	
	private void assignFile(int id, ImageView img) {
		img.setImageBitmap(BitmapFactory.decodeFile(files[id].getAbsolutePath()));
	}
	
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        File f = new File(Environment.getExternalStorageDirectory(), "test");
        files = f.listFiles();
        
        img1 = (ImageView)findViewById(R.id.imageView1);
        img2 = (ImageView)findViewById(R.id.imageView2);
        img1.setBackgroundColor(0xFF000000);
        img2.setBackgroundColor(0xFF000000);
        assignFile(0, img1);
        assignFile(1, img2);
        
        final Animation a = AnimationUtils.loadAnimation(this, R.anim.anim1);
        a.setAnimationListener(new AnimationListener(){
			public void onAnimationEnd(Animation arg0) {}
			public void onAnimationRepeat(Animation arg0) {
				if (switcher)
					assignFile(index, img2);
				else
					assignFile(index, img1);
				switcher = !switcher;
				index++;
				if (index >= files.length) index = 0;
			}
			public void onAnimationStart(Animation arg0) {}
        });
        a.setFillAfter(true);
        img2.setAnimation(a);
    }
}

XML animacji

<?xml version="1.0" encoding="utf-8"?>
<alpha
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1.0"
    android:toAlpha="0.0"
    android:duration="2000" 
    android:repeatMode="reverse"
    android:repeatCount="infinite" />

 

Kod i podsumowanko

Całość appki można pobrać TUTAJ

Proste jak budowa cepa. Cały czas leci animacja zmiany alfa jednego obrazka i w zależności od stanu zmiennej na przemian raz do jednego raz do drugiego ImageView ładowany jest plik obrazka. Animacja idzie w nieskończoność a obrazki lecą w pętli.

Tagi: android, animacja