美文网首页新的开始自定义控件Android开发
Android RecylerView完美实现瀑布流 图片高度自

Android RecylerView完美实现瀑布流 图片高度自

作者: 鹏城十八少 | 来源:发表于2021-06-29 08:05 被阅读0次

    网上很多博客写的有问题,比如:闪烁,留白,错位。高度无法自适应。5分钟教会你。

    今天开始讲RecycleView的系列教程。分割线,分组,局部刷新,动态添加,缓存原理,抖音效果,瀑布流。嵌套,动画等等

    今天主要讲解如何使用StaggeredGridLayoutManager来实现瀑布流

    瀑布流效果,RecyclerView设置的layoutManager必须是StaggeredGridLayoutManager

    瀑布流支持功能

    1.控制每行个数,gridlayoutmanager,瀑布流没有

    2.瀑布流多类型,瀑布流和其他类型占用一行混合

    3.高度自适应,等宽不等高 ,高度自适应:要用图片glide才行

    4.分割线问题:DividerGridItemDecoration

    5.上拉加载数据

    6.下拉刷新

    7.点赞和关注:数据更新,但是刷新只刷新单个

    自适应高度:

    1.通过glide加载

    Glide.with(context).load(articleFeed.getImages().get(0)).placeholder(R.mipmap.default_por_hold).into(iv_item);

    2.图片的方式

        android:id="@+id/iv_icon"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:scaleType="fitXY"

        android:src="@mipmap/default_por_hold"

        android:visibility="visible"

        android:adjustViewBounds="true"

        app:layout_constraintLeft_toLeftOf="parent"

        app:layout_constraintRight_toRightOf="parent"

        app:layout_constraintTop_toTopOf="parent" />

    3.多类型是否占用一行

    @Override

    public void onViewAttachedToWindow(BaseViewHolder holder) {

    super.onViewAttachedToWindow(holder);

        if(holder==null){

    return;

        }

    int type = holder.getItemViewType();

        if (type !=HomePageMultipleCard.HOMEPAGE_MULTIPLE_CARD_TYPE_FITNESS_FEED) {

    ViewGroup.LayoutParams lp = holder.itemView.getLayoutParams();

            if (lpinstanceof StaggeredGridLayoutManager.LayoutParams) {

    StaggeredGridLayoutManager.LayoutParams p =

    (StaggeredGridLayoutManager.LayoutParams) lp;

                p.setFullSpan(true);

            }

    }

    }

    4. 每行的个数

    @Override

    protected RecyclerView.LayoutManager getLayoutManger(Context context) {

    return new FastStaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);

    }

    源代码:

    publicclassMainActivityextendsAppCompatActivity{

    @Override

    protectedvoidonCreate(BundlesavedInstanceState) {

    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

    List<News>newsList=newArrayList();

    newsList.add(newNews("新闻标题1",R.drawable.img01));

    newsList.add(newNews("新闻标题2",R.drawable.img02));

    newsList.add(newNews("新闻标题3",R.drawable.img01));

    newsList.add(newNews("新闻标题4",R.drawable.img02));

    newsList.add(newNews("新闻标题5",R.drawable.img01));

    newsList.add(newNews("新闻标题6",R.drawable.img02));

    newsList.add(newNews("新闻标题7",R.drawable.img01));

    newsList.add(newNews("新闻标题8",R.drawable.img02));

    newsList.add(newNews("新闻标题9",R.drawable.img01));

    newsList.add(newNews("新闻标题10",R.drawable.img02));

    NewsAdapternewsAdapter=newNewsAdapter(newsList);

    RecyclerViewview=findViewById(R.id.list1);

    StaggeredGridLayoutManagerlayoutManager=newStaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);

    view.setLayoutManager(layoutManager);

    view.setAdapter(newsAdapter);

        }

    publicclassHomePageCardFitnessFeed{

    publicstaticfinalStringFROM_TYPE="feed_ai";

    privateContextcontext;

    publicvoidbindView(finalContextcontext,BaseViewHolderhelper,

    finalHomePageMultipleCarditem) {

    articleFeed=item.articleFeed;

    this.context=context;

    if(articleFeed==null) {

    return;

            }

    if(!EventBus.getDefault().isRegistered(this)) {

    EventBus.getDefault().register(this);

            }

    ImageViewiv_item=helper.getView(R.id.iv_icon);

    iv_item.setOnClickListener(newView.OnClickListener() {

    @Override

    publicvoidonClick(Viewv) {

    ActivityPostDetail.openActivity((ActivitySportBase)context, (int)articleFeed.getTopic_id(),FROM_TYPE,articleFeed);

    FeedReport.reportFeedTopicId(FeedReport.kclickFeedEventId,articleFeed.getTopic_id());

                }

            });

    if(articleFeed.getImages()!=null&&articleFeed.getImages().size()>0) {

    Glide.with(context).load(articleFeed.getImages().get(0)).placeholder(R.mipmap.default_por_hold).into(iv_item);

            }

    @Override

    publicvoidonViewAttachedToWindow(BaseViewHolderholder) {

    super.onViewAttachedToWindow(holder);

    if(holder==null){

    return;

            }

    inttype=holder.getItemViewType();

    if(type!=HomePageMultipleCard.HOMEPAGE_MULTIPLE_CARD_TYPE_FITNESS_FEED) {

    ViewGroup.LayoutParamslp=holder.itemView.getLayoutParams();

    if(lpinstanceofStaggeredGridLayoutManager.LayoutParams) {

    StaggeredGridLayoutManager.LayoutParamsp=

    (StaggeredGridLayoutManager.LayoutParams)lp;

    p.setFullSpan(true);

                }

            }

        }

    @Override

    protectedvoidconvert(BaseViewHolderhelper,HomePageMultipleCarditem) {

    item.setSportMode(sportMode);

    switch(item.itemType) {

    caseHomePageMultipleCard.HOMEPAGE_MULTIPLE_CARD_TYPE_AD:

    bindADView(helper,item);

    @Override

    protectedRecyclerView.LayoutManagergetLayoutManger(Contextcontext) {

    returnnewFastStaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL);

        }

    @Override

    protectedbooleanneedAddFootView() {

    returnfalse;

        }

    @Override

    protectedbooleanneedDecoration() {

    returntrue;

        }

    @Override

    protectedbooleanneedLoadMore() {

    returntrue;

        }

    @Override

    protectedvoidinitData(@NullableBundlesavedInstanceState) {

    initPresenter();

    网上用的方案:错误的

    动态给控件设置宽和高的办法:但是没有必要的。不够智能

    ConstraintLayout.LayoutParams lp = (ConstraintLayout.LayoutParams) iv_item.getLayoutParams();

    int

    height = new Random().nextInt(10);

    height = DensityUtil.dip2px(context, 330) + height * 30;

    int

    width=ScreenUtils.getScreenWidth(context) / 2;

    lp.height = height;

    lp.width = width;

    YDLog.logDebeg("HomePageCardFitnessFeed","height:"+height+"width:"+width);

    iv_item.setLayoutParams(lp);

    首先分析GL,它是继承LineaLayoutManager的,也就是线性有的它都有

    GridLayoutManager和StaggeredGridLayoutManager的区别

    demo地址:https://github.com/pengcaihua123456/shennandadao

    相关文章

      网友评论

        本文标题:Android RecylerView完美实现瀑布流 图片高度自

        本文链接:https://www.haomeiwen.com/subject/mmblultx.html