خانه
/
اندروید
/
آموزش ViewFlipper در برنامه نویسی اندروید

آموزش ViewFlipper در برنامه نویسی اندروید

سلام دوستان در این سری از آموزش برنامه نویسی اندروید به آموزش ViewFlipper در برنامه نویسی اندروید می پردازیم از ViewFlipper برای ایجاد یک اسلایدر مورد استفاده قرار میگیرد یکسری مزیت دارد و یکسری معایب که در ادامه در مورد آنها بحث خواهیم کرد در زیر می توانید پیش نماشی از آن را مشاهده کنید با ما همراه باشید.
به علت حجم بالای ویدیو از لینک زیر استفاده کنید.
لینک ویدیو
مزیت

نیاز نداشتن به کتاب خانه
بسیار سبک
و قابل سفارشی سازی

معایب

نداشتن Indicator
خیلی زیاد نمی توان آن را سفارشی سازی کرد.

ابتدا در layout خود کدهای زیر را قرار دهید نام layout در اینجا برابر با activity_main.xml است.

37
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    <ViewFlipper
        android:id="@+id/viewFlipper1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center" >
        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:src="@drawable/a" />
        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:src="@drawable/b" />
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="center"
            android:textSize="18sp"
            android:text="@string/flipper_textview" />
        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:src="@drawable/e" />
    </ViewFlipper>
</LinearLayout>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

37

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/container"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="vertical" >

<ViewFlipper

android:id="@+id/viewFlipper1"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:gravity="center" >

<ImageView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:src="@drawable/a" />

<ImageView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:src="@drawable/b" />

<TextView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:gravity="center"

android:textSize="18sp"

android:text="@string/flipper_textview" />

<ImageView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:src="@drawable/e" />

</ViewFlipper>

</LinearLayout>

در اینجا ما یک ViewFlipper داریم که در ان چهار عکس قرار گرفته است.
سپس در پوشه res یک پوشه به نام anim درسته کرده و در آن پوشه یک فایل به نام left_out.xml ایجاد کرده و کدهای زیر را در آن قرار دهید.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />
    <alpha
        android:duration="500"
        android:fromAlpha="1.0"
        android:toAlpha="0.1" />
</set>

1

2

3

4

5

6

7

8

9

10

11

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate

android:duration="500"

android:fromXDelta="0"

android:toXDelta="-100%p" />

<alpha

android:duration="500"

android:fromAlpha="1.0"

android:toAlpha="0.1" />

</set>

در همان پوشه یک فایل دیگر به نام right_enter.xml ایجاد کرذه و کدهای زیر را در آن قرار دهید.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
     android:shareInterpolator="false">
  <translate
     android:fromXDelta="100%" android:toXDelta="0%"
     android:fromYDelta="0%" android:toYDelta="0%"
     android:duration="300" />
</set>

1

2

3

4

5

6

7

8

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android"

android:shareInterpolator="false">

<translate

android:fromXDelta="100%" android:toXDelta="0%"

android:fromYDelta="0%" android:toYDelta="0%"

android:duration="300" />

</set>

و در آخر هم در بخش MainActivity.java کد های زیر را قرار دهید.

package com.view_flipper_demo;
import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.MotionEvent;
import android.widget.ViewFlipper;
public class MainActivity extends Activity {
	private ViewFlipper flip;
	private float initialX;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		flip = (ViewFlipper) findViewById(R.id.viewFlipper1);
		flip.setInAnimation(this, R.anim.right_enter);
		flip.setOutAnimation(this, R.anim.left_out);
	}
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			initialX = event.getX();
			break;
		case MotionEvent.ACTION_UP:
			float finalX = event.getX();
			if (initialX > finalX) {
				if (flip.getDisplayedChild() == 4)
					break;
				flip.showNext();
			} else {
				if (flip.getDisplayedChild() == 0)
					break;
				flip.showPrevious();
			}
			break;
		}
		return false;
	}
	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		getMenuInflater().inflate(R.menu.main, menu);
		return super.onCreateOptionsMenu(menu);
	}
	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		switch (item.getItemId()) {
		case R.id.flip_by_interval:
			flip.setFlipInterval(2000);
			flip.startFlipping();
			break;
		case R.id.flip_on_click:
			if (flip.isFlipping()) {
				flip.stopFlipping();
			}
			flip.showNext();
			break;
		}
		return super.onOptionsItemSelected(item);
	}
}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

