AndroidWiki - 无限图文轮播

最新推荐文章于 2020-12-06 09:36:07 发布
最新推荐文章于 2020-12-06 09:36:07 发布
阅读量227 收藏
点赞数
分类专栏： Android wiki 文章标签： Android slideview viewpager
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_16206535/article/details/79446926
版权

无限轮播位

import android.animation.Animator;
import android.animation.AnimatorInflater;
import android.content.Context;
import android.os.Handler;
import android.os.Looper;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.util.Log;
import android.util.SparseBooleanArray;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.bumptech.glide.Glide;
import com.bumptech.glide.load.engine.DiskCacheStrategy;
import com.ju.video.R;
import com.ju.video.vendor.hisense.ad.models.Image;

import java.lang.ref.WeakReference;
import java.util.ArrayList;
import java.util.List;

public class ImageSlideView<T extends Image> extends FrameLayout {

    private static final String TAG = ImageSlideView.class.getSimpleName();
    private static final int DEFAULT_GIF_WIDTH = 385;
    private static final int DEFAULT_GIF_HEIGHT = 155;

    private Context ctx;
    private View contentView;
    protected ViewPager vp;
    protected TextView tips;
    protected LinearLayout llDot;
    private int count;
    private List<View> viewList = new ArrayList<>();
    private boolean isAutoPlay;
    private Handler mainHandler;
    private int currentItem;
    private Animator animatorToLarge;
    private Animator animatorToSmall;
    private SparseBooleanArray isLarge;
    private List<T> mImageBeanList;
    private int dotSize = 12;
    private int dotSpace = 12;
    private int delay = 3000;
    private SlideTask task;

    public ImageSlideView(Context ctx) {
        this(ctx, null);
    }

    public ImageSlideView(Context ctx, AttributeSet attrs) {
        this(ctx, attrs, 0);
    }

    public ImageSlideView(Context ctx, AttributeSet attrs, int defStyleAttr) {
        super(ctx, attrs, defStyleAttr);
        this.ctx = ctx;
        mainHandler = new Handler(Looper.getMainLooper());

        // 初始化View
        initView();
        // 初始化Animator
        initAnimator();
        // 初始化数据
        initData();
    }

    private void initData() {
        mImageBeanList = new ArrayList<>();
    }

    private void initAnimator() {
        animatorToLarge = AnimatorInflater.loadAnimator(ctx, android.R.animator.fade_out);
        animatorToSmall = AnimatorInflater.loadAnimator(ctx, android.R.animator.fade_in);
    }

    /**
     * 初始化View
     */
    private void initView() {
        contentView = LayoutInflater.from(ctx).inflate(R.layout.video_layout_image_slide, this, true);
        vp = (ViewPager) findViewById(R.id.video_vp_image_title);
        tips = (TextView) findViewById(R.id.video_tv_pause_tips);
        llDot = (LinearLayout) findViewById(R.id.video_ll_dot);
    }

    // 设置小圆点的大小
    protected void setDotSize(int dotSize) {
        this.dotSize = dotSize;
    }

    // 设置小圆点的间距
    protected void setDotSpace(int dotSpace) {
        this.dotSpace = dotSpace;
    }

    // 设置图片轮播间隔时间
    protected void setDelay(int delay) {
        this.delay = delay;
    }

    // 设置图片和标题的JavaBean数据列表
    protected void setDatas(List<T> list) {
        this.mImageBeanList = list;
    }

    // 设置完后最终提交
    protected void commit() {
        if (ctx == null) {
            Log.e(TAG, "context已空，释放实例");
            return;
        }
        if (mImageBeanList != null) {
            count = mImageBeanList.size();
            // 设置ViewPager
            setViewPager(mImageBeanList);
            // 设置指示器
            setIndicator();
            // 设置tips
            setTips();
            // 开始播放
            starPlay();
        } else {
            Log.e(TAG, "数据为空");
        }
    }

