ViewPager圖片橫向自動輪播方法2

阿新 • • 發佈：2019-01-30

public class MainActivity extends AppCompatActivity {
    private static ViewPager viewPager;
    private RadioGroup group;
    //圖片資源，實際專案需要從網路獲取
    private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawable.ym4};
    //存放圖片的陣列
    private List<ImageView> mList;
    //當前索引位置以及上一個索引位置 

    private static int index = 0, preIndex = 0;
    //是否需要輪播標誌
    private boolean isContinue = true;
    //定時器，用於實現輪播
    private Timer timer = new Timer();
    private MyHandler mHandler;

    public static class MyHandler extends Handler {
        private WeakReference<MainActivity> weakReference;

        public 
 MyHandler(MainActivity activity) {
            weakReference = new WeakReference<>(activity);
        }
        @Override
        public void handleMessage(Message msg) {
            if (weakReference.get() != null) {
                index++;
                viewPager.setCurrentItem(index);
            }
            super 
.handleMessage(msg);
        }
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initData();
        addListener();
        //讓當前圖片位於中間某個位置，目的就是為了開始能夠左滑
        viewPager.setCurrentItem(imageIds.length * 100);
        initRadioButton(imageIds.length);//注意這句和上面那句順序不能寫反，否則會出現第一個圓點無法顯示選中狀態
        startSwitch();
    }
    /**
     * 初始化控制元件
     */
    public void initView() {
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        group = (RadioGroup) findViewById(R.id.group);
    }
    /**
     * 初始化資料
     */
    public void initData() {
        mList = new ArrayList<>();
        viewPager.setAdapter(pagerAdapter);
        mHandler = new MyHandler(this);
    }
    /**
     * 新增監聽
     */
    public void addListener() {
        viewPager.addOnPageChangeListener(onPageChangeListener);
        viewPager.setOnTouchListener(onTouchListener);
    }
    /**
     * 進行圖片輪播
     */
    public void startSwitch() {
        //執行定時任務
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                //首先判斷是否需要輪播，是的話我們才發訊息
                if (isContinue) {
                    mHandler.sendEmptyMessage(1);
                }
            }
        }, 3000, 3500);//延遲3秒，每隔3.5秒發一次訊息;
    }
    /**
     * 根據圖片個數初始化按鈕
     * @param length 圖片所在集合長度
     */
    private void initRadioButton(int length) {
        for (int i = 0; i < length; i++) {
            ImageView imageview = new ImageView(this);
            imageview.setImageResource(R.drawable.rg_selector);//設定背景選擇器
            imageview.setPadding(20, 0, 0, 0);//設定每個按鈕之間的間距
            //將按鈕依次新增到RadioGroup中
            group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
            //預設選中第一個按鈕，因為預設顯示第一張圖片
            group.getChildAt(0).setEnabled(false);
        }
    }
    /**
     * 根據當前觸控事件判斷是否要輪播
     */
    View.OnTouchListener onTouchListener = new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            switch (event.getAction()) {
                //手指按下和划動的時候停止圖片的輪播
                case MotionEvent.ACTION_DOWN:
                case MotionEvent.ACTION_MOVE:
                    isContinue = false;
                    break;
                default:
                    isContinue = true;
            }
            return false;//注意這裡只能返回false,如果返回true，Dwon就會消費掉事件，MOVE無法獲得事件，
            // 導致圖片無法滑動
        }
    };
    /**
     * 根據當前選中的頁面設定按鈕的選中
     */
    ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }
        @Override
        public void onPageSelected(int position) {
            index = position;//當前位置賦值給索引
            setCurrentDot(index % imageIds.length);//因為只有四個按鈕，所以我們在此要對長度區域，保證範圍在0到4
        }
        @Override
        public void onPageScrollStateChanged(int state) {
        }
    };
    /**
     * 設定對應位置按鈕的狀態
     * @param i 當前位置
     */
    private void setCurrentDot(int i) {
        if (group.getChildAt(i) != null) {
            group.getChildAt(i).setEnabled(false);//當前按鈕選中,顯示藍色
        }
        if (group.getChildAt(preIndex) != null) {
            group.getChildAt(preIndex).setEnabled(true);//上一個取消選中。顯示灰色
            preIndex = i;//當前位置變為上一個，繼續下次輪播
        }
    }

    PagerAdapter pagerAdapter = new PagerAdapter() {
        @Override
        public int getCount() {
            //返回一個比較大的值，目的是為了實現無限輪播
            return Integer.MAX_VALUE;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            position = position % imageIds.length;//因為position非常大，而我們需要的position不能大於圖片集合長度
            //所以在此取餘
            ImageView imageView = new ImageView(MainActivity.this);
            imageView.setImageResource(imageIds[position]);
            imageView.setScaleType(ImageView.ScaleType.FIT_XY);
            container.addView(imageView);
            mList.add(imageView);
            return imageView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
//         注意在此不要做任何操作，因為我們需要實現向左滑動，否則會產生IndexOutOfBoundsException
        }
    };
    @Override
    protected void onDestroy() {
        super.onDestroy();
        //頁面銷燬的時候取消定時器
        if (timer != null) {
            preIndex = 0;
            timer.cancel();
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
2.單向滑動

public class MainActivity extends AppCompatActivity {
    private static ViewPager viewPager;
    private RadioGroup group;
    //圖片資源，實際專案需要從網路獲取
    private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawable.ym4};
    //存放圖片的陣列
    private List<ImageView> mList;
    //當前索引位置以及上一個索引位置
    private static int index = 0, preIndex = 0;
    //是否需要輪播標誌
    private boolean isContinue = true;
    //定時器，用於實現輪播
    private Timer timer = new Timer();
    private MyHandler mHandler;

    public static class MyHandler extends Handler {
        private WeakReference<MainActivity> weakReference;

        public MyHandler(MainActivity activity) {
            weakReference = new WeakReference<>(activity);
        }
        @Override
        public void handleMessage(Message msg) {
            if (weakReference.get() != null) {
                index++;
                viewPager.setCurrentItem(index);
            }
            super.handleMessage(msg);
        }
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initData();
        addListener();
        initRadioButton(imageIds.length);
        startSwitch();
    }
    /**
     * 初始化控制元件
     */
    public void initView() {
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        group = (RadioGroup) findViewById(R.id.group);
    }
    /**
     * 初始化資料
     */
    public void initData() {
        mList = new ArrayList<>();
        viewPager.setAdapter(pagerAdapter);
        mHandler = new MyHandler(this);
    }
    /**
     * 新增監聽
     */
    public void addListener() {
        viewPager.addOnPageChangeListener(onPageChangeListener);
        viewPager.setOnTouchListener(onTouchListener);
    }
    /**
     * 進行圖片輪播
     */
    public void startSwitch() {
        //執行定時任務
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                //首先判斷是否需要輪播，是的話我們才發訊息
                if (isContinue) {
                    mHandler.sendEmptyMessage(1);
                }
            }
        }, 3000, 3500);//延遲3秒，每隔3.5秒發一次訊息;
    }
    /**
     * 根據圖片個數初始化按鈕
     * @param length 圖片所在集合長度
     */
    private void initRadioButton(int length) {
        for (int i = 0; i < length; i++) {
            ImageView imageview = new ImageView(this);
            imageview.setImageResource(R.drawable.rg_selector);//設定背景選擇器
            imageview.setPadding(20, 0, 0, 0);//設定每個按鈕之間的間距
            //將按鈕依次新增到RadioGroup中
            group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
            //預設選中第一個按鈕，因為預設顯示第一張圖片
            group.getChildAt(0).setEnabled(false);
        }
    }
    /**
     * 根據當前觸控事件判斷是否要輪播
     */
    View.OnTouchListener onTouchListener = new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            switch (event.getAction()) {
                //手指按下和划動的時候停止圖片的輪播
                case MotionEvent.ACTION_DOWN:
                case MotionEvent.ACTION_MOVE:
                    isContinue = false;
                    break;
                default:
                    isContinue = true;
            }
            return false;//注意這裡只能返回false,如果返回true，Dwon就會消費掉事件，MOVE無法獲得事件，
            // 導致圖片無法滑動
        }
    };
    /**
     * 根據當前選中的頁面設定按鈕的選中
     */
    ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }
        @Override
        public void onPageSelected(int position) {
            index = position;//當前位置賦值給索引
            setCurrentDot(index % imageIds.length);//因為只有四個按鈕，所以我們在此要對長度區域，保證範圍在0到4
        }
        @Override
        public void onPageScrollStateChanged(int state) {
        }
    };
    /**
     * 設定對應位置按鈕的狀態
     * @param i 當前位置
     */
    private void setCurrentDot(int i) {
        if (group.getChildAt(i) != null) {
            group.getChildAt(i).setEnabled(false);//當前按鈕選中,顯示藍色
        }
        if (group.getChildAt(preIndex) != null) {
            group.getChildAt(preIndex).setEnabled(true);//上一個取消選中。顯示灰色
            preIndex = i;//當前位置變為上一個，繼續下次輪播
        }
    }

    PagerAdapter pagerAdapter = new PagerAdapter() {
        @Override
        public int getCount() {
            //返回一個比較大的值，目的是為了實現無限輪播
            return Integer.MAX_VALUE;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            position = position % imageIds.length;//因為position非常大，而我們需要的position不能大於圖片集合長度
            //所以在此取餘
            ImageView imageView = new ImageView(MainActivity.this);
            imageView.setImageResource(imageIds[position]);
            imageView.setScaleType(ImageView.ScaleType.FIT_XY);
            container.addView(imageView);
            mList.add(imageView);
            return imageView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView(mList.get(position));
        }
    };
    @Override
    protected void onDestroy() {
        super.onDestroy();
        //頁面銷燬的時候取消定時器
        if (timer != null) {
            preIndex = 0;
            index = 0;
            timer.cancel();
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
3.加入一張圖片的判斷(最終版)

public class MainActivity extends AppCompatActivity {
    private static ViewPager viewPager;
    private RadioGroup group;
    //圖片資源，實際專案需要從網路獲取
//    private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawable.ym4};
    private int[] imageIds = {R.drawable.ym1};
    //存放圖片的陣列
    private List<ImageView> mList;
    //當前索引位置以及上一個索引位置
    private static int index = 0, preIndex = 0;
    //是否需要輪播標誌
    private boolean isContinue = true;
    //定時器，用於實現輪播
    private Timer timer = new Timer();
    private MyHandler mHandler;

    public static class MyHandler extends Handler {
        private WeakReference<MainActivity> weakReference;

        public MyHandler(MainActivity activity) {
            weakReference = new WeakReference<>(activity);
        }
        @Override
        public void handleMessage(Message msg) {
            if (weakReference.get() != null) {
                index++;
                viewPager.setCurrentItem(index);
            }
            super.handleMessage(msg);
        }
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initData();
        addListener();
        initRadioButton(imageIds.length);//注意這句和上面那句順序不能寫反，否則會出現第一個圓點無法顯示選中狀態
        startSwitch();
    }
    /**
     * 初始化控制元件
     */
    public void initView() {
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        group = (RadioGroup) findViewById(R.id.group);
    }
    /**
     * 初始化資料
     */
    public void initData() {
        mList = new ArrayList<>();
        viewPager.setAdapter(pagerAdapter);
        mHandler = new MyHandler(this);
    }
    /**
     * 新增監聽
     */
    public void addListener() {
        viewPager.addOnPageChangeListener(onPageChangeListener);
        viewPager.setOnTouchListener(onTouchListener);
    }
    /**
     * 進行圖片輪播
     */
    public void startSwitch() {
        //執行定時任務
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                //首先判斷是否需要輪播，是的話我們才發訊息
                if (isContinue) {
                    if(imageIds.length!=1)//多於一張圖片才輪播
                    mHandler.sendEmptyMessage(1);
                }
            }
        }, 3000, 3500);//延遲3秒，每隔3.5秒發一次訊息;
    }
    /**
     * 根據圖片個數初始化按鈕
     * @param length 圖片所在集合長度
     */
    private void initRadioButton(int length) {
        for (int i = 0; i < length; i++) {
            ImageView imageview = new ImageView(this);
            if(length == 1){
                imageview.setVisibility(View.GONE);
                return;
            }
            imageview.setImageResource(R.drawable.rg_selector);//設定背景選擇器
            imageview.setPadding(20, 0, 0, 0);//設定每個按鈕之間的間距
            //將按鈕依次新增到RadioGroup中
            group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
            //預設選中第一個按鈕，因為預設顯示第一張圖片
            group.getChildAt(0).setEnabled(false);
        }
    }
    /**
     * 根據當前觸控事件判斷是否要輪播
     */
    View.OnTouchListener onTouchListener = new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            switch (event.getAction()) {
                //手指按下和划動的時候停止圖片的輪播
                case MotionEvent.ACTION_DOWN:
                case MotionEvent.ACTION_MOVE:
                    isContinue = false;
                    break;
                default:
                    isContinue = true;
            }
            if(imageIds.length == 1){
                return true;//1張圖片不允許滑動
            }
            return false;//注意這裡只能返回false,如果返回true，Dwon就會消費掉事件，MOVE無法獲得事件，
            // 導致圖片無法滑動
        }
    };
    /**
     * 根據當前選中的頁面設定按鈕的選中
     */
    ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }
        @Override
        public void onPageSelected(int position) {
            index = position;//當前位置賦值給索引
            setCurrentDot(index % imageIds.length);//因為只有四個按鈕，所以我們在此要對長度區域，保證範圍在0到4
        }
        @Override
        public void onPageScrollStateChanged(int state) {
        }
    };
    /**
     * 設定對應位置按鈕的狀態
     * @param i 當前位置
     */
    private void setCurrentDot(int i) {
        if (group.getChildAt(i) != null) {
            group.getChildAt(i).setEnabled(false);//當前按鈕選中,顯示藍色
        }
        if (group.getChildAt(preIndex) != null) {
            group.getChildAt(preIndex).setEnabled(true);//上一個取消選中。顯示灰色
            preIndex = i;//當前位置變為上一個，繼續下次輪播
        }
    }

    PagerAdapter pagerAdapter = new PagerAdapter() {
        @Override
        public int getCount() {
            //返回一個比較大的值，目的是為了實現無限輪播
            return Integer.MAX_VALUE;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            position = position % imageIds.length;//因為position非常大，而我們需要的position不能大於圖片集合長度
            //所以在此取餘
            ImageView imageView = new ImageView(MainActivity.this);
            imageView.setImageResource(imageIds[position]);
            imageView.setScaleType(ImageView.ScaleType.FIT_XY);
            container.addView(imageView);
            mList.add(imageView);
            return imageView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
//         注意在此不要做任何操作，因為我們需要實現向左滑動，否則會產生IndexOutOfBoundsException
            container.removeView(mList.get(position));
        }
    };
    @Override
    protected void onDestroy() {
        super.onDestroy();
        //頁面銷燬的時候取消定時器
        if (timer != null) {
            preIndex = 0;
            index = 0;
            timer.cancel();
        }
    }
}

