[안드로이드 스튜디오] ViewFlipper (자동 페이지, 뷰 넘기기)

ViewFlipper

ViewFlipper는 뷰 컨테이너중 하나로 다른 뷰 컨테이너들과는 다르게 조금 복잡한 모양을 갖는다.

예를 들어 우리가 웹툰을 보고 있는데, 손으로 넘기는 것이 귀찮아서 자동 넘김 기능을 사용한다고 하면 이 것은 ViewFlipper의 역할이다.

ViewFlipper 응용

 

뷰 플리퍼를 응용하면 다양한 앱이 만들어지는데 크게 두 가지 분야로 응용할 수 있다.

 

1. 자동 페이징
2. 탭하여 뷰 넘기기

이 두가지 분야중 우리는 자동 페이징에 대해서 실습해보자.

 

뷰 플리퍼 자동 페이징

 

ViewFlipper의 사용 방법

 

<ViewFlipper
        android:id="@+id/viewFlipper"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        ...내부 위젯...

</ViewFlipper>

 

XML로 위와 같이 ViewFlipper를 만들었다면 해당 컨테이너 내부에 뷰를 얼마나 넣을 것인지 확인해야 한다.

만약 view가 3개라면 3개의 뷰만 추가해주면 된다.

 

우리는 그 뷰를 ImageView를 써서 Image를 띄워보자.

xml 코드

<ViewFlipper
        android:id="@+id/viewFlipper"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="40dp"
            android:src="@drawable/pic01"/>
        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="40dp" />
        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="40dp" />
    </ViewFlipper>

 

그리고 위의 이미지 뷰를 자동으로 페이징 하기 위해서 시작 버튼과 종료 버튼 또한 넣어보자.

 

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal">

        <Button
            android:id="@+id/startBtn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="2dp"
            android:text="사진보기 시작"/>
        <Button
            android:id="@+id/stopBtn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="2dp"
            android:text="사진보기 정지"/>
    </LinearLayout>

 

java 코드

 

java 코드에서는 3가지의 flipping 관련 메서드가 있다.

 

startFlipping()

화면 넘김 시작 메서드

stopFlipping()

정지 메서드

setFlipInterVal(millisceond)

화면 넘김 간견 메서드

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.ViewFlipper;

public class MainActivity extends AppCompatActivity {

    Button startBtn, stopBtn;
    ViewFlipper viewFlipper;
    //ImageView imageView1, imageView2, imageView3;

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

        startBtn = (Button) findViewById(R.id.startBtn);
        stopBtn = (Button) findViewById(R.id.stopBtn);
        viewFlipper = (ViewFlipper) findViewById(R.id.viewFlipper);

        startBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                viewFlipper.startFlipping();
                viewFlipper.setFlipInterval(1000);
            }
        });

        stopBtn.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v){
                viewFlipper.stopFlipping();
            }
        });
    }
}