【Android开发基础】说说模块设计(下拉刷新、图片查看、布局设计)

这篇具有很好参考价值的文章主要介绍了【Android开发基础】说说模块设计(下拉刷新、图片查看、布局设计)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、引言

  • 描述:设计一个简单说说功能模块
  • 需求:
    1、能够下拉刷新,更新数据
    2、一条说说里允许包含多张图片,图片能够放大查看
  • 难度:初级
  • 知识点:
    1、Swiperefreshlayout
    2、适配器Adapter
    3、对话框Dialog
    4、文字图标Icon

二、设计

1、下拉刷新

  • 思路

       使用官方提供的解决方案SwipeRefreshLayout,具有简单、灵活的特点。不足之处是无法刷新头部和加载更多的功能。

(1)依赖
    implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha03'
(2)使用
  • 效果图

【Android开发基础】说说模块设计(下拉刷新、图片查看、布局设计)

  • UI界面
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
        android:id="@+id/swipe"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

	<!-- 需要刷新的界面 -->

<androidx.swiperefreshlayout.widget.SwipeRefreshLayout/>
  • 后台
	/**
     * @title:下拉刷新
     * @param activity
     */
    private void getSwipeRefreshLayout(final View activity) {
        final SwipeRefreshLayout swipeRefreshLayout = activity.findViewById(R.id.swipe);
        swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                new Thread(new Runnable() {
                    @Override
                    public void run() {
                        try {
                            //设置刷新时长为1秒
                            Thread.sleep(1000);
                        } catch (InterruptedException e) {
                            e.printStackTrace();
                        }
                        getActivity().runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                //更新数据
                                Log.i("Home","刷新数据");
                                // 数据更新方法
                                swipeRefreshLayout.setRefreshing(false);
                            }
                        });
                    }
                }).start();
            }
        });
    }

2、图片需求

  • 思路

多张图片:内容适配器嵌套图片适配器
图片放大:使用对话框,将获取的图片数据放入对话框内展示

  • 效果图

【Android开发基础】说说模块设计(下拉刷新、图片查看、布局设计)

  • UI界面
    (内容适配器)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="@dimen/hPadding"
    android:background="@drawable/shape"
    android:orientation="vertical"
    android:layout_marginBottom="8dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/userImage"
            android:layout_width="@dimen/huImage"
            android:layout_height="@dimen/huImage"
            android:layout_margin="@dimen/huImageMargin"/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:layout_marginTop="10dp">

            <TextView
                android:id="@+id/userName"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textSize="@dimen/huName"/>

            <TextView
                android:id="@+id/sayTime"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textSize="@dimen/hTime"/>
        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/hTextHeight"
        android:orientation="vertical"
        android:layout_marginLeft="@dimen/huImageMargin">

        <TextView
            android:id="@+id/sayText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/hTimeTop"
            android:textSize="@dimen/hName"
            android:textColor="@color/comm_hText"/>

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/sayImages"
            android:layout_width="match_parent"
            android:layout_height="@dimen/hImage"
            android:layout_marginTop="@dimen/hTimeTop" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="right">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">
                <ImageView
                    android:layout_marginTop="3dp"
                    android:layout_marginRight="6dp"
                    android:layout_width="@dimen/position"
                    android:layout_height="@dimen/position"
                    android:src="@drawable/position"/>

                <TextView
                    android:id="@+id/sayPosition"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textColor="@color/comm_hText"
                    android:layout_marginRight="@dimen/positionRight"/>

            </LinearLayout>
        </RelativeLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/hTimeTop"
        android:layout_marginLeft="@dimen/huImageMargin">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="评论区"
            android:textSize="13dp"/>
    </LinearLayout>

</LinearLayout>

(图片适配器)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/item_image"
        android:layout_width="@dimen/hImage"
        android:layout_height="@dimen/hImage" />

</LinearLayout>
  • 后台
    (实体)
public class Say {

    Long id;

    int status;

    Long userId;

    String text;

    String images;

    String time;

    String newTime;

    String position;
    // 其他
    String name;

    String image;

    public Long getId() {
        return id;
    }

    public int getStatus() {
        return status;
    }

    public Long getUserId() {
        return userId;
    }

    public String getText() {
        return text;
    }

    public String getImages() {
        return images;
    }

