----------------------收藏备用  -------------------------------

代码下载：http://download.csdn.net/detail/qq263229365/5622693

今天从网上看到一个这样的效果，感觉很有创意，自己也搜集了一些资料，仿照着实现了一下。

下面就直接上源码：

首先看一下布局文件：

[html] 
view plain
copy

 

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout android:layout_width="fill_parent"
  3. android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"
  4. android:background="#ffffff">
  5. <ImageView android:layout_width="wrap_content"
  6. android:layout_height="fill_parent" android:background="@drawable/splash_shadow"
  7. android:layout_marginLeft="50dip" />
  8. <RelativeLayout android:id="@+id/relativeLayout_top_bar"
  9. android:layout_width="fill_parent" android:layout_height="40dip"
  10. android:background="@drawable/qa_bar">
  11. <ImageView android:layout_width="60dip"
  12. android:layout_height="20dip" android:background="@drawable/qa_logo"
  13. android:layout_centerInParent="true" />
  14. </RelativeLayout>
  15. <TextView android:layout_below="@id/relativeLayout_top_bar"
  16. android:layout_width="wrap_content" android:layout_height="wrap_content"
  17. android:textSize="20sp" android:text="Tap to Refresh"
  18. android:layout_centerHorizontal="true" android:layout_marginTop="50dip" android:textStyle="bold"/>
  19. <Button android:id="@+id/button_composer_sleep"
  20. android:layout_width="wrap_content" android:layout_height="wrap_content"
  21. android:background="@drawable/composer_sleep"
  22. android:layout_marginBottom="10dip" android:layout_marginLeft="10dip"
  23. android:layout_alignParentBottom="true">
  24. </Button>
  25. <Button android:id="@+id/button_composer_thought"
  26. android:layout_width="wrap_content" android:layout_height="wrap_content"
  27. android:background="@drawable/composer_thought"
  28. android:layout_marginBottom="10dip" android:layout_marginLeft="10dip"
  29. android:layout_alignParentBottom="true" android:layout_above="@id/button_composer_sleep">
  30. </Button>
  31. <Button android:id="@+id/button_composer_music"
  32. android:layout_width="wrap_content" android:layout_height="wrap_content"
  33. android:background="@drawable/composer_music"
  34. android:layout_marginBottom="10dip" android:layout_marginLeft="10dip"
  35. android:layout_alignParentBottom="true">
  36. </Button>
  37. <Button android:id="@+id/button_composer_place"
  38. android:layout_width="wrap_content" android:layout_height="wrap_content"
  39. android:background="@drawable/composer_place"
  40. android:layout_marginBottom="10dip" android:layout_marginLeft="10dip"
  41. android:layout_alignParentBottom="true" android:layout_above="@id/button_composer_music">
  42. </Button>
  43. <Button android:id="@+id/button_composer_with"
  44. android:layout_width="wrap_content" android:layout_height="wrap_content"
  45. android:background="@drawable/composer_with"
  46. android:layout_marginBottom="10dip" android:layout_marginLeft="10dip"
  47. android:layout_alignParentBottom="true" android:layout_above="@id/button_composer_place">
  48. </Button>
  49. <Button android:id="@+id/button_composer_camera"
  50. android:layout_width="wrap_content" android:layout_height="wrap_content"
  51. android:background="@drawable/composer_camera"
  52. android:layout_marginBottom="10dip" android:layout_marginLeft="10dip"
  53. android:layout_alignParentBottom="true" android:layout_above="@id/button_composer_with">
  54. </Button>
  55. <Button android:id="@+id/button_friends_delete"
  56. android:layout_width="wrap_content" android:layout_height="wrap_content"
  57. android:background="@drawable/friends_delete"
  58. android:layout_marginBottom="10dip" android:layout_marginLeft="10dip"
  59. android:layout_alignParentBottom="true" android:layout_above="@id/button_composer_camera">
  60. </Button>
  61. </RelativeLayout>

实现button按钮动画效果的核心类：

