iis服务器助手广告
返回顶部
首页 > 资讯 > 移动开发 >同一页面实现recycleView三种布局【recycleView + adapter】
  • 749
分享到

同一页面实现recycleView三种布局【recycleView + adapter】

androidandroidstudiorecycleViewAdapter大前端 2023-09-08 13:09:40 749人浏览 安东尼
摘要

文章目录 🥭🥭简介🥭🥭效果图🥭🥭代码🍎🍎三个Adapter修饰器

文章目录




在这里插入图片描述


🥭🥭简介

分享一下recycleView在同一个页面中(一个recycleView中实现三种不同的布局方式)。三种布局一种是横着划,竖着划和GridView三种布局,代码全部粘在下面了,需要自取。

🍓🍓第一种是竖着滑动,和listView差不多。自我感觉,比ListView复杂。
🍓🍓第二种是横着滑。自我感觉,ListView虽然也可以实现,但是比起RecycleView难度和繁琐度都上了一个等级。这可能也是现在大部分人都用RecycleView的原因之一吧,当然recycleView还有很多优势。
🍓🍓第三种就是gridView布局了,也就是Android中常说的九宫格布局了。

RecycleView它可以实现与ListView和GridView一样的效果,提供了一种插拔式的体验,高度的解耦,异常的灵活,adpter适配器自己定制。只需设置其提供的不同的LayoutManager,ItemAnimator和ItemDecoration,就能实现不同的效果。

🍓🍓 RecyclerView的优点
🍗🍗1、支持局部刷新。
🍗🍗2、可以自定义item增删时的动画。
🍗🍗3、能够实现item拖拽和侧滑删除等功能。
🍗🍗4、默认已实现View的复用,而且回收机制更加完善。



🥭🥭效果图

待写。。。。。。



🥭🥭代码

🍎🍎三个Adapter修饰器

FruitAdapter

package Adapter;import Android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import android.widget.TextView;import androidx.annotation.NonNull;import androidx.recyclerview.widget.RecyclerView;import com.example.layout_test.R;import org.jetbrains.annotations.NotNull;import java.util.List;import domain.FuritBean;public class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder> {    private List<FuritBean> mFruitList;    static class ViewHolder extends RecyclerView.ViewHolder{        private final ImageView mfruitImage;        private final TextView mfruitName;        public ViewHolder(@NonNull @NotNull View view) {            super(view);            mfruitImage=view.findViewById(R.id.mImg1);            mfruitName=view.findViewById(R.id.mTv1);        }    }    public FruitAdapter(List<FuritBean> fruitList){        mFruitList=fruitList;    }    @NonNull    @NotNull    @Override    public ViewHolder onCreateViewHolder(@NonNull @NotNull ViewGroup parent, int viewType) {        View view= LayoutInflater.from(parent.getContext()).inflate(R.layout.recycle_item1,parent,false);        ViewHolder holder=new ViewHolder(view);        return holder;    }    @Override    public void onBindViewHolder(@NonNull @NotNull FruitAdapter.ViewHolder holder, int position) {        FuritBean furit=mFruitList.get(position);        holder.mfruitImage.setImageResource(furit.getImageId());        holder.mfruitName.setText(furit.getName());    }    @Override    public int getItemCount() {        return mFruitList.size();    }}

FruitAdapter2

package Adapter;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import android.widget.TextView;import androidx.annotation.NonNull;import androidx.recyclerview.widget.RecyclerView;import com.example.layout_test.R;import org.jetbrains.annotations.NotNull;import java.util.List;import domain.FuritBean;public class FuritAdapter2 extends RecyclerView.Adapter<FuritAdapter2.ViewHolder> {    private List<FuritBean> mFruitList;    static class ViewHolder extends RecyclerView.ViewHolder{        private final ImageView mfruitImage;        private final TextView mfruitName;        public ViewHolder(@NonNull @NotNull View itemView) {            super(itemView);            mfruitImage= itemView.findViewById(R.id.mImg2);            mfruitName = itemView.findViewById(R.id.mTv2);        }    }    public FuritAdapter2(List<FuritBean> mFruitList) {        this.mFruitList = mFruitList;    }    @NonNull    @Override    public FuritAdapter2.ViewHolder onCreateViewHolder(@NonNull @NotNull ViewGroup parent, int viewType) {        View view= LayoutInflater.from(parent.getContext()).inflate(R.layout.recycle_item2,parent,false);        ViewHolder viewHolder=new ViewHolder(view);        return viewHolder;    }    @Override    public void onBindViewHolder(@NonNull @NotNull FuritAdapter2.ViewHolder holder, int position) {        FuritBean furit=mFruitList.get(position);        holder.mfruitImage.setImageResource(furit.getImageId());        holder.mfruitName.setText(furit.getName());    }    @Override    public int getItemCount() {        return mFruitList.size();    }}

