android 图片滚动播放手机图片滚动播放app

转载

mob6454cc62b754 2023-09-19 17:08:10

文章标签 android 图片滚动播放 viewpager 轮播无限轮播 android 文章分类 Android 移动开发

轮播 ———–与———无限轮播

应用情景

无限轮播常见的应用有新闻类app，其对新闻进行滚动，点击后跳转到该新闻页面
无限轮播还常见于动态展示图片，丰富界面
轮播常见于手机app导航页面，跳转后进入主页面，再次进入后显示单个图片，自动或手动跳转

注意事项

1.网络加载注意添加internet 方法。

主要技术

采用技术主要有 ViewPager,viewPager的setOnPageChangeListener事件，imageView的OnTouchListener()事件，xUtils中BitmapUtils 的display()方法或者ImageLoader 的展示图片的方法，动态加载图片，自定义 shape。

主要功能实现

无限轮播，本地图片展示思路

1.页面布局，常用 FrameLayout,里面设置ViewPager和展示小原点的父布局
2.1初始化控件，初始化viewPager和小圆点的父布局，一般为线性布局
2.2初始化小圆点
3.初始化数据设置图片来源，为本地图片还是网络请求地址，采用不同的方式处理
4.设置适配器
5.设置相应的事件

功能点

1.轮播功能

设置初始位置
vp.setCurrentItem(10000*datas.length);

Integer.MAX_VALUE 设置最大数，ViewPager就能不会滑到头
实例化ImageView,往ViewPager添加数据；由于图片源少，而展示个数posstion多，取余实现图片源和posstion 匹配
ImageView image=new ImageView(MainActivity.this); int index=position%datas.length; //设置图片源 image.setImageResource(datas[index]); image.setScaleType(ImageView.ScaleType.CENTER_CROP); //设置宽高 image.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)); container.addView(image);

2.自动播放

`Handler mHandler=new Handler(){
    public void handleMessage(android.os.Message msg) {
        int item = vp.getCurrentItem();
        vp.setCurrentItem(++item);
        mHandler.sendEmptyMessageDelayed(0, 1000);
    };
};`

oncreat()方法中，初次调用

`mHandler.sendEmptyMessageDelayed(0, 1000);`

3.自动轮播，点击图片暂停，离开后继续自动播放

实现触摸监听事件，效果为点击不进行自动播放

`
    image.setOnTouchListener(new OnTouchListener() {

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                mHandler.removeCallbacksAndMessages(null);
                break;
            case MotionEvent.ACTION_UP:
                mHandler.sendEmptyMessageDelayed(0, 1000);
                break;
            case MotionEvent.ACTION_CANCEL:
                mHandler.sendEmptyMessageDelayed(0, 1000);
                break;

            default:
                break;
            }
            return true;
        }
    });

4.网络图片处理现主要为两种方式，一种为 xUtils, 一为 ImageLoader

`BitmapUtils bitmapUtils=new BitmapUtils(context);
    bitmapUtils.display(img, list.get(index));` 

`ImageLoader.getInstance().displayImage(list.get(position), img,options);`

完整代码

布局

`<FrameLayout 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.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
         />
    <LinearLayout 
        android:id="@+id/ll"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:gravity="center"
        ></LinearLayout>

</FrameLayout>`

原点一,聚焦的圆点

`<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval">
    <solid android:color="#ff7575"/>

</shape>`

原点二，正常的圆点

`<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval">
    <solid android:color="#c7c7e2"/>
</shape>`

主要代码

`import java.util.ArrayList;
import java.util.List;
import android.os.Bundle;
import android.os.Handler;
import android.app.Activity;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.Menu;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup;
import android.view.Window;
import android.widget.ImageView;
import android.widget.LinearLayout;

public class MainActivity extends Activity {
    private List<ImageView> list;
private int []datas=new int[]{R.drawable.guide1,R.drawable.guide11,R.drawable.guide12,R.drawable.guide13,R.drawable.guide2,R.drawable.guide3};
    Handler mHandler=new Handler(){
        public void handleMessage(android.os.Message msg) {
            int item = vp.getCurrentItem();
            vp.setCurrentItem(++item);
            mHandler.sendEmptyMessageDelayed(0, 1000);
        };
    };
    private ViewPager vp;
    private LinearLayout ll;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        //初始化控件

