Android仿微信聊天界面


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

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


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


这个就是传说中的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() {
            @Override
            public void onResourceReady(Bitmap resource, GlideAnimation 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仿微信聊天界面_第1张图片


整个项目就只有这么多东西 

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

取一Hantu的名字,也是没打算写这个仿微信 。。。  好吧 , 无心插柳 


来张动态图 https://github.com/hebiao6446/Hantu-android-/blob/master/gif/a2kkkk.gif









你可能感兴趣的:(Android)