    /**
     * 设置指示器
     */
    private void setIndicator() {
        isLarge = new SparseBooleanArray();
        // 记得创建前先清空数据，否则会受遗留数据的影响。
        llDot.removeAllViews();
        for (int i = 0; i < count; i++) {
            View view = new View(ctx);
            view.setBackgroundResource(0);
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(dotSize, dotSize);
            layoutParams.leftMargin = dotSpace / 2;
            layoutParams.rightMargin = dotSpace / 2;
            layoutParams.topMargin = dotSpace / 2;
            layoutParams.bottomMargin = dotSpace / 2;
            llDot.addView(view, layoutParams);
            isLarge.put(i, false);
        }
        llDot.getChildAt(0).setBackgroundResource(0);
        animatorToLarge.setTarget(llDot.getChildAt(0));
        animatorToLarge.start();
        isLarge.put(0, true);
    }

    /**
     * 设置提示语
     */
    private void setTips() {
        tips.setText(R.string.video_tips_close_ad_pause);
    }

    /**
     * 开始自动播放图片
     */
    private void starPlay() {
        // 如果少于2张就不用自动播放了
        if (count < 2) {
            isAutoPlay = false;
        } else {
            isAutoPlay = true;
            task = new SlideTask(this);
            mainHandler.postDelayed(task, delay);
        }
    }

    private static class SlideTask implements Runnable {

        private WeakReference<ImageSlideView> ref;
        public SlideTask(ImageSlideView view) {
            ref = new WeakReference<ImageSlideView>(view);
        }

        @Override
        public void run() {
            ImageSlideView view = ref.get();
            if (view == null) {
                Log.e(TAG, "SlideTask run: return cause ref get null");
                return;
            }
            if (view.isAutoPlay) {
                // 位置循环
                view.currentItem = view.currentItem % (view.count + 1) + 1;
                // 正常每隔3秒播放一张图片
                view.vp.setCurrentItem(view.currentItem);
                view.mainHandler.postDelayed(view.task, view.delay);
            } else {
                // 如果处于拖拽状态停止自动播放，会每隔5秒检查一次是否可以正常自动播放。
                view.mainHandler.postDelayed(view.task, 5000);
            }
        }
    };

    // 创建监听器接口
    public interface OnItemClickListener {
        void onItemClick(View view, int position);
    }

    // 声明监听器
    private OnItemClickListener onItemClickListener;

    // 提供设置监听器的公共方法
    public void setOnItemClickListener(OnItemClickListener listener) {
        onItemClickListener = listener;
    }

    class ImageTitlePagerAdapter extends PagerAdapter {

        private List<T> imageTitleList;

        public ImageTitlePagerAdapter(List<T> imageTitleList) {
            this.imageTitleList = imageTitleList;
        }

        @Override
        public int getCount() {
            return viewList.size();
        }

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

