[模拟Android微信]主界面

首先看很像模仿:

走出来:

实现过程:

依赖类库:actionbarsherlock

用actionbarsherlock来实现顶部的搜索的效果。

tab用的是Viewpaper实现的。

详细细节:

1.聊天、发现和通讯录地下的绿色的矩形和地下的灰色细线是重合的,怎么实现这样的效果呢。仅仅要使用

RelativeLayout。然后使得两个ImageView的

android:layout_alignBottom属性都指向同一个View。

2.“聊天”右边的红底白字1

要实现这个效果,能够通过重绘控件得到。

该项目的cmm.ui.view.tabTextview就是这样一个控件。在OnDraw里面

drawCircle和drawText等。

3.加入button后出现的下拉菜单

这个效果用的PopupWindow做的。

// 载入数据
groups = new ArrayList<String>();
groups.add("发起群聊");
groups.add("加入朋友");
groups.add("视频聊天");
groups.add("扫一扫");
groups.add("拍照分享");
//载入左側相应图标
mbitmaplist = new ArrayList<Bitmap>();
mbitmaplist.add(((BitmapDrawable)getResources().getDrawable(R.drawable.ofm_group_chat_icon)).getBitmap());
mbitmaplist.add(((BitmapDrawable)getResources().getDrawable(R.drawable.ofm_add_icon)).getBitmap());
mbitmaplist.add(((BitmapDrawable)getResources().getDrawable(R.drawable.ofm_video_icon)).getBitmap());
mbitmaplist.add(((BitmapDrawable)getResources().getDrawable(R.drawable.ofm_qrcode_icon)).getBitmap());
mbitmaplist.add(((BitmapDrawable)getResources().getDrawable(R.drawable.actionbar_camera_icon)).getBitmap());
GroupAdapter groupAdapter = new GroupAdapter(this, groups, mbitmaplist);
lv_group.setAdapter(groupAdapter);
// 创建一个PopuWidow对象
popupWindow = new PopupWindow(view, 400, LayoutParams.WRAP_CONTENT, true);

Popupwindow出如今偏右側,能够这样做:

int xPos = (int)((windowManager.getDefaultDisplay().getWidth() - popupWindow.getWidth()) * (0.9));
        Log.e("coder", "xPos:" + xPos);  

        popupWindow.showAsDropDown(parent, xPos, 0);

其它没什么,做的非常简陋,不喜请勿喷。

下载链接是:http://download.csdn.net/detail/u012463359/7411731

版权声明:本文博主原创文章。博客,未经同意不得转载。

时间: 2024-08-07 10:59:35

[模拟Android微信]主界面的相关文章

Android ActionBar应用实战,高仿微信主界面的设计

转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/26365683 经过前面两篇文章的学习,我想大家对ActionBar都已经有一个相对较为深刻的理解了.唯一欠缺的是,前面我们都只是学习了理论知识而已,虽然知识点已经掌握了,但是真正投入到项目实战当中时会不会掉链子还很难说.那么不用担心,本篇文章我就将带领大家一起进入ActionBar的应用实战,将理论和实践完美结合到一起. 如果你还没有看过我的前两篇文章,建议先去阅读一下 Andr

仿微信主界面导航栏图标字体颜色的变化

在所有的移动产品中,微信的界面做的很简洁,简单,我对微信主界面影响最深的就是微信底部导航栏的图标,以及字体颜色的变化,一直都想实现以下,今天有空,就大体的模仿者做了一遍. 效果图如下: 分析: 底部主要分为图标的渐变,字体颜色的渐变. 图标的颜色的渐变:主要是通过canvas绘制两个不同的图片,控制其图片的alpha透明度,来达到图标的渐变. 字体颜色:字体颜色就很好说了,Animator动画框架应该很熟悉了,在Animator框架中,有一个TypeEven是来计算十六进制色值的,我们可以通过A

Android 之高仿微信主界面

源码下载:  http://files.cnblogs.com/aibuli/WeChatSample.zip 主界面主要使用ActionBar来完成.  要实现这个效果,第一步当然是编辑menu目录下的main.xml文件. <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" tools:

Android利用ViewPager仿微信主界面-android学习之旅(78)

首先是介绍ViewPager这个控件 ,这个控件需要pagerAdapter作为容器来提供数据,同时pagerAdapter的数据源是View数组 效果图如下 部分代码如下,实现如下的方法 mPagerAdapter = new PagerAdapter(){ @Override public int getCount() { return mViews.size(); } @Override public boolean isViewFromObject(View view, Object o

Android应用主界面底部菜单实现

介绍 现在绝大多数主流的应用主界面,都会包含一个底部菜单,就拿腾讯的QQ与微信来说,看起来是这样的  <---我是底部菜单 原理 在很久以前,可以通过TabActivity实现相关功能,自从Fragment出来后,就被抛弃了. 原理也很简单 1.底部菜单通过自定义RadioGroup实现,通过setOnCheckedChangeListener监听切换内容. 2.内容切换,可以使用ViewPager(可以实现直接滑动切换),TabHost,FragmentManager来实现.. PS:类似的,

仿微信主界面

跟着慕课网的教学视频学习了如何制作微信的主界面,因为还有一些地方并没有完全搞懂,所以这里主要是记录下整个制作的过程,方便以后的学习! 效果图如图所示: 实现了点击下面tab切换fragment以及滑动切换tab的功能,同时滑动时,下面tab的icon会实现颜色渐变的效果. 首先是主界面的布局: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:bunschen="

ViewPager实现微信主界面

一前言 在微信中,tab底栏有四个按钮,中间是可以左右滑动的界面,上面一个标题栏,大致情况如此,今天我们就来模仿一下,写出微信的UI. 好,废话咱少讲,先来上图看效果. 二XML布局         1.Tab底栏  bottle.xml 在XML布局中,tab底栏我们用一个LinearLayout嵌套四个LinearLayout,这四个子LinearLayout中嵌套一个ImageButton和一个TextView垂直排列就好了. 1 <?xml version="1.0" e

使用FragmentTabHost和ViewPager实现仿微信主界面策划

最近看到很多界面主页都差不多,决定研究研究写出来,以后直接拿来用,不做代码的轮子,多总结,多学习 还是废话少说,先上图 介绍一下我的代码: 首先是布局文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width=&quo

通过fragment模拟一个微信主页面

通过fragment模拟一个微信主页面 在布局中声明UI <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools=&