[html] 
view plain
copy

 

  1. package cn.com.kar.test;
  2. import android.R.anim;
  3. import android.app.Activity;
  4. import android.os.Bundle;
  5. import android.util.Log;
  6. import android.view.Display;
  7. import android.view.View;
  8. import android.view.View.OnClickListener;
  9. import android.view.animation.Animation;
  10. import android.view.animation.RotateAnimation;
  11. import android.view.animation.ScaleAnimation;
  12. import android.view.animation.TranslateAnimation;
  13. import android.view.animation.Animation.AnimationListener;
  14. import android.widget.Button;
  15. import android.widget.RelativeLayout.LayoutParams;
  16. public class PathButtonActivity extends Activity
  17. {
  18. private Button buttonCamera, buttonDelete, buttonWith, buttonPlace, buttonMusic, buttonThought, buttonSleep;
  19. private Animation animationTranslate, animationRotate, animationScale;
  20. private static int width, height;
  21. private LayoutParams params = new LayoutParams(0, 0);
  22. private static Boolean isClick = false;
  23. /** Called when the activity is first created. */
  24. @Override
  25. public void onCreate(Bundle savedInstanceState)
  26. {
  27. super.onCreate(savedInstanceState);
  28. setContentView(R.layout.path_button);
  29. initialButton();
  30. }
  31. private void initialButton()
  32. {
  33. // TODO Auto-generated method stub
  34. Display display = getWindowManager().getDefaultDisplay();
  35. height = display.getHeight();
  36. width = display.getWidth();
  37. Log.v("width  & height is:", String.valueOf(width) + ", " + String.valueOf(height));
  38. params.height = 50;
  39. params.width = 50;
  40. //设置边距  (int left, int top, int right, int bottom)
  41. params.setMargins(10, height - 98, 0, 0);
  42. buttonSleep = (Button) findViewById(R.id.button_composer_sleep);
  43. buttonSleep.setLayoutParams(params);
  44. buttonThought = (Button) findViewById(R.id.button_composer_thought);
  45. buttonThought.setLayoutParams(params);
  46. buttonMusic = (Button) findViewById(R.id.button_composer_music);
  47. buttonMusic.setLayoutParams(params);
  48. buttonPlace = (Button) findViewById(R.id.button_composer_place);
  49. buttonPlace.setLayoutParams(params);
  50. buttonWith = (Button) findViewById(R.id.button_composer_with);
  51. buttonWith.setLayoutParams(params);
  52. buttonCamera = (Button) findViewById(R.id.button_composer_camera);
  53. buttonCamera.setLayoutParams(params);
  54. buttonDelete = (Button) findViewById(R.id.button_friends_delete);
  55. buttonDelete.setLayoutParams(params);
  56. buttonDelete.setOnClickListener(new OnClickListener()
  57. {
  58. @Override
  59. public void onClick(View v)
  60. {
  61. // TODO Auto-generated method stub
  62. if(isClick == false)
  63. {
  64. isClick = true;
  65. buttonDelete.startAnimation(animRotate(-45.0f, 0.5f, 0.45f));
  66. buttonCamera.startAnimation(animTranslate(0.0f, -180.0f, 10, height - 240, buttonCamera, 80));
  67. buttonWith.startAnimation(animTranslate(30.0f, -150.0f, 60, height - 230, buttonWith, 100));
  68. buttonPlace.startAnimation(animTranslate(70.0f, -120.0f, 110, height - 210, buttonPlace, 120));
  69. buttonMusic.startAnimation(animTranslate(80.0f, -110.0f, 150, height - 180, buttonMusic, 140));
  70. buttonThought.startAnimation(animTranslate(90.0f, -60.0f, 175, height - 135, buttonThought, 160));
  71. buttonSleep.startAnimation(animTranslate(170.0f, -30.0f, 190, height - 90, buttonSleep, 180));
  72. }
  73. else
  74. {
  75. isClick = false;
  76. buttonDelete.startAnimation(animRotate(90.0f, 0.5f, 0.45f));
  77. buttonCamera.startAnimation(animTranslate(0.0f, 140.0f, 10, height - 98, buttonCamera, 180));
  78. buttonWith.startAnimation(animTranslate(-50.0f, 130.0f, 10, height - 98, buttonWith, 160));
  79. buttonPlace.startAnimation(animTranslate(-100.0f, 110.0f, 10, height - 98, buttonPlace, 140));
  80. buttonMusic.startAnimation(animTranslate(-140.0f, 80.0f, 10, height - 98, buttonMusic, 120));
  81. buttonThought.startAnimation(animTranslate(-160.0f, 40.0f, 10, height - 98, buttonThought, 80));
  82. buttonSleep.startAnimation(animTranslate(-170.0f, 0.0f, 10, height - 98, buttonSleep, 50));
  83. }
  84. }
  85. });
  86. buttonCamera.setOnClickListener(new OnClickListener()
  87. {
  88. @Override
  89. public void onClick(View v)
  90. {
  91. // TODO Auto-generated method stub
  92. buttonCamera.startAnimation(setAnimScale(2.5f, 2.5f));
  93. buttonWith.startAnimation(setAnimScale(0.0f, 0.0f));
  94. buttonPlace.startAnimation(setAnimScale(0.0f, 0.0f));
  95. buttonMusic.startAnimation(setAnimScale(0.0f, 0.0f));
  96. buttonThought.startAnimation(setAnimScale(0.0f, 0.0f));
  97. buttonSleep.startAnimation(setAnimScale(0.0f, 0.0f));
  98. buttonDelete.startAnimation(setAnimScale(0.0f, 0.0f));
  99. }
  100. });
  101. buttonWith.setOnClickListener(new OnClickListener()
  102. {
  103. @Override
  104. public void onClick(View v)
  105. {
  106. // TODO Auto-generated method stub
  107. buttonWith.startAnimation(setAnimScale(2.5f, 2.5f));
  108. buttonCamera.startAnimation(setAnimScale(0.0f, 0.0f));
  109. buttonPlace.startAnimation(setAnimScale(0.0f, 0.0f));
  110. buttonMusic.startAnimation(setAnimScale(0.0f, 0.0f));
  111. buttonThought.startAnimation(setAnimScale(0.0f, 0.0f));
  112. buttonSleep.startAnimation(setAnimScale(0.0f, 0.0f));
  113. buttonDelete.startAnimation(setAnimScale(0.0f, 0.0f));
  114. }
  115. });
  116. buttonPlace.setOnClickListener(new OnClickListener()
  117. {
  118. @Override
  119. public void onClick(View v)
  120. {
  121. // TODO Auto-generated method stub
  122. buttonPlace.startAnimation(setAnimScale(2.5f, 2.5f));
  123. buttonWith.startAnimation(setAnimScale(0.0f, 0.0f));
  124. buttonCamera.startAnimation(setAnimScale(0.0f, 0.0f));
  125. buttonMusic.startAnimation(setAnimScale(0.0f, 0.0f));
  126. buttonThought.startAnimation(setAnimScale(0.0f, 0.0f));
  127. buttonSleep.startAnimation(setAnimScale(0.0f, 0.0f));
  128. buttonDelete.startAnimation(setAnimScale(0.0f, 0.0f));
  129. }
  130. });
  131. buttonMusic.setOnClickListener(new OnClickListener()
  132. {
  133. @Override
  134. public void onClick(View v)
  135. {
  136. // TODO Auto-generated method stub
  137. buttonMusic.startAnimation(setAnimScale(2.5f, 2.5f));
  138. buttonPlace.startAnimation(setAnimScale(0.0f, 0.0f));
  139. buttonWith.startAnimation(setAnimScale(0.0f, 0.0f));
  140. buttonCamera.startAnimation(setAnimScale(0.0f, 0.0f));
  141. buttonThought.startAnimation(setAnimScale(0.0f, 0.0f));
  142. buttonSleep.startAnimation(setAnimScale(0.0f, 0.0f));
  143. buttonDelete.startAnimation(setAnimScale(0.0f, 0.0f));
  144. }
  145. });
  146. buttonThought.setOnClickListener(new OnClickListener()
  147. {
  148. @Override
  149. public void onClick(View v)
  150. {
  151. // TODO Auto-generated method stub
  152. buttonThought.startAnimation(setAnimScale(2.5f, 2.5f));
  153. buttonPlace.startAnimation(setAnimScale(0.0f, 0.0f));
  154. buttonWith.startAnimation(setAnimScale(0.0f, 0.0f));
  155. buttonCamera.startAnimation(setAnimScale(0.0f, 0.0f));
  156. buttonMusic.startAnimation(setAnimScale(0.0f, 0.0f));
  157. buttonSleep.startAnimation(setAnimScale(0.0f, 0.0f));
  158. buttonDelete.startAnimation(setAnimScale(0.0f, 0.0f));
  159. }
  160. });
  161. buttonSleep.setOnClickListener(new OnClickListener()
  162. {
  163. @Override
  164. public void onClick(View v)
  165. {
  166. // TODO Auto-generated method stub
  167. buttonSleep.startAnimation(setAnimScale(2.5f, 2.5f));
  168. buttonPlace.startAnimation(setAnimScale(0.0f, 0.0f));
  169. buttonWith.startAnimation(setAnimScale(0.0f, 0.0f));
  170. buttonCamera.startAnimation(setAnimScale(0.0f, 0.0f));
  171. buttonMusic.startAnimation(setAnimScale(0.0f, 0.0f));
  172. buttonThought.startAnimation(setAnimScale(0.0f, 0.0f));
  173. buttonDelete.startAnimation(setAnimScale(0.0f, 0.0f));
  174. }
  175. });
  176. }
  177. protected Animation setAnimScale(float toX, float toY)
  178. {
  179. // TODO Auto-generated method stub
  180. animationScale = new ScaleAnimation(1f, toX, 1f, toY, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.45f);
  181. animationScale.setInterpolator(PathButtonActivity.this, anim.accelerate_decelerate_interpolator);
  182. animationScale.setDuration(500);
  183. animationScale.setFillAfter(false);
  184. return animationScale;
  185. }
  186. protected Animation animRotate(float toDegrees, float pivotXValue, float pivotYValue)
  187. {
  188. // TODO Auto-generated method stub
  189. animationRotate = new RotateAnimation(0, toDegrees, Animation.RELATIVE_TO_SELF, pivotXValue, Animation.RELATIVE_TO_SELF, pivotYValue);
  190. animationRotate.setAnimationListener(new AnimationListener()
  191. {
  192. @Override
  193. public void onAnimationStart(Animation animation)
  194. {
  195. // TODO Auto-generated method stub
  196. }
  197. @Override
  198. public void onAnimationRepeat(Animation animation)
  199. {
  200. // TODO Auto-generated method stub
  201. }
  202. @Override
  203. public void onAnimationEnd(Animation animation)
  204. {
  205. // TODO Auto-generated method stub
  206. animationRotate.setFillAfter(true);
  207. }
  208. });
  209. return animationRotate;
  210. }
  211. //移动的动画效果
  212. /*
  213. * TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)
  214. *
  215. * float fromXDelta:这个参数表示动画开始的点离当前View X坐标上的差值；
  216. *
  217. * float toXDelta, 这个参数表示动画结束的点离当前View X坐标上的差值；
  218. *
  219. * float fromYDelta, 这个参数表示动画开始的点离当前View Y坐标上的差值；
  220. *
  221. * float toYDelta)这个参数表示动画开始的点离当前View Y坐标上的差值；
  222. */
  223. protected Animation animTranslate(float toX, float toY, final int lastX, final int lastY,
  224. final Button button, long durationMillis)
  225. {
  226. // TODO Auto-generated method stub
  227. animationTranslate = new TranslateAnimation(0, toX, 0, toY);
  228. animationTranslate.setAnimationListener(new AnimationListener()
  229. {
  230. @Override
  231. public void onAnimationStart(Animation animation)
  232. {
  233. // TODO Auto-generated method stub
  234. }
  235. @Override
  236. public void onAnimationRepeat(Animation animation)
  237. {
  238. // TODO Auto-generated method stub
  239. }
  240. @Override
  241. public void onAnimationEnd(Animation animation)
  242. {
  243. // TODO Auto-generated method stub
  244. params = new LayoutParams(0, 0);
  245. params.height = 50;
  246. params.width = 50;
  247. params.setMargins(lastX, lastY, 0, 0);
  248. button.setLayoutParams(params);
  249. button.clearAnimation();
  250. }
  251. });
  252. animationTranslate.setDuration(durationMillis);
  253. return animationTranslate;
  254. }
  255. }

