[안드로이드]ViewPaPer

안녕하세용 코딩초밥입니다!ㅇㅅㅇ

오늘은 그림이나 만화를 쓱쓱 볼수있는 ViewPaper을 해보겠습니당.💖😊

주석으로 설명을 하나하나 해보았으니 결과물을 컴퓨터로 보시면서 쭉읽어보시길바랍니다

 

 

순서

 

1. activity_main에 viewpaper을 만듭니다.

2.안에 넣어질 이미지 뷰를 page.xml에 만듭니다.

3.어뎁터를 만들어 페이지뷰안에 이미지들을 넣습니다.

4.MainActivity에 자신이 원하는 이미지를 넣어봅니다

5. 짠.

 

순서1. activity_main에 viewpaper을 만듭니다.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:padding="16dp"
    tools:context=".MainActivity">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </androidx.viewpager.widget.ViewPager>



</RelativeLayout>

순서2.안에 넣어질 이미지 뷰를 page.xml에 만듭니다. (하나만들어주세요)

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

    <ImageView
        android:id="@+id/iv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>

순서3.어뎁터를 만들어 페이지뷰안에 이미지들을 넣습니다.

*설명은 주석으로 하겠습니다 한줄한줄 정리해보겠습니당

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;
import java.util.ArrayList;

public class MyAdapter extends PagerAdapter {

    ArrayList<Integer> items; 
    //ArrayList 로 배열을 만들었습니다. 그 배열안에는 int 객체형인 integer로 넣습니다
    //우리가 넣는 이미지들은 사실 숫자로 위치저장되있는다는걸 아나요?
    //그걸 이용할겁니다!

    LayoutInflater inflater;
    // LayoutInflater layout이란 XML에 미리 정의해둔 틀을 실제 메모리에 올려주는 역할을 합니다.
    // 간단히 말해서 layout을 만들어 준다는겁니다.

    //생성자메소드
    //만드는 이유 
    //인스턴스 생성시 필드에 초기값으로 부여하기 위해
    //인스턴스 생성에 필요한 초기화 명령을 실행하기 위해
    public MyAdapter(ArrayList<Integer> items, LayoutInflater inflater){
        this.items= items;
        this.inflater= inflater;
    }

    //이 아답터가 만들 page의 총 개수를 리턴하는 메소드입니다.(즉, 데이터의 개수)
    @Override
    public int getCount() {
        return items.size();
    }

    //이 아답터가 page.xml설계도면을 기반으로
    //ViewPage에 보여질 한 페이지(View 객체)를 만들어내는 작업 메소드
    //ListView에 사용되는 아답터의 getView()같은 메소드 입니다!
   
    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {

        //page.xml문서를 읽어와서 View객체로 만들기(부풀리다)
        View page= inflater.inflate(R.layout.page, null);

        //이 page안에 있는 ImageView에 현재번째(position) 이미지를 설정
        ImageView iv= page.findViewById(R.id.iv);
       
        //imageview에 각 포지션을 부여합니다.
        iv.setImageResource(  items.get(position)  );

        //만들어진 page를 ViewPager(첫번째 파라미터 : container)에 추가하기
        container.addView(page);

        return page;//만들어진 페이지 뷰 객체 리턴 : 검증을 위해서..
    }

    //화면에 더이상 보이지 않아 메모리에서 page제거하라는 메소드@Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        container.removeView( (View)object );
    }

    //instateItem()메소드에서 만들어서 리턴한 page가 이 메소드의 2번째 파라미터로 전달됨
    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view == object; //뷰페이저가 보여줄 view와 위에서 만든 page(object)객체가 같은지 리턴
    }
}

4.MainActivity에 자신이 원하는 이미지를 넣어봅니다

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;
import android.os.Bundle;
import android.view.View;
import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

    ArrayList<Integer> items = new ArrayList<>(); 
    ViewPager pager;

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

        //대량의 데이터들 추가하기 원하는 이미지를 가져옵니다.
        items.add(new Integer(R.drawable.gametitle_01));
        items.add(new Integer(R.drawable.gametitle_02));
        items.add(new Integer(R.drawable.gametitle_03));
        items.add(new Integer(R.drawable.gametitle_04));
        items.add(new Integer(R.drawable.gametitle_05));
        items.add(new Integer(R.drawable.gametitle_06));
        items.add(new Integer(R.drawable.gametitle_07));
        items.add(new Integer(R.drawable.gametitle_08));
        items.add(new Integer(R.drawable.gametitle_09));
        items.add(new Integer(R.drawable.gametitle_10));

        //아답터 객체 생성
        adpater = new MyAdapter(items, getLayoutInflater());

        //ViewPager에 아답터 설정
        pager = findViewById(R.id.pager);
        pager.setAdapter(adpater);

    }
}