Android开发之高仿微信界面(1)

转载自:http://blog.csdn.net/dawanganban/article/details/19925449

 

是男人就下100层【第一层】——高仿微信界面(1)

分类: Android高仿系列2014-02-25
23:07 4118人阅读 评论(14) 收藏 举报

微信界面高仿闪屏主题

  从今天开始将进行一个特别有趣且有意义的专栏《是男人就下100层》,计划对市面上比较火的应用进行高度仿照,并将开发过程贴出来,和大家交流和分享。由于时间关系可能进度会比较缓慢,但是任何事情如果没有开始,只是头脑里的一个想法,可能会错过很多机会。在此先声明一点:由于个人能力有限,有什么不对的地方或者需要改进的地方请各位朋友能够指出。好吧,直接进入正题【第一层】的目标是高仿微信界面。

  先下载一个微信的apk文件,安装到手机启动后依次可以看到下图两个界面:

     
  

接下来创建我们的工程(工程名:weixin)

闪屏界面AppStart的布局文件

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:background="@drawable/welcome" >  
  6.   
  7. </LinearLayout>  

闪屏界面有很多种写法,可以在Activity中添加一个动画改变屏幕透明度,或者在主题中给Activity的启动添加进入退出动画效果。

AppStart Activity的主题定义:

  1. <style name="AnimFade" parent="@android:style/Animation.Activity">    
  2.     <item name="android:activityOpenEnterAnimation">@anim/fade_in</item>    
  3.     <item name="android:activityOpenExitAnimation">@anim/hold</item>          
  4.     <item name="android:activityCloseEnterAnimation">@anim/fade_in</item>    
  5.     <item name="android:activityCloseExitAnimation">@anim/fade_out</item>   
  6. </style>  
  7.   
  8. <style name="Anim_style" parent="android:Theme.NoTitleBar">           
  9.     <item name="android:windowAnimationStyle">@style/AnimFade</item>         
  10. </style>   

该主题继承自Android系统主题Theme.NoTitleBar用自定义动画覆盖了windowAnimationStyle属性

activityOpenEnterAnimation:表示activity创建效果

activityOpenExitAnimation:表示还没有调用finish()的退出效果

activityCloseEnterAnimation:表示返回上一个activity进入效果

activityCloseEnterAnimation:表示activity调用finish()后退出效果

anim/fade_in.xml

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <alpha xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:interpolator="@android:anim/accelerate_interpolator"  
  4.     android:fromAlpha="0.0" android:toAlpha="1.0"  
  5.     android:duration="300" />  

interpolator定义的是动画的变化率(alpha, scale, translate, rotate)能够加速、减速、重复等。

上面定义的是加速动画,透明度从0到1,持续300毫秒

anim/fade_out.xml

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <alpha xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:interpolator="@android:anim/accelerate_interpolator"  
  4.     android:fromAlpha="1.0" android:toAlpha="0.0"  
  5.     android:duration="300" />  

和上面的基本相似,只是透明度部分不同。

anim/hold.xml

  1. <?xml version="1.0" encoding="utf-8"?>   
  2. <translate xmlns:android="http://schemas.android.com/apk/res/android"  
  3.        android:interpolator="@android:anim/accelerate_interpolator"  
  4.        android:fromXDelta="0" android:toXDelta="0"  
  5.        android:duration="300" />  

位移变化动画。

在manifest中配置AppStart的主题

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <manifest xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     package="com.example.weixin"  
  4.     android:versionCode="1"  
  5.     android:versionName="1.0" >  
  6.   
  7.     <uses-sdk  
  8.         android:minSdkVersion="8"  
  9.         android:targetSdkVersion="18" />  
  10.   
  11.     <application  
  12.         android:allowBackup="true"  
  13.         android:icon="@drawable/ic_launcher"  
  14.         android:label="@string/app_name"  
  15.         android:theme="@style/AppTheme" >  
  16.         <activity  
  17.             android:name=".activity.AppStart"  
  18.             android:label="@string/app_name"  
  19.             android:theme="@style/Anim_style">  
  20.             <intent-filter>  
  21.                 <action android:name="android.intent.action.MAIN" />  
  22.   
  23.                 <category android:name="android.intent.category.LAUNCHER" />  
  24.             </intent-filter>  
  25.         </activity>  
  26.         <activity  
  27.             android:name=".activity.Welcome">  
  28.               
  29.         </activity>  
  30.     </application>  
  31.   
  32. </manifest>  

上面的代码已经实现了上面的第一个图的效果,下面我们来运行一下

运行效果


下一篇我们来实现上面第二个图的效果,有什么问题或建议请在下面留言或加入左边的交流群交流。

时间: 2024-12-31 02:12:14

Android开发之高仿微信界面(1)的相关文章

Android 高仿微信界面