FruitAdapter3

package Adapter;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import android.widget.TextView;import androidx.annotation.NonNull;import androidx.recyclerview.widget.RecyclerView;import com.example.layout_test.R;import org.jetbrains.annotations.NotNull;import java.util.List;import domain.FuritBean;public class FuritAdapter3 extends RecyclerView.Adapter<FuritAdapter3.ViewHolder> {    private List<FuritBean> mFruitList;    static class ViewHolder extends RecyclerView.ViewHolder{        private final ImageView mfruitImage;        private final TextView mfruitName;        public ViewHolder(@NonNull @NotNull View itemView) {            super(itemView);            mfruitImage= itemView.findViewById(R.id.mImg3);            mfruitName = itemView.findViewById(R.id.mTv3);        }    }    public FuritAdapter3(List<FuritBean> mFruitList) {        this.mFruitList = mFruitList;    }    @NonNull    @Override    public FuritAdapter3.ViewHolder onCreateViewHolder(@NonNull @NotNull ViewGroup parent, int viewType) {        View view= LayoutInflater.from(parent.getContext()).inflate(R.layout.recycle_item3,parent,false);        ViewHolder viewHolder=new ViewHolder(view);        return viewHolder;    }    @Override    public void onBindViewHolder(@NonNull @NotNull FuritAdapter3.ViewHolder holder, int position) {        FuritBean furit=mFruitList.get(position);        holder.mfruitImage.setImageResource(furit.getImageId());        holder.mfruitName.setText(furit.getName());    }    @Override    public int getItemCount() {        return mFruitList.size();    }}

三个Adapter修饰器修饰了不同的布局,每一个布局都是单独修饰的,当然也可以放到一个布局里面。下面一篇文章会将所有的布局放在一个Adapter修饰器里面进行。



MainActivity

🍎🍎主界面函数 && FuritBean

package com.example.layout_test;import androidx.appcompat.app.AppCompatActivity;import androidx.recyclerview.widget.GridLayoutManager;import androidx.recyclerview.widget.LinearLayoutManager;import androidx.recyclerview.widget.RecyclerView;import android.Manifest;import android.icu.text.UnicodeSetSpanner;import android.os.Bundle;import android.util.Log;import android.view.View;import android.widget.LinearLayout;import android.widget.TextView;import android.widget.Toast;import com.Google.android.material.tabs.TabLayout;import org.w3c.dom.Text;import java.util.ArrayList;import java.util.List;//import Adapter.AllAdapter;//import Adapter.AllAdapter;import Adapter.FruitAdapter;import Adapter.FuritAdapter2;import Adapter.FuritAdapter3;import domain.FuritBean;public class MainActivity extends AppCompatActivity{    private List<FuritBean> furitBeans= new ArrayList();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initData();                // recycleView  横着滑        RecyclerView recyclerView1=findViewById(R.id.recycle_view1);        LinearLayoutManager layoutManager2=new LinearLayoutManager(this);        layoutManager2.setOrientation(LinearLayoutManager.HORIZONTAL);        recyclerView1.setLayoutManager(layoutManager2);        FuritAdapter2 furitAdapter2=new FuritAdapter2(furitBeans);        recyclerView1.setAdapter(furitAdapter2);        // recycleView  竖着划        RecyclerView recyclerView=findViewById(R.id.recycle_view2);        LinearLayoutManager layoutManager=new LinearLayoutManager(this);        recyclerView.setLayoutManager(layoutManager);        FruitAdapter fruitAdapter=new FruitAdapter(furitBeans);        recyclerView.setAdapter(fruitAdapter);                RecyclerView recyclerView3=findViewById(R.id.recycle_view3);        GridLayoutManager gridLayoutManager=new GridLayoutManager(this,4);        recyclerView3.setLayoutManager(gridLayoutManager);        FuritAdapter3 adapter=new FuritAdapter3(furitBeans);        recyclerView3.setAdapter(adapter);    }    //   数据    private void initData() {        for (int i = 0; i <= 4; i++) {            FuritBean furitBean=new FuritBean("cm",R.drawable.cm);            furitBeans.add(furitBean);            FuritBean furitBean1=new FuritBean("cz",R.drawable.cz);            furitBeans.add(furitBean1);            FuritBean furitBean2=new FuritBean("mht",R.drawable.mht);            furitBeans.add(furitBean2);            FuritBean furitBean3=new FuritBean("nyg",R.drawable.nyg);            furitBeans.add(furitBean3);            FuritBean furitBean4=new FuritBean("pg",R.drawable.pg);            furitBeans.add(furitBean4);            FuritBean furitBean5=new FuritBean("pt",R.drawable.pt);            furitBeans.add(furitBean5);            FuritBean furitBean6=new FuritBean("sl",R.drawable.sl);            furitBeans.add(furitBean6);            FuritBean furitBean7=new FuritBean("yt",R.drawable.yt);            furitBeans.add(furitBean7);        }    }}

