android ui 聊天界面安卓聊天界面实现

转载

mob64ca14040d22 2024-08-29 12:59:48

文章标签 android ui 聊天界面 wechat 聊天微信界面 文章分类 Android 移动开发

今天说说android的仿微信聊天界面，我只想说两个字：坑爹

项目已经传到了github： https://github.com/hebiao6446/Hantu-android-

还好我写过iOS仿微信的界面，我是把iOS中的Model翻译成了Javabean对象，很蛋疼首先上一张图。。

android ui 聊天界面安卓聊天界面实现_聊天

这个就是传说中的android仿微信聊天界面，仿的如何 ? 我们一直都在模仿，从未被超越。。。

同样我先说下思路

1.定义消息类型需要将所有的消息字段定义出来，那么需要哪些字段了？如上图所示，这里就不解释了

2.布局： android开发大部分时间会花在布局上，布局是一个蛋疼的事情。我这个仿微信的界面单个的item有多种布局。第一种：文本消息布局，这个比较容易搞一个点9图拉伸下就可以；第二种，稍微有点蛋疼就是音频文件布局，其实是有一点点小规律的，因为音频文件高度确定的，只要管横向就可以，通过音频时长来计算出布局宽度，有点小蛋疼；第三种，图片布局，不知道你有没有发现图片布局有个鸟嘴。。。。蛋疼，说多都是泪。。。而且每个布局都有单击事件和长按事件，并且蛋疼的音频还有个小动画。。。我们可以通过内部类或接口将事件传递出来

3,如何布局？

我这个仿微信的item一共有六种布局，冗余较多，但是，我写过一个共用一个布局的 item，自己可以想象一下会出现什么问题，这里就不扯淡了

图片加载用的是网络图片，Glide框架就不解释了，但是图片下载下来之后是要经过处理的，有点图片是横着的，有的数着。。。 Glide牛逼的不要不要的。。上代码

private void setImageLayout(final ImageView img,String url){



        Glide.with(context).load(url).asBitmap().into(new SimpleTarget<Bitmap>() {
            @Override
            public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {

                ViewGroup.LayoutParams layoutParams=img.getLayoutParams();

                int bw=resource.getWidth();
                int bh=resource.getHeight();

                float maxwh=screenHeight*IMAGE_MAX_HEIGHTORWIDTH;

                Log.e("hebiao =============== ",maxwh+"");
                if (bw>=bh){
                    layoutParams.width=(int)maxwh;
                    layoutParams.height=(int)(bh*maxwh/bw);
                }else {
                    layoutParams.height=(int)maxwh;
                    layoutParams.width=(int)(bw*maxwh/bh);
                }
                img.setLayoutParams(layoutParams);
                img.setImageBitmap(resource);

            }
        });



    }

看不懂的面壁思过去。。。

控件绑定清一色使用ButterKnife 这个不解释，

android ui 聊天界面安卓聊天界面实现_界面_02