본문 바로가기

개발/모바일

안드로이드 스튜디오 Lec9 이미지 슬라이더(Image Slider)

반응형

강의 링크 : https://youtu.be/Z7IeH2LXgBs

 

- view pager를 이용해서 이미지 슬라이더 만들기

 

1. 

activity_main.xml에 advanced/<view>  를 추가 & ViewPager를 선택. 

id:view

 

2.

app/res/drawable 폴더에 원하는 사진들 업로드.

 

3.

app/res/layout 폴더에 slider.xml 파일 생성 후 다음과 같이 코드 작성

 

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

<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text=""
        android:id="@+id/textView"
        android:gravity="center"
        android:textSize="30dp"
        android:textStyle="bold"
        android:layout_marginTop="30dp"
        />
    
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:layout_marginTop="30dp"/>
</android.support.constraint.ConstraintLayout>

 

4.

MainActivity와 같은 폴더에 Adapter 파일 추가 후 다음과 같이 코드 작성

 

package com.example.han.tutorial9;

import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

/**
 * Created by HAN on 2018. 1. 8..
 */

// extends PagerAdapter 를 하고 나면 빨간줄이 그어지는데 반드시 상속해야할 메소드를 상속하지 않았기 때문.
// 해당 메소드들을 상속해준다
public class Adapter extends PagerAdapter {
    
    // R.drawable.(사진파일이름)으로 images 배열 생성
    private int[] images = {R.drawable.sherlock1, R.drawable.sherlock2, R.drawable.sherlock3};
    private LayoutInflater inflater;
    private Context context;

    // 해당 context가 자신의 context 객체와 똑같이 되도록 생성자를 만듬
   public Adapter(Context context){
       this.context = context;
   }
    @Override
    public int getCount() {
        return images.length;
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        // object를 LinearLayout 형태로 형변환했을 때 view와 같은지 여부를 반환
//        return view == ((LinearLayout)object); 으로 했을때 오류 나서 View 로 바꿈..
        return view == ((View)object);
    }

    // 각각의 item을 인스턴스 화
    @Override
    public Object instantiateItem( ViewGroup container, int position) {
        //초기화
        inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View v = inflater.inflate(R.layout.slider, container, false);
        ImageView imageView = (ImageView)v.findViewById(R.id.imageView);
        TextView textView = (TextView)v.findViewById(R.id.textView);
        imageView.setImageResource(images[position]);
        textView.setText((position+1)+"번째 이미지입니다.");
        container.addView(v);
        return v;
    }

    //할당을 해제
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.invalidate();
//        super.destroyItem(container, position, object);
    }
}

 

 

5. MainActivity

 

 package com.example.han.tutorial9;


import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    Adapter adapter;
    ViewPager viewPager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // 아까 만든 view
        viewPager = (ViewPager)findViewById(R.id.view);
        //adapter 초기화
        adapter = new Adapter(this);
        viewPager.setAdapter(adapter);
    }
}

 

반응형