        @Override
        public Object instantiateItem(ViewGroup container, int pos) {
            if (pos >= viewList.size()) {
                pos = viewList.size() - 1;
            }
            final int position = pos;
            View view = viewList.get(position);
            // 设置Item的点击监听器
            view.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View v) {
                    // 位置是position-1, 还原业务层data list的position
                    if (null != onItemClickListener) {
                        onItemClickListener.onItemClick(v, position - 1);
                    }

                    T image = null;
                    if (position -1 < mImageBeanList.size()) {
                        image = imageTitleList.get(position - 1);
                    }
                    Log.d(TAG, "-- image onEnter(): image = " + image);

                }
            });
            container.addView(view);
            return view;
        }

        @Override
        public void destroyItem(ViewGroup container, int pos, Object object) {
            if (pos >= viewList.size()) {
                pos = viewList.size() - 1;
            }
            final int position = pos;
            container.removeView(viewList.get(position));
        }
    }

    /**
     * 设置ViewPager
     *
     * @param list mImageBeanList
     */
    private void setViewPager(List<T> list) {
        // 设置View列表
        createViewList(list);
        vp.setAdapter(new ImageTitlePagerAdapter(list));
        // 从第1张图片开始（位置刚好也是1，注意：0位置现在是最后一张图片）
        currentItem = 1;
        vp.setCurrentItem(1);
        vp.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            }

            @Override
            public void onPageSelected(int position) {
                // 遍历一遍子View，设置相应的背景。
                for (int i = 0; i < llDot.getChildCount(); i++) {
                    if (i == position - 1) {// 被选中
                        llDot.getChildAt(i).setBackgroundResource(0);
                        if (!isLarge.get(i)) {
                            animatorToLarge.setTarget(llDot.getChildAt(i));
                            animatorToLarge.start();
                            isLarge.put(i, true);
                        }
                    } else {// 未被选中
                        llDot.getChildAt(i).setBackgroundResource(0);
                        if (isLarge.get(i)) {
                            animatorToSmall.setTarget(llDot.getChildAt(i));
                            animatorToSmall.start();
                            isLarge.put(i, false);
                        }
                    }
                }

                T image = null;
                if (position -1 < mImageBeanList.size()) {
                    image = mImageBeanList.get(position - 1);
                }
                Log.d(TAG, "-- image onShow(): image = " + image);
            }

            @Override
            public void onPageScrollStateChanged(int state) {
                switch (state) {
                    // 闲置中
                    case ViewPager.SCROLL_STATE_IDLE:
                        // “偷梁换柱”
                        if (vp.getCurrentItem() == 0) {
                            vp.setCurrentItem(count, false);
                        } else if (vp.getCurrentItem() == count + 1) {
                            vp.setCurrentItem(1, false);
                        }
                        currentItem = vp.getCurrentItem();
                        isAutoPlay = true;
                        break;
                    // 拖动中
                    case ViewPager.SCROLL_STATE_DRAGGING:
                        isAutoPlay = false;
                        break;
                    // 设置中
                    case ViewPager.SCROLL_STATE_SETTLING:
                        isAutoPlay = true;
                        break;
                }
            }
        });
    }

    /**
     * 根据出入的数据设置View列表
     *
     * @param imageList mImageBeanList
     */
    private void createViewList(List<T> imageList) {
        viewList.clear();
        for (int i = 0; i < count + 2; i++) {
            View view = LayoutInflater.from(ctx).inflate(R.layout.video_layout_image_pause, null);
            ImageView ivImage = (ImageView) view.findViewById(R.id.video_iv_page_image);
            // TextView tvTitle = (TextView) view.findViewById(R.id.video_tv_page_title);

            int fixIndex;
            if (i == 0) {// 将最前面一页设置成本来最后的那页
                fixIndex = count - 1;
            } else if (i == count + 1) {// 将最后面一页设置成本来最前的那页
                fixIndex = 0;
            } else {
                fixIndex = i - 1;
            }
            T image = imageList.get(fixIndex);
            String url = image.url;

            if (url.endsWith(".gif")) {
                int width = image.specWidth;
                int height = image.specHeight;
                if (width <= 0 || height <= 0) {
                    width = DEFAULT_GIF_WIDTH;
                    height = DEFAULT_GIF_HEIGHT;
                }
                Glide.with(ctx)
                        .load(url)
                        .asGif()
                        .diskCacheStrategy(DiskCacheStrategy.SOURCE)
                        .override(width, height)
                        .into(ivImage);
            } else {
                Glide.with(ctx)
                        .load(url)
                        .diskCacheStrategy(DiskCacheStrategy.SOURCE)
                        .centerCrop()
                        .into(ivImage);
            }

            // 将设置好的View添加到View列表中
            viewList.add(view);
        }
    }

    /**
     * 释放轮播动画
     */
    protected void stop() {
        cancelAnims();
        mainHandler.removeCallbacksAndMessages(null);
    }

    private void cancelAnims() {
        animatorToLarge.cancel();
        animatorToSmall.cancel();
    }

    /**
     * 释放资源, 实例对象不再使用
     */
    protected void releaseResource() {
        ctx = null;
        mImageBeanList.clear();
    }
}