        vp = (ViewPager) findViewById(R.id.vp);
        ll = (LinearLayout) findViewById(R.id.ll);
        vp.setAdapter(new MyAdapter());
        vp.setCurrentItem(10000*datas.length);
        mHandler.sendEmptyMessageDelayed(0, 1000);
        //初始化 View
        initDot();
        //设置监听事件
        vp.setOnPageChangeListener(new OnPageChangeListener() {

            @Override
            public void onPageSelected(int arg0) {
                for(int i=0;i<list.size();i++){
                    int j=arg0%list.size();
                    if(j==i){
                        list.get(i).setImageResource(R.drawable.dot_focus);
                    }else{
                        list.get(i).setImageResource(R.drawable.dot_nomal);
                    }
                }

            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onPageScrollStateChanged(int arg0) {
                // TODO Auto-generated method stub

            }
        });
    }
    private void initDot() {
        list=new ArrayList<ImageView>();
        for(int i=0;i<datas.length;i++){
            ImageView img=new ImageView(this);
            img.setLayoutParams(new ViewGroup.MarginLayoutParams(20, 20));
            //设置默认
            if(i==0){
                img.setImageResource(R.drawable.dot_focus);
            }else{
                img.setImageResource(R.drawable.dot_nomal);
            }
            list.add(img);
            ll.addView(img);
        }

    }
    class MyAdapter extends PagerAdapter{

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return Integer.MAX_VALUE;
        }

        @Override
        public boolean isViewFromObject(View arg0, Object arg1) {
            // TODO Auto-generated method stub
            return arg0==arg1;
        }
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            ImageView image=new ImageView(MainActivity.this);
            int index=position%datas.length;
            //设置图片源
            image.setImageResource(datas[index]);
            image.setScaleType(ImageView.ScaleType.CENTER_CROP);
            //设置宽高
            image.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
            container.addView(image);
            image.setOnTouchListener(new OnTouchListener() {

                @Override
                public boolean onTouch(View v, MotionEvent event) {
                    switch (event.getAction()) {
                    case MotionEvent.ACTION_DOWN:
                        mHandler.removeCallbacksAndMessages(null);
                        break;
                    case MotionEvent.ACTION_UP:
                        mHandler.sendEmptyMessageDelayed(0, 1000);
                        break;
                    case MotionEvent.ACTION_CANCEL:
                        mHandler.sendEmptyMessageDelayed(0, 1000);
                        break;

                    default:
                        break;
                    }
                    return true;
                }
            });
            return image;
        }
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((ImageView)object);
        }

    }
}

`

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。

上一篇：Java语言中基本结构 java语言程序的基本结构

下一篇：记录锁 redis 记录锁屏密码输错app

提问和评论都可以，用心的回复会被更多人看到评论

发布评论

相关文章

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

android 图片滚动播放 手机图片滚动播放app

android 图片滚动播放 手机图片滚动播放app

轮播 ———–与———无限轮播

应用情景

注意事项

1.网络加载注意添加internet 方法。

主要技术

采用技术主要有 ViewPager,viewPager的setOnPageChangeListener事件，imageView的OnTouchListener()事件，xUtils中BitmapUtils 的display()方法或者ImageLoader 的展示图片的方法，动态加载图片 ，自定义 shape。

主要功能实现

无限轮播，本地图片展示 思路

功能点

1.轮播功能

2.自动播放

3.自动轮播，点击图片暂停，离开后继续自动播放

4.网络图片处理 现主要为两种方式，一种为 xUtils, 一为 ImageLoader

完整代码

51CTO博客

android 图片滚动播放手机图片滚动播放app

android 图片滚动播放手机图片滚动播放app

采用技术主要有 ViewPager,viewPager的setOnPageChangeListener事件，imageView的OnTouchListener()事件，xUtils中BitmapUtils 的display()方法或者ImageLoader 的展示图片的方法，动态加载图片，自定义 shape。

无限轮播，本地图片展示思路

4.网络图片处理现主要为两种方式，一种为 xUtils, 一为 ImageLoader