    public String getTime() {
        return time;
    }

    public String getNewTime() {
        return newTime;
    }

    public String getPosition() {
        return position;
    }

    public String getName() {
        return name;
    }

    public String getImage() {
        return image;
    }

    public void setId(Long id) {
        this.id = id;
    }

    public void setStatus(int status) {
        this.status = status;
    }

    public void setUserId(Long userId) {
        this.userId = userId;
    }

    public void setText(String text) {
        this.text = text;
    }

    public void setImages(String images) {
        this.images = images;
    }

    public void setTime(String time) {
        this.time = time;
    }

    public void setNewTime(String newTime) {
        this.newTime = newTime;
    }

    public void setPosition(String position) {
        this.position = position;
    }

    public void setName(String name) {
        this.name = name;
    }

    public void setImage(String image) {
        this.image = image;
    }

    @Override
    public String toString() {
        return "Say{" +
                "id=" + id +
                ", status=" + status +
                ", userId=" + userId +
                ", text='" + text + '\'' +
                ", images='" + images + '\'' +
                ", time='" + time + '\'' +
                ", newTime='" + newTime + '\'' +
                ", position='" + position + '\'' +
                ", name='" + name + '\'' +
                ", image='" + image + '\'' +
                '}';
    }
}

(内容适配器)

public class SayAdapter extends RecyclerView.Adapter<SayAdapter.ViewHolder>{

    private List<Say> sayList;  // 定义容器
//    private int say_admin; // 读取类型
    BitmapDrawable bitmapDrawable;
    private Handler handler = null;

    public SayAdapter(List<Say> listSay) {
        this.sayList = listSay;
    }

    // 绑定控件
    static class ViewHolder extends RecyclerView.ViewHolder {
        View sayView;
        ImageView userImage;
        TextView userName,sayTime,sayText,sayPosition;
        RecyclerView recyclerView;

        public ViewHolder(View itemView) {
            super(itemView);
            sayView = itemView;
            userImage = itemView.findViewById(R.id.userImage);
            userName = itemView.findViewById(R.id.userName);
            sayTime = itemView.findViewById(R.id.sayTime);
            sayText = itemView.findViewById(R.id.sayText);
            sayPosition = itemView.findViewById(R.id.sayPosition);
            recyclerView = itemView.findViewById(R.id.sayImages);
        }
    }

    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull final ViewGroup parent, final int viewType) {
        //加载适配器布局
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.say,parent,false);
        //循环加载适配器布局,从而达到减少资源使用
        final SayAdapter.ViewHolder holder = new SayAdapter.ViewHolder(view);
        // 模块点击点击事件
        holder.sayView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(parent.getContext(),sayList.get(viewType).getText(),Toast.LENGTH_SHORT).show();
            }
        });
        return holder;
    }

    @Override
    public void onBindViewHolder(@NonNull final SayAdapter.ViewHolder holder, int position) {
        final Say s = sayList.get(position);
        holder.userName.setText(s.getName());
        holder.sayTime.setText((CharSequence) s.getTime());
        holder.sayText.setText(s.getText());
        holder.sayPosition.setText(s.getPosition());
        // userImage
        //用户名头像
        showUserImage(holder,s.getImage());
        // sayImages
        // 说说多图片显示
        showSayImage(holder,s.getImages());
    }

    /**
     * Returns the total number of items in the data set held by the adapter.
     *
     * @return The total number of items in this adapter.
     */
    @Override
    public int getItemCount() {
        return sayList.size();
    }

    /**
     * @title:头像显示
     * @param holder
     * @param url
     */
    private void showUserImage(final SayAdapter.ViewHolder holder, final String url){
        handler = new Handler();
        final Runnable runnable = new Runnable() {
            @Override
            public void run() {
                holder.userImage.setImageDrawable(bitmapDrawable);
            }
        };
        new Thread(new Runnable() {
            @Override
            public void run() {
                try {
                    bitmapDrawable = okHttp.getBitmap(Api.userImage,url);
                    handler.post(runnable);
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }).start();
    }

    /**
     * @title:说说图片显示
     * @param holder
     * @param say_images
     */
    private void showSayImage(ViewHolder holder, String say_images) {
        // 解析符合图片资源
        String[] sayImages = say_images.split("\\|");
        List<String> sayI = new ArrayList<>();
        Collections.addAll(sayI,sayImages);
        //1.获取RecyclerView控件信息
        //2.RecyclerView控件的使用方法
        StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);
        //3.横向滑动
        holder.recyclerView.setLayoutManager(layoutManager);
        //4.数据载入适配器,数据填充
        ImageAdapter adapter = new ImageAdapter(sayI);
        holder.recyclerView.setAdapter(adapter);
    }

}