ViewPager圖片橫向自動輪播方法2

public class MainActivity extends AppCompatActivity { private static ViewPager viewPager; private RadioGroup group; //圖

ViewPager新增圖片橫向自動輪播

1、Dot_focus.xml程式碼 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/andr

從網路中獲取圖片進行自動輪播

MainActivity package com.example.lunbotu2; import android.annotation.SuppressLint; import android.os.Handler; import android.os.Message; impor

關於banner獲取網路圖片設定自動輪播

1、首先匯入依賴包 compile 'com.youth.banner:banner:1.4.9' 2、在佈局檔案中建立banner的控制元件 <com.youth.banner.Banner android:layout_width="match_parent"

Android使用ViewPager實現圖片輪播(高度自適應，左右迴圈，自動輪播)

效果前言該效果實現是基於我的第一篇部落格 Android使用ViewPager實現引導頁（帶小點提示）進行改進的，因此部分相同的地方我不會再重複描述，有意全面瞭解的可以先看完該篇部落格。實現為實現自定義一個通用的控制元件，我們首先建立一個類繼承ViewPager

簡易圖片自動輪播

pan -h function interval :hover osi 好的 pointer rip 根據前段時間學的大圖輪播，自己做了一個簡單的圖片自動輪播代碼如下 <!DOCTYPE html> <html> <head>

自動輪播本地圖片觸摸暫停輪播

listen linear down raw post callback android color let 第一步自己創建自動輪播視圖： 1 public class AutoShowView extends FrameLayout { 2 privat

圖片自動輪播

oot type utf-8 rev tle inner int val css <!DOCTYPE html><html><head><meta charset="UTF-8"><title></title

mui 圖片自動輪播

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> &

Android複習之旅--ViewPager（自動輪播條）

算一算，已經很久都沒有更博文了，最近又是拍畢業照又是幫別人拍微電影，自己也搗鼓些專案，忙這忙那的，都沒什麼時間寫部落格記錄筆記了。唉，說這麼多其實都是自己太懶了，為了讓自己不那麼內疚，只好找些藉口安慰安慰自己，哈哈~。好久沒寫部落格了，嘮叨嘮叨。最近的de

JS練習：替換式圖片自動輪播

程式碼： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script>

自動輪播 ViewPager

1. 概述 1.1 特點程式碼入侵性小, 修改一下類名即可, 不需要更換介面卡通過程式碼繪製指示器, 沒有指示器佈局檔案和沒有指示器資原始檔支援設定 ViewPager 切換時間可通過 adapter.notifyDataSetChanged() 動

Viewpager 自動輪播

1，佈局 <LinearLayout android:id="@+id/linear" android:layout_width="match_parent" android:layout_height="match_parent"

XListView重新整理載入，網路載入Xlv資料，網路載入ViewPager自動輪播，側拉，TabL

MainActivity.java public class MainActivity extends AppCompatActivity { private ViewPager pager; private DrawerLayout draw

簡單的一個圖片自動輪播

學習前端有一段時間了，把自己做的一個效果貼出給大家共享，哪裡寫的不好的請指正。先把程式碼貼出來給大家瞧！ <style> ul,li{ list-style:none; margin:0; padding:0;} ul{ width:913px; margin:20px auto;

js實現圖片自動輪播

今天有人問我這個問題，我就順便把這個記下來，分享給大夥。如圖，就是圖片自己輪播，並且圖中中下方的白點也發生變化，圖片到哪，白點就到哪，就直接上程式碼了 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transiti

ViewPager實現自動輪播及按壓及滑動狀態下停止自動輪播

ViewPager實現自動輪播及按壓及滑動狀態下停止自動輪播 /** * 設定自動輪播 *@param viewpager viewpage物件 *@param pauseTime 跳轉延時時間 * @param size viewpa

Viewpager 自動輪播（無限迴圈），手動滑動時停止輪播+底部小圓點（二）

專案結構如下： Volley工具類： VolleyTool類負責例項化mRequestQueue和mImageLoader。 package com.example.utils; import android.content.Context; import com

bootstrap實現圖片自動輪播

效果圖程式碼實現： <!DOCTYPE html> <html lang="zh-CN"> <head> <link rel="stylesheet" href="bootstrap.min.css

圖片自動輪播（仿淘寶？？）

先上效果圖（給美宅瘋狂打call~）是不是你們要找的效果，是的話就繼續往下看hahaha 上重點（敲黑板）！！！ js <script> $(function () { var containl

ViewPager圖片橫向自動輪播方法2

相關推薦