Android - ViewPager画廊+无限滑动?

2016-11-24  本文已影响0人  冰临陈夏
demo2.gif

关键代码一: -- 实现画廊?
xml:

    <LinearLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:clipChildren="false"
        android:gravity="center_horizontal"
        android:layerType="software"
        android:orientation="horizontal" >

        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="60dp"
            android:layout_marginRight="60dp"
            android:clipChildren="false" >
        </android.support.v4.view.ViewPager>
    </LinearLayout>

Java:

        // 1.设置幕后item的缓存数目
        viewPager.setOffscreenPageLimit(2);
        // 2.设置页与页之间的间距
        viewPager.setPageMargin(10);
        // 3.将父类的touch事件分发至viewPgaer,否则只能滑动中间的一个view对象
        container.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                return viewPager.dispatchTouchEvent(event);
            }
        });

关键代码二: --实现无限滑动?

    public void onPageSelected(int position) {
        int pageIndex = position;
        if (position == 0) {
            // 当视图在第一个时,将页面号设置为图片的最后一张。
            pageIndex = pics.length;
        } else if (position == pics.length + 1) {
            // 当视图在最后一个时,将页面号设置为图片的第一张。
            pageIndex = 1;
        }

        if (position != pageIndex) {
            viewPager.setCurrentItem(pageIndex, false);
            return;
        }
    }

完整代码:============================================

1、activity_main.xml:

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

    <LinearLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:clipChildren="false"
        android:gravity="center_horizontal"
        android:layerType="software"
        android:orientation="horizontal" >

        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="60dp"
            android:layout_marginRight="60dp"
            android:clipChildren="false" >
        </android.support.v4.view.ViewPager>
    </LinearLayout>

    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center_horizontal"
        android:layout_marginTop="20dp"
        android:scaleType="fitXY"
        android:text="baidu"
        android:textSize="18sp" />

</LinearLayout>

2、guide_item.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="250dp"
    android:background="#ccc"
    >

    <ImageView
        android:id="@+id/icon1"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:src="@mipmap/ic_launcher"
        android:scaleType="fitXY"
        />
</LinearLayout>

3、MainActivity.java :

import android.graphics.BitmapFactory;
import android.os.Environment;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {

    private ViewPager viewPager;
    private LinearLayout container;
    private TextView tvTitle;
    private LayoutInflater inflater;

    private String dir;
    private String[] pics = { "/img01.jpg", "/img02.jpg", "/img03.jpg" };
    private List<View> listviews;

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

        inflater = getLayoutInflater();
        container = (LinearLayout) findViewById(R.id.container);
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        tvTitle = (TextView) findViewById(R.id.title);

        //这里预先在sdcard准备一些轮播图片资源
        dir = Environment.getExternalStorageDirectory().getAbsolutePath();

        // 得到views集合
        listviews = new ArrayList<View>();
        int length = pics.length + 2;
        for (int i = 0; i < length; i++) {

            View view = inflater.inflate(R.layout.guide_item, null);
            ImageView img = (ImageView) view.findViewById(R.id.icon1);
            img.setImageBitmap(BitmapFactory.decodeFile(dir + pics[i%3]+""));

            listviews.add(view);
        }

        /////////////////////主要配置//////////////////////////////////////

        // 1.设置幕后item的缓存数目
        viewPager.setOffscreenPageLimit(2);
        // 2.设置页与页之间的间距
        viewPager.setPageMargin(10);
        // 3.将父类的touch事件分发至viewPgaer,否则只能滑动中间的一个view对象
        container.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                return viewPager.dispatchTouchEvent(event);
            }
        });

        ////////////////////////////////////////////////////////////////
        
        viewPager.setAdapter(new MyAdapter()); // 为viewpager设置adapter
        viewPager.addOnPageChangeListener(this);// 设置监听器
        viewPager.setCurrentItem(1); // 设置viewpager在第二个视图显示
    }

    /**
     * PagerAdapter
     */

    class MyAdapter extends PagerAdapter {

        /**
         * PagerAdapter管理数据大小
         */
        @Override
        public int getCount() {
            return listviews.size();
        }

        /**
         * 关联key 与 obj是否相等,即是否为同一个对象
         */
        @Override
        public boolean isViewFromObject(View view, Object obj) {
            return view == obj;
        }

        /**
         * 销毁当前page的相隔2个及2个以上的item时调用
         */
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((View) object); 
        }

        /**
         * 当前的page的前一页和后一页也会被调用,如果还没有调用或者已经调用了destroyItem
         */
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            Log.e("position",""+position);

            container.addView(listviews.get(position));
            return listviews.get(position); 

        }

    }


    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        if (viewPager != null) {
            viewPager.invalidate();
        }
    }


    /**
     * 一个新页被调用时执行,仍为原来的page时,该方法不被调用
     */
    public void onPageSelected(int position) {
        tvTitle.setText(pics[position%3]);

        int pageIndex = position;

        if (position == 0) {
            // 当视图在第一个时,将页面号设置为图片的最后一张。
            pageIndex = pics.length;
        } else if (position == pics.length + 1) {
            // 当视图在最后一个时,将页面号设置为图片的第一张。
            pageIndex = 1;
        }

        if (position != pageIndex) {
            viewPager.setCurrentItem(pageIndex, false);
            return;
        }
    }

    public void onPageScrollStateChanged(int state) {
    }

}

参考:
http://www.cnblogs.com/android100/p/Android-ViewPager-scroll-pic.html
http://blog.csdn.net/just_sanpark/article/details/17436037

cxCat.gif
上一篇下一篇

猜你喜欢

热点阅读