(图片适配器)

public class ImageAdapter extends RecyclerView.Adapter<ImageAdapter.ViewHolder> {

    //定义一个list容器
    private List<String> listString;
    BitmapDrawable bitmapDrawable;
    private Handler handler = null;

    //绑定android界面控件
    static class ViewHolder extends RecyclerView.ViewHolder {

        View ImageView;
        ImageView hImage;

        public ViewHolder(View itemView) {
            super(itemView);
            ImageView = itemView;
            hImage = itemView.findViewById(R.id.item_image);
        }
    }

    public ImageAdapter(List<String> list){
        listString = list;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
        //加载适配器布局
        View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.image,viewGroup,false);
        //循环加载适配器布局,从而达到减少资源使用
        final ViewHolder holder = new ViewHolder(view);
        //图片放大
        ImageFD(holder);
        return holder;
    }

    /**     图片放大与关闭    **/
    private void ImageFD(final ViewHolder holder) {
        //再次点击进行关闭
        holder.hImage.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //获取对应的图片对象
                ImageView imgView = new ImageView(holder.hImage.getContext());
                imgView.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
                imgView.setImageDrawable(bitmapDrawable);
                //思路是:使用对话框,将获取的图片数据放入对话框内展示
                final Dialog dialog = new Dialog(holder.ImageView.getContext(),android.R.style.Theme_Black_NoTitleBar_Fullscreen);
                dialog.setContentView(imgView);
                dialog.show();
                //再次点击进行关闭
                imgView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        dialog.dismiss();
                    }
                });
            }
        });
    }

    @Override
    public void onBindViewHolder(final ViewHolder viewHolder, int i) {
        //将数据依次与适配器匹配
        final String s = listString.get(i);
        handler = new Handler();
        final Runnable runnable = new Runnable() {
            @Override
            public void run() {
                viewHolder.hImage.setImageDrawable(bitmapDrawable);
            }
        };
        new Thread(new Runnable() {
            @Override
            public void run() {
                try {
                    bitmapDrawable = okHttp.getBitmap(Api.sayImage,s);
                    handler.post(runnable);
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }).start();
    }

    @Override
    public int getItemCount() {
        return listString.size();
    }
}

三、结论

       正常的说说模块,按道理应该还需要点赞、收藏、分享、屏蔽等一些功能,这里我就不一一设计了。思路其实很简单:
       点赞:使用Redis收集点赞用户信息,每隔三十分钟使用Spring Task归档一次或者晚上人流量少时定点统一归档。
 
       收藏:独立设计一张表,主字段:当前用户id、说说id,app本地再设计一张表用于缓存,剩下的就是IDUS。
 
       分享:定义一个特定的链接,比如:https://www.xpq.com/abcdef其中www.xpq.com为网址,abcdef为说说识别字段。如果还需要设置分享时间,比如:https://www.xpq.com/20230609/30/abcdef。20230609为开始时间,30表示一个月的过期时间。
 
       屏蔽:本地数据库获取到的说说信息里添加一个state字段,用于界面显示的一个“撞针”。文章来源地址https://www.toymoban.com/news/detail-477455.html

到了这里,关于【Android开发基础】说说模块设计(下拉刷新、图片查看、布局设计)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • flutter开发实战-下拉刷新与上拉加载更多实现

    flutter开发实战-下拉刷新与上拉加载更多实现 在开发中经常遇到列表需要下拉刷新与上拉加载更多,这里使用EasyRefresh,版本是3.3.2+1 EasyRefresh可以在Flutter应用程序上轻松实现下拉刷新和上拉加载。它几乎支持所有Flutter Scrollable小部件。它的功能与安卓的SmartRefreshLayout非常相似

    2024年02月07日
    浏览(44)
  • 【HTML界面设计(二)】说说模块、登录界面

    记录很早之前写的前端界面(具体时间有点久远) 采用 适配器(Adapter)原理 来设计这款说说模板,首先看一下完整效果 这是demo样图,需要通过业务需求进行修改的部分 这一部分,就是demo代码了 效果图(因为我这个项目有二维码登录的需求,所以有一个扫描图标,但dem

    2024年02月09日
    浏览(42)
  • Android Paging3分页+ConcatAdapter+空数据视图+下拉刷新(SwipeRefreshLayout)+加载更多+错误重试 (示例)

    paging 库,目前还是有点小bug ,后面说 布局文件就是显示两个TextView,就不贴了 布局文件: adapter 实现: adapter 继承自 LoadStateAdapter,关联的数据对象 LoadState 有三个状态。 LoadState.NotLoading 表示 非加载中,即加载完成时的状态。如果 displayLoadStateAsItem()中的实现是 || (loadState

    2024年02月14日
    浏览(45)
  • iOS开发-下拉刷新动画依次渐隐渐显Indicator指示器效果

    iOS开发-下拉刷新动画依次渐隐渐显Indicator指示器效果 之前开发中实现下拉刷新动画三个球依次渐隐渐显指示器效果。 CABasicAnimation类的使用方式就是基本的关键帧动画。 所谓关键帧动画,就是将Layer的属性作为KeyPath来注册,指定动画的起始帧和结束帧,然后自动计算和实现

    2024年02月15日
    浏览(38)
  • 鸿蒙App开发-网络请求-下拉刷新三方库-底部Tab栏-滚动组件(含源码)

    本文介绍一个基于鸿蒙ArkTS开发的App,是一个包含轮播图、文章列表和 Web 页面等功能的多页面应用。 本文主要内容包括: 一、效果图 首页 详情页    二、内容简介 1.底部Tab栏和两个页面         App底部是一个TabBar,点击TabBar可以切换上面的页面。共包含两个页面,一个

    2024年02月01日
    浏览(53)
  • 基于Android的记事本设计和模块开发

    有一万五千字论文,完美运行。 由于编程技术的迅速发展,各种记事本APP随处可见,在人们的日常生活中经常使用的到。于是各种记事本APP也跟着发展起来。本文在通过在Android Studio开发平台上开发一个简单的多功能语音输入记事本APP的过程,同时了解记事本APP的功能实现,

    2024年02月03日
    浏览(54)
  • uniapp开发使用插件z-paging实现页面下拉刷新、上拉加载,分页加载

    在uniapp官网有一个比较好用的插件z-paging,可以实现多条数据滚动显示或者自定义下拉刷新,分页显示......在开发消息页面或者app开发需要大量的页面刷新,页面内容过长,减轻服务器的负担就可以使用此插件,进入app智慧加载部分内容,等到再次需要之后的内容就再次加载

    2024年02月11日
    浏览(54)
  • Android保存图片到系统图库并通知系统相册刷新

      在android开发中保存应用的图片并插入到系统图库同时通知相册刷新的功能,做完后发现在部分手机上出现虽然图片保存成功了,但是相册却找不到图片的问题,查找文件夹图片也已经存在,可就是在相册里刷新不出来。   以上代码便是将Bitmap保存图片到指定的路径/

    2024年01月24日
    浏览(46)
  • 微信小程序开发系列(三十二)·如何通过小程序的API实现页面的上拉加载(onReachBottom事件)和下拉刷新(onPullDownRefresh事件)

    目录 1.  上拉加载 2.  下拉刷新         上拉加载是小程序中常见的一种加载方式,当用户滑动页面到底部时,会自动加载更多的内容,以便用户继续浏览小程序中实现上拉加载的方式: ①  在app.json或者page.json中配置距离页面底部距离:onReachBottomDistance;默认50px。 ②

    2024年04月12日
    浏览(53)
  • 微信小程序——页面事件,.启用下拉刷新监听页面的下拉刷新事件,上拉触底事件,停止下拉刷新的效果

    下拉刷新是移动端的专有名词,指的是通过手指在屏幕上的下拉滑动操作,从而重新加载页面数据的行为。 启用下拉刷新有两种方式: a.全局开启下拉刷新 在 app.json 的window 节点中,将 enablePullDownRefresh 设置为 true. b.局部开启下拉刷新 在页面的.json 配置文件中,将 enablePull

    2024年01月25日
    浏览(61)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包