html中图片自动循环滚动代码,实现长图片自动循环滚动效果[通俗易懂]

实现思路

滚动效果用实现。有个方法，可以滚动到指定位置(有滚动效果，不是直接到指定位置)，不了解的看这里种定位滚动方式演示。每一个Item是一张长图，这样首尾相接滚动起来(滚到无限远)就是无限循环的效果，然后再改变滚动的速度，就可以了。

{;@(){(savedInstanceState);//全屏getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN);setContentView(R.layout.activity_main);mRecyclerView=findViewById(R.id.mRecyclerView);mRecyclerView.setAdapter(newSplashAdapter(MainActivity.this));mRecyclerView.setLayoutManager(newScollLinearLayoutManager(MainActivity.this));//smoothScrollToPosition滚动到某个位置(有滚动效果)mRecyclerView.smoothScrollToPosition(Integer.MAX_VALUE/2);}}

1.无限循环

将RecyclerView的Item数量设置成很大的值，用smoothScrollToPosition方法滚到很远的位置，就能实现这样的效果，很多banner轮播图的实现也是如此；

publicclassSplashAdapterextendsRecyclerView.AdapterSplashAdapter.ViewHolder{privateintimgWidth;publicSplashAdapter(Contextcontext){imgWidth=EasyUtil.getScreenWidth(context);}@OverridepublicViewHolderonCreateViewHolder(ViewGroupparent,intviewType){ViewitemView=LayoutInflater.from(parent.getContext()).inflate(R.layout.item_splash,parent,false);returnnewViewHolder(itemView);}@OverridepublicvoidonBindViewHolder(finalViewHolderholder,finalintposition){/*ViewGroup.LayoutParamslp=holder.item_bg.getLayoutParams();lp.width=imgWidth;lp.height=imgWidth*5;holder.item_bg.setLayoutParams(lp);*/}@OverridepublicintgetItemCount(){returnInteger.MAX_VALUE;}publicclassViewHolderextendsRecyclerView.ViewHolder{ImageViewitem_bg;publicViewHolder(finalViewitemView){super(itemView);item_bg=itemView.findViewById(R.id.item_bg);}}}

2.控制smoothScrollToPosition的滑动速度

参考RecyclerView调用smoothScrollToPosition()控制滑动速度，修改MILLISECONDS_PER_INCH的值即可

/***更改RecyclerView滚动的速度*/publicclassScollLinearLayoutManagerextendsLinearLayoutManager{privatefloatMILLISECONDS_PER_INCH=25f;//修改可以改变数据,越大速度越慢privateContextcontxt;publicScollLinearLayoutManager(Contextcontext){super(context);this.contxt=context;}@OverridepublicvoidsmoothScrollToPosition(RecyclerViewrecyclerView,RecyclerView.Statestate,intposition){LinearSmoothScrollerlinearSmoothScroller=newLinearSmoothScroller(recyclerView.getContext()){@OverridepublicPointFcomputeScrollVectorForPosition(inttargetPosition){returnScollLinearLayoutManager.this.computeScrollVectorForPosition(targetPosition);}@OverrideprotectedfloatcalculateSpeedPerPixel(DisplayMetricsdisplayMetrics){returnMILLISECONDS_PER_INCH/displayMetrics.density;//返回滑动一个pixel需要多少毫秒}};linearSmoothScroller.setTargetPosition(position);startSmoothScroll(linearSmoothScroller);}//可以用来设置速度publicvoidsetSpeedSlow(floatx){//自己在这里用density去乘，希望不同分辨率设备上滑动速度相同//0.3f是自己估摸的一个值，可以根据不同需求自己修改MILLISECONDS_PER_INCH=contxt.getResources().getDisplayMetrics().density*0.3f+(x);}}

3.图片宽度充满屏幕、高度按图片原始宽高比例自适应

@SuppressLint(“AppCompatCustomView”)publicclassFitImageViewextendsImageView{publicFitImageView(Contextcontext){super(context);}publicFitImageView(Contextcontext,AttributeSetattrs){super(context,attrs);}@OverrideprotectedvoidonMeasure(intwidthMeasureSpec,intheightMeasureSpec){Drawabledrawable=getDrawable();if(drawable!=null){intwidth=MeasureSpec.getSize(widthMeasureSpec);intheight=(int)Math.ceil((float)width*(float)drawable.getIntrinsicHeight()/(float)drawable.getIntrinsicWidth());setMeasuredDimension(width,height);}else{super.onMeasure(widthMeasureSpec,heightMeasureSpec);}}}

4.这里需要注意的是、Item的根布局android:layout_height=”wrap_content”，否则图片高度会受限

android.support.constraint.ConstraintLayoutxmlns:android=”http://schemas.android.com/apk/res/android”android:layout_width=”match_parent”android:layout_height=”wrap_content”com.next.scrollimagedemo.view.FitImageViewandroid:id=”@+id/item_bg”android:layout_width=”match_parent”android:layout_height=”wrap_content”android:src=”@mipmap/ww1″/!–ImageViewandroid:id=”@+id/item_bg”android:layout_width=”match_parent”android:layout_height=”wrap_content”android:src=”@mipmap/ww2″android:scaleType=”centerCrop”/–/android.support.constraint.ConstraintLayout

5.使RecyclerView不能手指触碰滑动

加层View屏蔽掉事件就好了

android.support.constraint.ConstraintLayoutxmlns:android=”http://schemas.android.com/apk/res/android”xmlns:app=”http://schemas.android.com/apk/res-auto”xmlns:tools=”http://schemas.android.com/tools”android:layout_width=”match_parent”android:layout_height=”match_parent”tools:context=”.MainActivity”android.support.v7.widget.RecyclerViewandroid:id=”@+id/mRecyclerView”android:layout_width=”match_parent”android:layout_height=”match_parent”/android.support.v7.widget.RecyclerViewTextViewandroid:layout_width=”match_parent”android:layout_height=”match_parent”android:background=”#80000000″android:clickable=”true”/ImageViewandroid:layout_width=”wrap_content”android:layout_height=”80dp”android:layout_marginTop=”80dp”app:layout_constraintTop_toTopOf=”parent”android:scaleType=”centerInside”android:src=”@mipmap/slogan”app:layout_constraintLeft_toLeftOf=”parent”app:layout_constraintRight_toRightOf=”parent”//android.support.constraint.ConstraintLayout

完成效果