1. <strong id="7actg"></strong>
    2. <table id="7actg"></table>

    3. <address id="7actg"></address>
      <address id="7actg"></address>
      1. <object id="7actg"><tt id="7actg"></tt></object>

        Android仿小紅書圖片自動滾動效果

        共 6574字,需瀏覽 14分鐘

         ·

        2021-09-17 04:00

        今天來跟大家探討一下,如何實現(xiàn)長圖片自動循環(huán)滾動效果(仿小紅書),板凳準(zhǔn)備好,來圍觀啦!

        效果圖


        實現(xiàn)思路

        滾動效果用RecyclerView實現(xiàn)。RecyclerView有個smoothScrollToPosition方法,可以滾動到指定位置(有滾動效果,不是直接到指定位置),不了解的看這里RecycleView4種定位滾動方式演示。每一個Item是一張長圖,這樣首尾相接滾動起來(滾到無限遠(yuǎn))就是無限循環(huán)的效果,然后再改變滾動的速度,就可以了。
        public class MainActivity extends AppCompatActivity {
        private RecyclerView mRecyclerView;
        @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);
        //全屏 getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.activity_main);
        mRecyclerView = findViewById(R.id.mRecyclerView); mRecyclerView.setAdapter(new SplashAdapter(MainActivity.this)); mRecyclerView.setLayoutManager(new ScollLinearLayoutManager(MainActivity.this));
        //smoothScrollToPosition滾動到某個位置(有滾動效果) mRecyclerView.smoothScrollToPosition(Integer.MAX_VALUE / 2); }}

        1、無限循環(huán)

        將RecyclerView的Item數(shù)量設(shè)置成很大的值,
        用smoothScrollToPosition方法滾到很遠(yuǎn)的位置,
        就能實現(xiàn)這樣的效果,很多banner輪播圖的實現(xiàn)也是如此;
        public class SplashAdapter extends RecyclerView.Adapter<SplashAdapter.ViewHolder> {
        private int imgWidth;

        public SplashAdapter(Context context) { imgWidth = EasyUtil.getScreenWidth(context); }
        @Override public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_splash, parent, false); return new ViewHolder(itemView); }
        @Override public void onBindViewHolder(final ViewHolder holder, final int position) { /* ViewGroup.LayoutParams lp = holder.item_bg.getLayoutParams(); lp.width = imgWidth; lp.height =imgWidth*5; holder.item_bg.setLayoutParams(lp);*/ }
        @Override public int getItemCount() { return Integer.MAX_VALUE; }
        public class ViewHolder extends RecyclerView.ViewHolder {
        ImageView item_bg;
        public ViewHolder(final View itemView) { super(itemView); item_bg = itemView.findViewById(R.id.item_bg);        }    }}

        2、控制smoothScrollToPosition的滑動速度

        參考RecyclerView調(diào)用smoothScrollToPosition() 控制滑動速度,
        修改MILLISECONDS_PER_INCH的值即可
        /** * 更改RecyclerView滾動的速度 */public class ScollLinearLayoutManager extends LinearLayoutManager {    private float MILLISECONDS_PER_INCH = 25f;  //修改可以改變數(shù)據(jù),越大速度越慢    private Context contxt;
        public ScollLinearLayoutManager(Context context) { super(context); this.contxt = context; }

        @Override public void smoothScrollToPosition(RecyclerView recyclerView, RecyclerView.State state, int position) { LinearSmoothScroller linearSmoothScroller = new LinearSmoothScroller(recyclerView.getContext()) { @Override public PointF computeScrollVectorForPosition(int targetPosition) { return ScollLinearLayoutManager.this .computeScrollVectorForPosition(targetPosition); }
        @Override protected float calculateSpeedPerPixel (DisplayMetrics displayMetrics) { return MILLISECONDS_PER_INCH / displayMetrics.density; //返回滑動一個pixel需要多少毫秒 }
        }; linearSmoothScroller.setTargetPosition(position); startSmoothScroll(linearSmoothScroller); }
        //可以用來設(shè)置速度 public void setSpeedSlow(float x) { //自己在這里用density去乘,希望不同分辨率設(shè)備上滑動速度相同 //0.3f是自己估摸的一個值,可以根據(jù)不同需求自己修改 MILLISECONDS_PER_INCH = contxt.getResources().getDisplayMetrics().density * 0.3f + (x); }
        }

        3、圖片寬度充滿屏幕、高度按圖片原始寬高比例自適應(yīng)
        @SuppressLint("AppCompatCustomView")public class FitImageView extends ImageView {
        public FitImageView(Context context) { super(context); }
        public FitImageView(Context context, AttributeSet attrs) { super(context, attrs); }
        @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){ Drawable drawable = getDrawable();
        if(drawable!=null){ int width = MeasureSpec.getSize(widthMeasureSpec); int height = (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.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="wrap_content">
        <com.next.scrollimagedemo.view.FitImageView android:id="@+id/item_bg" android:layout_width="match_parent" android:layout_height="wrap_content" android:src="@mipmap/ww1" />

        <!-- <ImageView android: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.ConstraintLayout xmlns: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.RecyclerView android:id="@+id/mRecyclerView" android:layout_width="match_parent" android:layout_height="match_parent"></android.support.v7.widget.RecyclerView>
        <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:background="#80000000" android:clickable="true" />
        <ImageView android: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>

        完成效果


        到這里就結(jié)束啦。
        瀏覽 122
        點贊
        評論
        收藏
        分享

        手機掃一掃分享

        分享
        舉報
        評論
        圖片
        表情
        推薦
        點贊
        評論
        收藏
        分享

        手機掃一掃分享

        分享
        舉報
        1. <strong id="7actg"></strong>
        2. <table id="7actg"></table>

        3. <address id="7actg"></address>
          <address id="7actg"></address>
          1. <object id="7actg"><tt id="7actg"></tt></object>
            小嫩逼视频 | 国产成人精品综合久久久久99 | 波多野结衣的三级电影 | 亚欧成人无码 | 少妇放荡的呻吟干柴烈火图片 | 逼逼爱草草 | 久久丫精品 | 99热国产精品 | 青娱乐手机视频 | 久久婷婷婷 |