[JAVA][Android] ViewFlipper 사용해보기

안녕하세요.

오늘은 안드로이드에서 ViewFlipper를 사용해보도록 하겠습니다.

 

시작하기에 앞서 ViewFlipper에 대해서 먼저 간단히 알아봅시다.

 

ViewFlipper란?

여러 화면을 한 화면에서 볼 수 있게 해주는 view 컨테이너

View Animator의 일종으로 Frame Layout 을 상속받아 만들어졌습니다.

 

컴퓨터나 스마트폰 사진 앱에서 사진을 한장씩 넘기면서 보는 뷰어 기능이라고 보시면 됩니다.

 

(자세한 내용은 아래 링크를 통해 확인할 수 있습니다.)

https://developer.android.com/reference/android/widget/ViewFlipper

ViewFlipper  |  Android Developers

 

이제 예제를 통해 ViewFlipper를 사용해보도록 하겠습니다.

 

먼저 xml 파일입니다.

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:gravity="center">

        <Button
            android:id="@+id/previous_btn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="이전화면"
            android:textColor="@color/white"
            android:layout_margin="5dp"
            android:textStyle="bold"
            android:backgroundTint="#2196F3"/>
        <Button
            android:id="@+id/next_btn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:layout_weight="1"
            android:text="다음화면"
            android:textColor="@color/white"
            android:textStyle="bold"
            android:backgroundTint="#2196F3"/>
    </LinearLayout>
    <ViewFlipper
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        android:id="@+id/ViewFlipper1">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:background="#FF5722">

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="버튼1"
                android:layout_gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:background="#FFEB3B">

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="버튼2"
                android:layout_gravity="center"/>
        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:background="#009688">

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="버튼3"
                android:layout_gravity="center"/>
        </LinearLayout>
    </ViewFlipper>
</LinearLayout>

xml 화면의 모습

상단에는 화면을 넘길 수 있는 이전화면 버튼과 다음화면 버튼 두 개를 생성하였습니다.

그리고 ViewFlipper 안에 LinearLayout을 3개 넣어 버튼을 사용해 각 화면으로 넘길 수 있도록 하였습니다.

 

다음으로 Java 파일입니다.

 

package com.example.pratice;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ViewFlipper;

import androidx.appcompat.app.AppCompatActivity;

public class ViewFlipperActivity extends AppCompatActivity {
    private Button previousBtn, nextBtn;
    private ViewFlipper viewFlipper;

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

        previousBtn = findViewById(R.id.previous_btn);
        nextBtn = findViewById(R.id.next_btn);
        viewFlipper = findViewById(R.id.ViewFlipper1);

        previousBtn.setOnClickListener(new View.OnClickListener() { // "이전화면" 버튼 클릭 시
            @Override
            public void onClick(View v) {
                viewFlipper.showPrevious();
            }
        });
        nextBtn.setOnClickListener(new View.OnClickListener() { // "다음화면" 버튼 클릭 시
            @Override
            public void onClick(View v) {
                viewFlipper.showNext();
            }
        });
    }
}

Java파일에서는 이전화면 버튼과 다음화면 버튼을 선언 후

각 버튼의 ClickListener 안에 ViewFlipper의 메서드인 showPrevious()와 showNext()를 넣어주었습니다.

 

실행화면 입니다.

보시다시피 각 버튼을 클릭 시 이전 화면, 다음 화면으로 넘겨지는 것을 볼 수 있습니다.

궁금한 점은 댓글로 남겨주세요.

감사합니다.