其实就是在button点击的时候播放Tween动画。

这样就基本完成，参照上面的代码 自己也可以自行修改成自己喜欢的样式。

看一下在我手机上运行的效果：

代码下载：http://download.csdn.net/detail/qq263229365/5622693


超炫的Button按钮展开弧形动画效果的更多相关文章

  1. Waves – 赞！超炫交互体验的点击动画效果

    Waves 点击效果的灵感来自于谷歌的材料设计,很容易使用.只需要引入 waves.min.css 和 waves.min.js 到 HTML 文件中可以使用了.采用 touchstart 与 tou ...

  2. WPF技术触屏上的应用系列（六）: 视觉冲击、超炫系统主界面、系统入口效果实现

    原文:WPF技术触屏上的应用系列(六): 视觉冲击.超炫系统主界面.系统入口效果实现 去年某客户单位要做个大屏触屏应用,要对档案资源进行展示之用.客户端是Window7操作系统,54寸大屏电脑电视一体 ...

  3. AnimCheckBox按钮点击动画效果《IT蓝豹》

    AnimCheckBox按钮点击动画效果 AnimCheckBox按钮点击动画效果,点击选中后勾选框选择效果,很不错的动画功能.项目来源:https://github.com/lguipeng/Ani ...

  4. 右上角鼠标滑过展开收缩动画效果js代码的演示页面

    http://files.cnblogs.com/files/tanlingdangan/top_right.rar.gz 右上角鼠标滑过展开收缩动画效果js代码的演示页面http://www.51x ...

  5. css点击按钮，依次动态展开面板动画效果

    <a href="#one">按钮1</a> <a href="#two">按钮2</a> <a href ...

  6. 原生html，css+js写下载按钮有提示动画效果的落地页

    <!DOCTYPE html> <html lang="en"> <head>   <meta charset="UTF-8&q ...

  7. android imageview按钮按下动画效果

    private ImageView today_eat: today_eat = (ImageView) view.findViewById(R.id.today_eat); today_eat.se ...

  8. 6个超炫酷的HTML5电子书翻页动画

    相信大家一定遇到过一些电子书网站,我们可以通过像看书一样翻页来浏览电子书的内容.今天我们要分享的HTML5应用跟电子书翻页有关,我们精选出来的6个电子书翻页动画都非常炫酷,而且都提供源码下载,有需要的 ...

  9. 优秀前端开发教程：超炫的 Mobile App 3D 演示

    今天,我们想与您分享一个实验性的3D效果.它涉及到一个3D移动设备和一些移动应用程序截图.点击切换按钮时,我们将让移动设备转动并移动每个画面,使我们能看到一个分层的视图.你可能之前没见过这种应用程序演 ...