http://blog.csdn.net/dawanganban/article/details/20408505 上一篇<是男人就下100层[第一层]--高仿微信界面(7)>中我们实现了下弹式菜单,这一篇我们来看看如何实现微信中的摇一摇功能. 首先我们来布局我们的摇一摇界面 布局文件如下: <?xml version="1.0" encoding="utf-8"?>   <RelativeLayout xmlns:android=&q

Android自定义SwipeRefreshLayout高仿微信朋友圈下拉刷新_Android

上一篇文章里把SwipeRefreshLayout的原理简单过了一下,大致了解了其工作原理,不熟悉的可以去看一下:http://www.jb51.net/article/89310.htm  上一篇里最后提到,SwipeRefreshLayout的可定制性是比较差的,看源码会发现跟样式相关的几个类都是private的而且方法是写死的,只暴露出了几个颜色设置的方法.这样使得SwipeRefreshLayout的使用比较简单,主要就是设置一个监听器在onRefresh方法里完成刷新逻辑.讲道理Swi

Android自定义SwipeRefreshLayout高仿微信朋友圈下拉刷新

上一篇文章里把SwipeRefreshLayout的原理简单过了一下,大致了解了其工作原理,不熟悉的可以去看一下:http://www.jb51.net/article/89310.htm 上一篇里最后提到,SwipeRefreshLayout的可定制性是比较差的,看源码会发现跟样式相关的几个类都是private的而且方法是写死的,只暴露出了几个颜色设置的方法.这样使得SwipeRefreshLayout的使用比较简单,主要就是设置一个监听器在onRefresh方法里完成刷新逻辑.讲道理Swip

Android高仿微信聊天界面代码分享_Android

微信聊天现在非常火,是因其界面漂亮吗,哈哈,也许吧.微信每条消息都带有一个气泡,非常迷人,看起来感觉实现起来非常难,其实并不难.下面小编给大家分享实现代码. 先给大家展示下实现效果图: OK,下面我们来看一下整个小项目的主体结构: 下面是Activity的代码: package com.way.demo; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Date; import jav

Android高仿微信聊天界面代码分享

微信聊天现在非常火,是因其界面漂亮吗,哈哈,也许吧.微信每条消息都带有一个气泡,非常迷人,看起来感觉实现起来非常难,其实并不难.下面小编给大家分享实现代码. 先给大家展示下实现效果图: OK,下面我们来看一下整个小项目的主体结构: 下面是Activity的代码: package com.way.demo; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Date; import jav

Android 高仿微信6.0主界面 带你玩转切换图标变色

目录(?)[+] 转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/41087219,本文出自:[张鸿洋的博客] 1.概述 学习Android少不了模仿各种app的界面,自从微信6.0问世以后,就觉得微信切换时那个变色的Tab图标屌屌的,今天我就带大家自定义控件,带你变色变得飞起~~ 好了,下面先看下效果图: 清晰度不太好,大家凑合看~~有木有觉得这个颜色弱爆了了的,,,下面我动动手指给你换个颜色: 有没有这个颜色比较妖一点~~~

Android高仿微信表情输入与键盘输入详解_Android

       最近公司在项目上要使用到表情与键盘的切换输入,自己实现了一个,还是存在些缺陷,比如说键盘与表情切换时出现跳闪问题,这个相当困扰我,不过所幸在Github(其中一个不错的开源项目,其代码整体结构很不错)并且在论坛上找些解决方案,再加上我也是研究了好多个开源项目的代码,最后才苦逼地整合出比较不错的实现效果,可以说跟微信基本一样(嘿嘿,只能说目前还没发现大Bug,若发现大家一起日后慢慢完善,这里我也只是给出了实现方案,拓展其他表情我并没有实现哈,不过代码中我实现了一个可拓展的fragme

Android 高仿微信朋友圈动态支持双击手势放大并滑动查看图片效果

最近参与了开发一款旅行APP,其中包含实时聊天和动态评论功能,终于耗时几个月几个伙伴完成了,今天就小结一下至于实时聊天功能如果用户不多的情况可以scoket实现,如果用户万级就可以采用开源的smack + opnefile实现,也可以用mina开源+XMMP,至于怎么搭建和实现,估计目前github上一搜一大把,至于即时通讯怕误人子弟,暂且不做介绍,现就把实现的一个微信朋友圈的小功能介绍一下. 先上效果图: 一拿到主流的UI需求,大致分析下,需要我ListView嵌套Gridview,而grid

Android高仿微信图片选择功能的PhotoPicker

类似于微信修改头像的功能基本上每个app都会有,以前公司开发的项目就有修改头像的功能,但是用的Android系统自带的图片 选择器.用Android系统的图片选择器有个好处就是稳定,不会有什么问题.但也有它的缺点,比如不可定制,我们想要修改一下符合自己app的风格无法 做到. 既然大部分app都要用到图片选择器,为啥我不自己写一个呢?难不成每次都用系统自带的?那显得太没水平.所以,我就有了一个自己编写一个图片选择器的想法,以后只要有项目需要这个功能,直接拿来用就行了,这多爽! 其实github上