slide layout:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/video_layout_pause"
    android:layout_gravity="center"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <android.support.v4.view.ViewPager
        android:id="@+id/video_vp_image_title"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:gravity="center_horizontal"/>

    <!--自定义Indicator-->
    <LinearLayout
        android:id="@+id/video_ll_dot"
        android:visibility="gone"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="192dp"
        android:gravity="center"
        android:orientation="horizontal">
    </LinearLayout>

    <TextView
        android:id="@+id/video_tv_pause_tips"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/video_vp_image_title"
        android:layout_marginTop="10dp"
        android:layout_centerHorizontal="true"
        android:gravity="center_horizontal"
        android:shadowColor="#FF000000"
        android:shadowDx="2"
        android:shadowDy="2"
        android:shadowRadius="2"
        android:textColor="@android:color/white"
        android:textSize="18sp"/>
</RelativeLayout>

user case: with state machine

public class ADPauseView extends ImageSlideView<Image> implements IADImageView {

    private static final String TAG = IADImageView.TAG;
    private static final int PAUSE_WIDTH_1153 = 1153;
    private static final int PAUSE_HEIGHT_1153 = 559;
    private static final int PAUSE_MARGIN_LEFT_1153 = 384;
    private static final int PAUSE_MARGIN_TOP_1153 = 218;

    private static final int PAUSE_WIDTH_680 = 680;
    private static final int PAUSE_HEIGHT_680 = 680;
    private static final int PAUSE_MARGIN_LEFT_680 = 620;
    private static final int PAUSE_MARGIN_TOP_680 = 162;

    private Context mContext;
    private ImageADList mADList = new ImageADList(Constants.AD_TYPE_PAUSE);
    private int mState = IADImageView.STATE_IDLE;
    private IADEventListener mlistener;

    public ADPauseView(Context context) {
        this(context, null);
    }