FuritBean

package domain;public class FuritBean {    private String name;    private int ImageId;    public String getName() {        return name;    }    public int getImageId() {        return ImageId;    }    public FuritBean(String name, int imageId) {        this.name = name;        ImageId = imageId;    }}


🍎🍎布局文件

activity_main

<LinearLayout 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"    tools:context=".MainActivity"    android:orientation="vertical">    <LinearLayout        android:layout_width="match_parent"        android:layout_height="80dp"        android:orientation="vertical">        <androidx.recyclerview.widget.RecyclerView            android:id="@+id/recycle_view1"            android:layout_width="match_parent"            android:layout_height="match_parent" />    LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="400dp">        <androidx.recyclerview.widget.RecyclerView            android:id="@+id/recycle_view2"            android:layout_width="match_parent"            android:layout_height="match_parent"/>    LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical">        <androidx.recyclerview.widget.RecyclerView            android:id="@+id/recycle_view3"            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginLeft="40dp"/>    LinearLayout>LinearLayout>

recycle_item1

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="horizontal">    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="horizontal">        <ImageView            android:id="@+id/mImg1"            android:layout_width="50dp"            android:layout_height="50dp" />        <TextView            android:id="@+id/mTv1"            android:layout_width="match_parent"            android:layout_height="30dp"            android:gravity="center"            android:layout_gravity="center"/>    LinearLayout>LinearLayout>

recycle_item2

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="match_parent"    android:orientation="vertical">    <LinearLayout        android:layout_width="50dp"        android:layout_height="80dp"        android:orientation="vertical">        <ImageView            android:id="@+id/mImg2"            android:layout_width="50dp"            android:layout_height="50dp" />        <TextView            android:id="@+id/mTv2"            android:layout_width="50dp"            android:layout_height="30dp"            android:gravity="center"/>    LinearLayout>LinearLayout>

recycle_item3

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="vertical">    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="vertical"        android:layout_gravity="center">        <ImageView            android:id="@+id/mImg3"            android:layout_width="50dp"            android:layout_height="50dp" />        <TextView            android:id="@+id/mTv3"            android:layout_width="50dp"            android:layout_height="30dp"            android:gravity="center"            android:textColor="#FFFF0000"/>    LinearLayout>LinearLayout>


🥭🥭资源文件

在这里插入图片描述

嗯~~,就几张照片,放上来还有水印,你们这个照片就自己找找吧。


把上面的代码全部拷贝下来就可以运行出上动态图的结果了。


学Android,来牛客

在刷题之前先介绍一下牛客。Leetcode有的刷题牛客都有,除此之外牛客里面还有招聘(社招和校招)、一些上岸大厂的大佬的面试经验。 牛客是可以伴随一生的编程软件(完全免费),从学校到社会工作,时时刻刻你都可以用到感兴趣的可以去注册试试可以伴随一生的刷题app







觉得有用的可以给个三连,关注一波!!!带你玩转Android

来源地址:https://blog.csdn.net/qq_46906413/article/details/126041813

--结束END--

本文标题: 同一页面实现recycleView三种布局【recycleView + adapter】

