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

سلام دوستان امیدوارم حالتان خوب باشد در این سری از آموزش برنامه نویسی اندروید به آموزش ViewPager در برنامه نویسی اندروید می پردازیم از viewpager به منظور swipe به سمت چپ / راست استفاده می شود در ادامه برای Viewpager یک آداپتور سفارشی میسازیم تا بتوانیم ViewPager را سفارشی کنیم در ادامه با ما همراه باشید.
 
پیش نمایش آموزس Viewpager در برنامه نویسی اندروید

 
ابتدا ما در layout که ساخته شده (activity_main.xml) یک Viewpager همانند زیر قرار میدهم.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</RelativeLayout>

باید سه تا لایه برای Viewpager خودمان درست کنیم این بخش دست خودمان است می توانید حتی یک عدد باشد.
سه layout داریم عبارتند از

• view_blue.xml
• view_red.xml
• view_green.xml

layout های بالا صفحه های مختلف Viewpager را تشکیل خواهند داد.
ما فقط یکی از آنها را قرار میدهیم شما بقیه را از روی همین یکی بسیازید.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:background="@android:color/holo_blue_dark"
    android:layout_height="match_parent">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Second View"
        android:layout_gravity="center_horizontal"
        android:textSize="28sp"
        android:textColor="@android:color/black"
        android:textStyle="bold"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/textView" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Swipe left"
        android:layout_gravity="center_horizontal"
        android:textSize="20sp"
        android:textColor="@android:color/black"
        android:textStyle="bold"
        android:minLines="2"
        android:id="@+id/textView2"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Swipe right"
        android:layout_gravity="center_horizontal"
        android:textSize="20sp"
        android:textColor="@android:color/black"
        android:textStyle="bold"
        android:minLines="2"
        android:id="@+id/textView3"
        android:layout_alignTop="@+id/textView2"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
</RelativeLayout>

در اینجا برای اینکه یکسری داده sample در آن لود کنیم یک enum به نام ModelObject.java ایجاد کردیم و کدهای زیر را در آن قرار دادیم (این کلاس به POJO یا getter / setter معروف است.)

package ir.programchi.viewpager;
public enum ModelObject {
    RED(R.string.red, R.layout.view_red),
    BLUE(R.string.blue, R.layout.view_blue),
    GREEN(R.string.green, R.layout.view_green);
    private int mTitleResId;
    private int mLayoutResId;
    ModelObject(int titleResId, int layoutResId) {
        mTitleResId = titleResId;
        mLayoutResId = layoutResId;
    }
    public int getTitleResId() {
        return mTitleResId;
    }
    public int getLayoutResId() {
        return mLayoutResId;
    }
}

کلاس بالا یا enum بالا عمل getter و setter را نیز انجام میدهد همانطور که می بینید یک Constructor نیز دارد.
یک کلاس جاوا به نام CustomPagerAdapter.java ایجاد کنید و کدهای زیر را در آن قرار دهید.

package ir.programchi.viewpager;
import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class CustomPagerAdapter extends PagerAdapter {
    private Context mContext;
    public CustomPagerAdapter(Context context) {
        mContext = context;
    }
    @Override
    public Object instantiateItem(ViewGroup collection, int position) {
        ModelObject modelObject = ModelObject.values()[position];
        LayoutInflater inflater = LayoutInflater.from(mContext);
        ViewGroup layout = (ViewGroup) inflater.inflate(modelObject.getLayoutResId(), collection, false);
        collection.addView(layout);
        return layout;
    }
    @Override
    public void destroyItem(ViewGroup collection, int position, Object view) {
        collection.removeView((View) view);
    }
    @Override
    public int getCount() {
        return ModelObject.values().length;
    }
    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == object;
    }
    @Override
    public CharSequence getPageTitle(int position) {
        ModelObject customPagerEnum = ModelObject.values()[position];
        return mContext.getString(customPagerEnum.getTitleResId());
    }
}

در اینجا ما اداپتور خودمان را از کلاس PagerAdapter اندروید extends سپس متودهای آن را override کردیم .
متود CustomPagerAdapter باید یک Context داشته باشد تا به آیتم ها و اشیا دسترسی بگیرد.
instantiateItem : به منظور inflate  کردن layout ها ما مورد استفاده قرار می گیرد.
destroyItem : این متود view های ما رو در زمانی که استفاده ندارند حذف می کند.
getCount : این متود تعداد view های ما را برمی گرداند.
isViewFromObject : این روش بررسی می کند که آیا یک جسم خاص متعلق به یک موقعیت خاص است یا خیر .
getPageTitle : عنوان مربوط به هر تب را بر می گرداند.
در نهایت وارد MainActivity.java شده و کدهای زیر را قرار دهید.

package ir.programchi.viewpager;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
        viewPager.setAdapter(new CustomPagerAdapter(this));
    }
}

در بالا ابتدا viewpager را find کردیم سپس آداپتور new شده را به آن دادیم (setAdapter کردیم)
 
 
موفق باشید.

مطالعه بیشتر