package com.view_flipper_demo;

import android.app.Activity;

import android.os.Bundle;

import android.view.Menu;

import android.view.MenuItem;

import android.view.MotionEvent;

import android.widget.ViewFlipper;

public class MainActivity extends Activity {

private ViewFlipper flip;

private float initialX;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

flip = (ViewFlipper) findViewById(R.id.viewFlipper1);

flip.setInAnimation(this, R.anim.right_enter);

flip.setOutAnimation(this, R.anim.left_out);

}

@Override

public boolean onTouchEvent(MotionEvent event) {

switch (event.getAction()) {

case MotionEvent.ACTION_DOWN:

initialX = event.getX();

break;

case MotionEvent.ACTION_UP:

float finalX = event.getX();

if (initialX > finalX) {

if (flip.getDisplayedChild() == 4)

break;

flip.showNext();

} else {

if (flip.getDisplayedChild() == 0)

break;

flip.showPrevious();

}

break;

}

return false;

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

getMenuInflater().inflate(R.menu.main, menu);

return super.onCreateOptionsMenu(menu);

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case R.id.flip_by_interval:

flip.setFlipInterval(2000);

flip.startFlipping();

break;

case R.id.flip_on_click:

if (flip.isFlipping()) {

flip.stopFlipping();

}

flip.showNext();

break;

}

return super.onOptionsItemSelected(item);

}

}

در بالا کلیک بروی ViewFlipper را handle کردیم تا در صورت کشیدن به سمت چپ و راست عکس نیز تغییر کند و در بخش OptionMenu با استفاده از دکمه می توانید ViewFlipper را بر اساس یک تایم متفاوت تغییر دهید و گزینه دوم optionmenu به عکس بعدی می رود.

این آموزش هم به پایان رسید.

موفق و پیروز باشید.

مطالعه بیشتر

مطالب مشابه

ادامه مطلب

آموزش JobScheduler در برنامه نویسی اندروید

ادامه مطلب

آموزش Number Picker متریال دیزاین در اندروید

ادامه مطلب

آموزش Multilevel Expandable ListView در اندروید

ادامه مطلب

آموزش خواندن و نوشتن NFC Tag در برنامه نویسی اندروید

ادامه مطلب

بررسی روت بودن گوشی در برنامه نویسی اندروید

ادامه مطلب

آموزش اضافه کردن gradle به Eclipse

ادامه مطلب

جلوگیری از نمایش کیبورد (keyboard) هنگام اجرای activity حاوی EditText در برنامه نویسی اندروید

ادامه مطلب

تجربه ها و توصیه یک برنامه نویس اندروید

0 پاسخ به “آموزش ViewFlipper در برنامه نویسی اندروید”

mehdi گفت:
اردیبهشت 16, 1397 در 7:35 ب.ظ
سپاس
پاسخ
mehdi گفت:
بهمن 21, 1397 در 5:50 ب.ظ
سلام خسته نباشید
راهی هست که به صورت اتوماتیک به محض ورود به برنامه و بدون باتن تصاویر عوض بشن؟
پاسخ
1. sadati گفت:
  مهر 22, 1398 در 0:32 ق.ظ
  از لینک زیر استفاده کنید
  https://abhiandroid.com/ui/adapterviewflipper
  پاسخ
ساداتی گفت:
مهر 22, 1398 در 0:31 ق.ظ
سلام و خسته نباشید. من دروت اکتیویتی ام علاوه بر viewFlippper از button هم استفاده کردم و مشکل اینجاست که وقتی برای رویداد کلیک ماوس کد مینویسم برنامه دچار توقف ناگهانی هنگام اجرا میشه و به کدهام گیر میده. ممنون میشم راهنمایی کنید
پاسخ

دیدگاهتان را بنویسید لغو پاسخ