    public ADPauseView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public ADPauseView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mContext = context;
    }

    @Override
    public void setParameter(ImageADList adList) {
        this.setLayoutParams(new LayoutParams(MATCH_PARENT, MATCH_PARENT, Gravity.CENTER));

        RelativeLayout.LayoutParams vpParams = null;
        if (adList == null || !adList.hasDetail()) {
            vpParams = new RelativeLayout.LayoutParams(PAUSE_WIDTH_1153, PAUSE_HEIGHT_1153);
        } else {
            // set vp LayoutParams depends on AD's params
            final Image image = adList.get(0);
            float ratio = image.getRatio();
            Log.d(TAG, "pause setParameter --> ratio = " + ratio);

            if (ratio > 0 && ratio < 1.53) {
                // 680 * 680
                vpParams = new RelativeLayout.LayoutParams(PAUSE_WIDTH_680, PAUSE_HEIGHT_680);
            } else {
                // 1153 * 559
                vpParams = new RelativeLayout.LayoutParams(PAUSE_WIDTH_1153, PAUSE_HEIGHT_1153);
            }
        }

        if (vp != null) {
            vp.setLayoutParams(vpParams);
        }
    }

    @Override
    public void setEventListener(IADEventListener listener) {
        mlistener = listener;
    }

    @Override
    public void setData(ImageADList list) {
        Log.d(TAG, "setData --> type = " + Tools.getADTypeString(mADList.adType) + ", list = " + list);
        if (list != null) {
            mADList.set(list);
        }
    }

    @Override
    public boolean isShowing() {
//        return this.getVisibility() == VISIBLE;
        return mState == IADImageView.STATE_VISIBLE;
    }

    /**
     * call by wrapper
     * @param list can be null. if null, use the cache mADList
     */
    @Override
    public boolean show(ImageADList list) {
        Log.d(TAG, "show --> type = " + Tools.getADTypeString(mADList.adType) + ", isShowing = " + isShowing() + ", list = " + list);
        if (list != null) {
            mADList.set(list);
        }
        if (isShowing()) {
            return false;
        } else {
            if (mADList.hasDetail()) {
                mState = IADImageView.STATE_VISIBLE;
                this.setVisibility(VISIBLE);
                setDatas(mADList);
                commit();
                Log.i(TAG, "-- show done --> type = " + Tools.getADTypeString(mADList.adType) + ", state = " + Tools.getADViewStateStr(mState));
                if (mlistener != null) {
                    mlistener.onShow(mADList.get(0));
                }
                return true;
            }
        }
        return false;
    }

    @Override
    public boolean resume() {
        Log.d(TAG, "resume --> type = " + Tools.getADTypeString(mADList.adType) + ", state = " + Tools.getADViewStateStr(mState)
                + ", pre list = " + mADList);
        if (mState == IADImageView.STATE_HIDE && mADList.hasDetail()) {
            mState = IADImageView.STATE_VISIBLE;
            this.setVisibility(VISIBLE);
            setDatas(mADList);
            commit();
            Log.i(TAG, "-- resume done --> type = " + Tools.getADTypeString(mADList.adType) + ", state = " + Tools.getADViewStateStr(mState));
            if (mlistener != null) {
                mlistener.onResume(mADList.get(0));
            }
            return true;
        }
        return false;
    }

    @Override
    public boolean enter() {
        Log.d(TAG, "enter --> performClick, type = " + Tools.getADTypeString(mADList.adType) + ", isShowing = " + isShowing());
        if (isShowing() && mADList.hasDetail()) {
            this.performClick();
            if (mlistener != null) {
                mlistener.onEnter(mADList.get(0));
            }
            return true;
        }
        return false;
    }

    @Override
    public boolean hide() {
        Log.d(TAG, "hide --> type = " + Tools.getADTypeString(mADList.adType) + ", isShowing = " + isShowing());
        if (isShowing() && mADList.hasDetail()) {
            mState = IADImageView.STATE_HIDE;
            this.setVisibility(INVISIBLE);
            stop();
            Log.i(TAG, "-- hide done --> type = " + Tools.getADTypeString(mADList.adType) + ", state = " + Tools.getADViewStateStr(mState));
            if (mlistener != null) {
                mlistener.onHide(mADList.get(0));
            }
            return true;
        }
        return false;
    }

    @Override
    public boolean cancel() {
        Log.d(TAG, "cancel --> type = " + Tools.getADTypeString(mADList.adType) + ", state = " + Tools.getADViewStateStr(mState));
        if (Tools.isADShowbackState(mState) && mADList.hasDetail()) {
            mState = IADImageView.STATE_GONE;
            stop();
            this.setVisibility(GONE);
            Log.i(TAG, "-- cancel done --> type = " + Tools.getADTypeString(mADList.adType) + ", state = " + Tools.getADViewStateStr(mState));
            if (mlistener != null) {
                mlistener.onSkip(mADList.get(0));
            }
            mADList.reset();
            return true;
        }
        return false;
    }

    @Override
    public void reset() {
        Log.d(TAG, "reset --> type = " + Tools.getADTypeString(mADList.adType));
        mState = IADImageView.STATE_IDLE;
        mlistener = null;
        cancel();
        releaseResource();
        this.setVisibility(GONE);
        mADList.reset();
        Log.i(TAG, "-- reset done --> type = " + Tools.getADTypeString(mADList.adType) + ", state = " + Tools.getADViewStateStr(mState));
    }

    @Override
    protected void onAttachedToWindow() {
        super.onAttachedToWindow();
        Log.d(TAG, "-- onAttachedToWindow type = " + Tools.getADTypeString(mADList.adType));
    }

    @Override
    protected void onDetachedFromWindow() {
        super.onDetachedFromWindow();
        Log.d(TAG, "-- onDetachedFromWindow type = " + Tools.getADTypeString(mADList.adType));
    }
}