本文链接: https://www.lsjlt.com/news/399972.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 同一页面实现recycleView三种布局【recycleView + adapter】
    文章目录 🥭🥭简介🥭🥭效果图🥭🥭代码🍎🍎三个Adapter修饰器...
    99+
    2023-09-08
    android android studio recycleView Adapter 大前端
  • 一个Adapter+recycleview实现多种布局,区分布局中
    文章目录 🍓🍓简述🍓🍓效果图🍓🍓代码🥭🥭AllAdapter.java🥭🥭...
    99+
    2023-08-18
    android java android studio
  • Android移动开发recycleView的页面点击跳转设计实现
    目录一.目的二.具体代码和页面介绍三.仓库代码一.目的 回顾前两次的过程和效果以及本次任务以及最终效果视图: (1)第一次实现界面设计和界面跳转,示例如下: (2)第二次是在页面中...
    99+
    2024-04-02
  • Android移动开发recycleView的页面点击跳转怎么实现
    本文小编为大家详细介绍“Android移动开发recycleView的页面点击跳转怎么实现”,内容详细,步骤清晰,细节处理妥当,希望这篇“Android移动开发recycleView的页面点击跳转怎么实现”文章能帮助大家解决疑惑,下面跟着小...
    99+
    2023-06-30
  • 实现瀑布流布局的三种方式
    前言 今天逛闲鱼的时候观察到每一行的高度不是相同的,经了解才知道原来这是一种瀑布流布局,感觉挺有意思,于是决定研究一下,在网上也找了一些方案,实现瀑布流大概有3种方式。 一、JS 实...
    99+
    2024-04-02
  • CSS+JavaScript怎么实现页面不同布局的切换
    这篇文章主要介绍“CSS+JavaScript怎么实现页面不同布局的切换”,在日常操作中,相信很多人在CSS+JavaScript怎么实现页面不同布局的切换问题上存在疑惑,小编查阅了各式资料,整理出简单好用...
    99+
    2024-04-02
  • 怎么使用flex布局轻松实现页面布局
    小编给大家分享一下怎么使用flex布局轻松实现页面布局,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!直接上代码:上中下布局:<!DOCTYPE h...
    99+
    2023-06-08
  • CSS怎么实现三列布局网页效果
    本篇内容介绍了“CSS怎么实现三列布局网页效果”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!这是一个比较常...
    99+
    2024-04-02
  • css中怎么实现一个三栏布局
    css中怎么实现一个三栏布局,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。三栏布局,顾名思义就是两边固定,中间自适应。三栏布局在实际的开发...
    99+
    2024-04-02
  • 如何使用HTML和CSS实现一个详细页面布局
    HTML和CSS是创建和设计网页的基础技术,通过合理使用这两者,我们可以实现各种复杂的网页布局。本文将介绍如何使用HTML和CSS来实现一个详细页面布局,并提供具体的代码示例。创建HTML结构首先,我们需要创建一个HTML结构来放置我们的页...
    99+
    2023-10-21
    CSS样式 HTML布局 详细页面
  • 怎么用frameset实现复杂的页面布局
    这篇文章主要讲解了“怎么用frameset实现复杂的页面布局”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“怎么用frameset实现复杂的页面布局”吧!代码如下:<html> &...
    99+
    2023-06-08
  • 如何使用纯CSS实现的三列布局网页效果
    这篇文章主要介绍了如何使用纯CSS实现的三列布局网页效果,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。代码如下:<!DOCTYPE h...
    99+
    2024-04-02
  • 如何实现页面中有间隔的方格布局
    这篇文章主要介绍“如何实现页面中有间隔的方格布局”,在日常操作中,相信很多人在如何实现页面中有间隔的方格布局问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”如何实现页面中有间隔的方格布局”的疑惑有所帮助!接下来...
    99+
    2023-06-08
  • 如何使用HTML和CSS实现一个简单的聊天页面布局
    随着现代科技的发展,人们越来越依赖于互联网来进行沟通和交流。而在网页中,聊天页面是一种非常常见的布局需求。本文将向大家介绍如何使用HTML和CSS来实现一个简单的聊天页面布局,并给出具体的代码示例。首先,我们需要创建一个HTML文件,可以使...
    99+
    2023-10-21
    CSS样式 HTML布局 聊天页面
  • Vue实现刷新当前页面的三种方式总结
    目录背景思路实现方式1-通过location.reload和$router.go(0)方法方式2-通过空白页面方式3-通过provide和inject背景 项目当中如果做新增/修改/...
    99+
    2023-01-14
    Vue刷新当前页面 Vue刷新页面
  • umi插件开发仿dumi项目实现页面布局详解
    目录实现思路使用默认项目提供的layout文件自定义主题准备工作主题插件功能modifyAppData插件代码生成layout路由对象使用同步伪代码来描述上面流程运行检查实现思路 ...
    99+
    2023-01-28
    umi插件仿dumi页面布局 umi 页面布局
  • 如何使用HTML和CSS实现一个固定页脚布局
    在网站设计中,一个常见的需求是实现一个固定页脚布局,即无论网页内容有多少,页脚始终显示在页面的底部。本文将介绍如何使用HTML和CSS实现这样的布局,并提供具体的代码示例。要实现固定页脚布局,我们需要使用CSS的定位属性来控制页脚的位置,并...
    99+
    2023-10-21
    CSS html 固定页脚布局
  • C#怎么实现计算器页面布局和数值初始化
    本篇内容介绍了“C#怎么实现计算器页面布局和数值初始化”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!实现页面布局和数值初始化using&nb...
    99+
    2023-06-29
  • 【uni-app】uni-app实现聊天页面功能(小程序)——布局篇
    文章目录 前言划分区域问题内容溢出关于调试聊天框 代码实现 前言 在工作中使用uni-app参与开发一个小程序,其中要写一个简单的聊天页面,虽然功能不多(只有一个发送文字的功能),但是其中的细节比较多,也踩过很多坑,...
    99+
    2023-08-16
    uni-app 小程序 前端 vue.js
  • css3中怎么使用@media属性实现页面响应式布局
    这篇文章将为大家详细讲解有关css3中怎么使用@media属性实现页面响应式布局,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。<!DOCTYPE HT...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作