随机推荐

  1. 引用 模块编译Makefile模板

    本文转载自geyingzhen<模块编译Makefile模板>   引用 geyingzhen 的 模块编译Makefile模板 ifneq ($(KERNELRELEASE), ) // ...

  2. 11g的alert日志路径

    一个测试库,11g,没有sys账户,无法用show parameter dump查看alert日志的路径,以前也碰到过,但后来就不了了之了.这次深挖下,也参考了下一些网上的帖子,于是找到了: $ORA ...

  3. 第1章 Lua基础

    1.1 全局变量 全局变量不需要声明,给一个变量赋值后即创建了这个全局变量,访问一个没有初始化的全局变量也不会出错,只不过得到的结果是:nil. 如果你想删除一个全局变量,只需要将变量负值为 nil ...

  4. C++静态库中使用_declspec(dllexport) 不能导出函数的问题

    在某项目中,有一些静态库,这些静态库中有类型命名的函数GET_XXX.在一次项目结构调整的时候,我想将调用这静态库的代码编译成DLL,并且将这些Get函数导出,我就直接就这些函数前面添加了_decls ...

  5. Jquery学习笔记： attr和 prop的区别，以及为html标签自定义属性

    一.自定义html标签属性 对于html文件中的html标签,可以自定义属性,如: <a href="#" id="link1" action=" ...

  6. Creating Spatial Indexes（mysql 创建空间索引 The used table type doesn't support SPATIAL indexes）

    For MyISAM tables, MySQL can create spatial indexes using syntax similar to that for creating regula ...

  7. SRAM,SDRAM,网卡

    SRAM,SDRAM,网卡有地址总线.由cpu统一编址. NAND flash没有地址总线. 因 此有这两者寻址方式不同. 字符设备驱动程序的框架. 驱动程序 1.有led.read,led.writ ...

  8. 【COCOS2D-HTML5 开发之三】演示样例项目附源代码及执行的GIF效果图

    本站文章均为李华明Himi原创,转载务必在明显处注明:(作者新浪微博:@李华明Himi) 转载自[黑米GameDev街区] 原文链接: http://www.himigame.com/cocos2d- ...

  9. AspNetCore.Hosting

    Microsoft.AspNetCore.Hosting 有关Hosting的基础知识 Hosting是一个非常重要,但又很难翻译成中文的概念.翻译成:寄宿,大概能勉强地传达它的意思.我们知道,有一些 ...

  10. js获取网页屏幕可见区域高度

    document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...