起个昵称那么难
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 实现无限轮播_使用Vue制作图片轮播组件思路详解
weixin_33942142的博客
12-29 2595
之前一直都没有认真的写过一个组件。以前在写业务代码的过程中，都是用的别人封装好的组件，这次尝试着写了一个图片轮播组件，虽然比不上知名的轮播组件，但它的功能基本完整，而且在写这个组件的过程中，学的东西也很多，在这里也给大家分享出来，如有疏漏，欢迎指正！在制作这个组件之前，笔者google了不少关于轮播的文章，发现实现一个轮播的思路虽然各有不同，但是大的逻辑其实差不多，本文主要依据慕课网上焦点轮播图特...
Android 实现图片轮播的三种方法，移动开发平台
m0_66145114的博客
01-28 3626
} @Override public void handleMessage(Message msg) { super.handleMessage(msg); Log.d(LOG_TAG, "receive message " + msg.what); MainActivity activity = weakReference.get(); if (activity==null){ //Activity已经回收，无需再处理UI了 return ; } //检查消息队列并移除未发送的消息，这主要是避免在复杂环境
Android--图片轮播（banner）
超宇的博客
01-09 3万+
推荐第三方框架banner，地址：https://github.com/youth5201314/banner 使用步骤 Step 1.依赖banner Gradle dependencies{ compile 'com.youth.banner:banner:1.4.10' //最新版本 } 或者引用本地lib compile project(':banne...
无限轮播图 三种实现方式
Dr的专栏
07-05 4811
无限轮播图三种实现方式：（源码地址） 1、首尾相接方式： https://github.com/jakajacky/DRScrollerView 2、imageView复用方式： https://github.com/jakajacky/DRImgScrollView 3、UICollectionView实现方式 h
Android的轮播图Banner之本地加载和网络加载图片(含demo)
吕氏春秋i
06-07 2万+
前言 关于轮播图 我个人是比较喜欢 闲来无事的时候 可以整理自己的照片 做一个demo 看看动态的效果 挺不错的！ 每个App也基本都有一些广告位置 只要打开这个页面就会无限轮播广告图片 看多了我们也会记得这个效果 那么他是怎么实现的呢？今天我就学习了一下 写了一个demo来练练手 先看效果图 导入依赖的包 版本可自行调整 我用的是1.4.10 里面的动画Animation 和...
android 图片文字轮播效果（图片和文字自动滚动）
许佳佳的博客
10-04 1万+
图片轮播是类似知乎日报上的一个轮播效果，如下图。         好了直接进入正题，首先是出示一下效果：     MainActivity：   import java.util.ArrayList; import java.util.List; import java.util.concurrent.Executors; import java.util.concu...
Android实现BannerLayout图文轮播功能
08-27
主要为大家详细介绍了Android实现BannerLayout图文轮播功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
Android-TextViewDemo图文混排
08-12
安卓实现关键字加红，点击字体打电话，textview斜体，电商删除线，绿色下划线，图片（表情，图文混排）
Android代码-Spinner图文混排源码.zip
08-02
Spinner图文混排源码.zip
Now-Android 图文精选 app
04-06
Now是一款Jsoup + MaterialViewPager + RxJava2 + Retrofit + Lifecycle + Realm + Fresco + Retrolambda example Android 图文精选 app，通过抓取网页获得图文列表。目前包含猫弄（MONO）早午茶、站酷（Zcool）精选...
Android图片轮播列表的实现
csdncaoguo940713的博客
06-04 5047
这个效果在交友app中比较常见
自定义轮播图，实现无限轮播、自动轮播、按下停止轮播
brave_shine的博客
05-22 2330
本文将所有轮播图的功能实现全放在了自定义ViewPager中，若你的ViewPager需要实现轮播功能，只需要将ViewPager替换为CycleViewPager（注：本文V4包为低版本，如需要，请自行将监听更改为addOnPagechangeListener）。 主页面代码与正常使用ViewPager一致，演示采用的是在代码中实例CycleViewPager对象。
Android开发自定义Banner实现图片无限轮播效果
weixin_44965650的博客
12-06 1519
之前做过的很多项目都用到了 Banner，不过每次项目做完都忘了总结导致每次要实现 Banner 效果都要上网查，网上的文章真的是鱼龙混杂，因此今天花点时间好好总结一下实现 Banner 的原理。 首先我们来看看要实现的效果： 实现 Banner 的思路很简单，其本质就是封装了一个 ViewPager，然后用定时任务来控制 ViewPager 的位置，再给 ViewPager 设置一个监听器，当页面改变时控制下面指示器的变化即可。 因此我们分为两个大的步骤：用 ViewPager 实现轮播效果 和 添加底
图片无限轮播
ZeroOnet的博客
09-25 478
在这篇文章中提到了实现图片无限轮播的方法有两种，分别是⌈前后+1法⌋ 和⌈瞒天过海法⌋，小码哥也开源了关于后者的框架。在这里笔者将通过一个小小Demo演示一下前者的实现，Demo可以在这里找到。若觉代码“粗糙”，还请见谅！注：此处是SDCycleScrollView框架源码，是使用比较广泛的无限轮播视图框架，包含了一些个性化的功能：自定义UIPageController、文字滚动等等，这里作为扩展资
四种方式实现轮播图
wulixiaoxiao1的博客
02-26 2万+
转载自：http://www.jianshu.com/p/bd1f34e7e953 不论是app，还是网站，基本上都会出现轮播图，今天和大家分享几种不同工具实现轮播图的几种方式。 轮播图的基本样式和功能就不需要解释了，相信能根据题目选择看文章的话都知道啥是轮播图，如果哪位读者老爷真的让非要我解释一下啥是轮播图，求您饶了在下吧，真心词穷~ 为了方便大家观看，我把css，
Android开发-轮播图的详细实现
热门推荐
GYongJia的博客
04-28 3万+
实现不添加任何依赖自己实现轮播图，使用ViewPager和布局容器来实现轮播的功能 综合了网上几位博主的文章，这里提供最直接最明了的实现。 实现效果如下，这里只是简单的实现，以后有机会再改进，也欢迎大家来指导我。 1. 万事先改布局呗，activity_main.xml： <FrameLayout xmlns:android="http://schemas.android.com/...
如何实现图片无限滚动的效果
独行者
01-17 1908
                                        简单实现图片无限滚动的方法 作者：植旭苗         首先，在源代码的轮播部分按照顺序添加图片，添加了以后，查看效果，就会出现轮播中断这种情况， 那么，到底是在哪个部分出错了呢？其实并不是代码错误的问题，而是忽略了关键的部分，具体漏掉的图片位置如下图：         从第一张图片开始，向后面点击轮播按...
Android轮播图实现
goodbranch的博客
07-17 1557
一个可以无限循环的轮播LoopSwitchView，在ViewPager的基础上加上Handler让他可以自动滚动。
AndroidWiki - ViewGroup等比例缩放子view
BlueYangDroid的专栏
03-05 2870
大小屏监听，及等比例缩放子view private void getScreenSize() { int[] screenSize = Tools.getScreenSize(mContext); if (screenSize.length &gt;= 2) { SCREEN_WIDTH = screenSize[0]; ...
vue-quill-editor 图文粘贴 图片不显示
最新发布
08-23
在使用`vue-quill-editor`进行图文粘贴时，复制的图片实际上以base64的形式进行上传。然而，将base64写进数据库并不是一个好的做法。因此，解决思路是将复制的图片上传至服务器，然后将服务器返回的图片地址作为img...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值