android 用NineOldAndroid实现的弹出按钮

NineOldAndroid

1.首先上效果图:

左边这张是没有点击button的时候的效果,   右边这张是点击button 后是以该button为圆的展开5个button

                             

2.实现的思路是:

  1)在FrameLayout中将6个Button进行重叠,然后将主Button显示在最上面,其他Button可以隐藏掉。

  2)然后调用用NineOldAndroids来进行动画设置,在设置动画的时候要注意是以Button为中心的圆。所以要根据Button的位置来确定平移的x,y(处理的时候用到了三角函数)

3.在实现过程中遇到的一个问题:

   android AnimatorSet AnimationSet 的区别:

     简介: AnimatorSet 和 AnimationSet 都是动画集合。这里简单介绍下他们的异同,了解这些后在设计动画实现时才能得心应手。
     AnimationSet 我们最常用的是调用其 addAnimation 将一个个不一样的动画组织到一起来,然后调用view 的 startAnimation 方法触发这些动画执行。功能较弱不能做到把集合中的动画按一定顺序进行组织然后在执行的定制。

     AnimatorSet 我们最常用的是调用其play、before、with、after 等方法设置动画的执行顺序,然后调用其start 触发动画执行。

     AnimationSet 与 AnimatorSet 最大的不同在于,AnimationSet 使用的是 Animation 子类、AnimatorSet 使用的是 Animator 的子类。

     Animation 是针对视图外观的动画实现,动画被应用时外观改变但视图的触发点不会发生变化,还是在原来定义的位置。

     Animator  是针对视图属性的动画实现,动画被应用时对象属性产生变化,最终导致视图外观变化。

4.代码:

MianActivity

  1 public class MainActivity extends Activity implements OnClickListener {
  2
  3     private Button main, one, two, three, four, five;
  4
  5     private boolean isShow = false;
  6
  7     @Override
  8     protected void onCreate(Bundle savedInstanceState) {
  9         super.onCreate(savedInstanceState);
 10         setContentView(R.layout.activity_main);
 11
 12         initView();
 13     }
 14
 15     private void initView() {
 16         main = (Button) findViewById(R.id.Main);
 17         one = (Button) findViewById(R.id.one);
 18         two = (Button) findViewById(R.id.two);
 19         three = (Button) findViewById(R.id.three);
 20         four = (Button) findViewById(R.id.four);
 21         five = (Button) findViewById(R.id.five);
 22         main.setOnClickListener(this);
 23         one.setOnClickListener(this);
 24         two.setOnClickListener(this);
 25         three.setOnClickListener(this);
 26         four.setOnClickListener(this);
 27         five.setOnClickListener(this);
 28     }
 29
 30     @Override
 31     public void onClick(View v) {
 32         switch (v.getId()) {
 33         case R.id.Main:
 34             if (!isShow) {
 35                 isShow = true;
 36                 animationShow(one, 1, 5, 300);
 37                 animationShow(two, 2, 5, 300);
 38                 animationShow(three, 3, 5, 300);
 39                 animationShow(four, 4, 5, 300);
 40                 animationShow(five, 5, 5, 300);
 41
 42             } else {
 43                 isShow = false;
 44                 animationHint(one, 1, 5, 300);
 45                 animationHint(two, 2, 5, 300);
 46                 animationHint(three, 3, 5, 300);
 47                 animationHint(four, 4, 5, 300);
 48                 animationHint(five, 5, 5, 300);
 49             }
 50
 51             break;
 52         case R.id.one:
 53             Toast.makeText(MainActivity.this, "点击了" + one, Toast.LENGTH_SHORT)
 54                     .show();
 55             break;
 56         case R.id.two:
 57             Toast.makeText(MainActivity.this, "点击了" + two, Toast.LENGTH_SHORT)
 58                     .show();
 59             break;
 60         case R.id.three:
 61             Toast.makeText(MainActivity.this, "点击了" + three, Toast.LENGTH_SHORT)
 62                     .show();
 63             break;
 64         case R.id.four:
 65             Toast.makeText(MainActivity.this, "点击了" + four, Toast.LENGTH_SHORT)
 66                     .show();
 67             break;
 68         case R.id.five:
 69             Toast.makeText(MainActivity.this, "点击了" + five, Toast.LENGTH_SHORT)
 70                     .show();
 71             break;
 72         }
 73     }
 74
 75     private void animationShow(View view, int index, int total, int radius) {
 76         if (view != null) {
 77             view.setVisibility(View.VISIBLE);
 78         }
 79
 80         // 根据三角函数来获得view平移的x,和y
 81         double degree = index * Math.PI / (2 * total);
 82         int translateX = (int) ((int) radius * Math.sin(degree));
 83         int translateY = (int) ((int) radius * Math.cos(degree));
 84         AnimatorSet set = new AnimatorSet();
 85         set.playTogether(
 86                 ObjectAnimator.ofFloat(view, "translationX", 0, translateX),
 87                 ObjectAnimator.ofFloat(view, "translationY", 0, translateY),
 88                 ObjectAnimator.ofFloat(view, "scaleX", 0f, 1f),
 89                 ObjectAnimator.ofFloat(view, "scaleY", 0f, 1f),
 90                 ObjectAnimator.ofFloat(view, "alpha", 0f, 1f));
 91         set.start();
 92
 93     }
 94
 95     private void animationHint(View view, int index, int total, int radius) {
 96         if (view != null) {
 97             view.setVisibility(View.VISIBLE);
 98         }
 99
100         // 根据三角函数来获得view平移的x,和y
101         double degree = index * Math.PI / (2 * total);
102         int translateX = (int) ((int) radius * Math.sin(degree));
103         int translateY = (int) ((int) radius * Math.cos(degree));
104         AnimatorSet set = new AnimatorSet();
105         set.playTogether(
106                 ObjectAnimator.ofFloat(view, "translationX", translateX, 0),
107                 ObjectAnimator.ofFloat(view, "translationY", translateY, 0),
108                 ObjectAnimator.ofFloat(view, "scaleX", 1f, 0f),
109                 ObjectAnimator.ofFloat(view, "scaleY", 1f, 0f),
110                 ObjectAnimator.ofFloat(view, "alpha", 1f, 0f));
111         set.start();
112
113     }
114
115 }
activity_main.xml:
 1 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:paddingBottom="@dimen/activity_vertical_margin"
 6     android:paddingLeft="@dimen/activity_horizontal_margin"
 7     android:paddingRight="@dimen/activity_horizontal_margin"
 8     android:paddingTop="@dimen/activity_vertical_margin"
 9     tools:context=".MainActivity" >
10
11     <FrameLayout
12         android:layout_width="match_parent"
13         android:layout_height="match_parent" >
14
15         <Button
16             android:id="@+id/one"
17             android:layout_width="40dp"
18             android:layout_height="40dp"
19             android:background="@drawable/circle2"
20             android:visibility="gone" />
21
22         <Button
23             android:id="@+id/two"
24             android:layout_width="40dp"
25             android:layout_height="40dp"
26             android:background="@drawable/circle3"
27             android:visibility="gone" />
28
29         <Button
30             android:id="@+id/three"
31             android:layout_width="40dp"
32             android:layout_height="40dp"
33             android:background="@drawable/circle4"
34             android:visibility="gone" />
35
36         <Button
37             android:id="@+id/four"
38             android:layout_width="40dp"
39             android:layout_height="40dp"
40             android:background="@drawable/circle5"
41             android:visibility="gone" />
42
43         <Button
44             android:id="@+id/five"
45             android:layout_width="40dp"
46             android:layout_height="40dp"
47             android:background="@drawable/circle6"
48             android:visibility="gone" />
49
50         <Button
51             android:id="@+id/Main"
52             android:layout_width="40dp"
53             android:layout_height="40dp"
54             android:background="@drawable/circle1" />
55     </FrameLayout>
56
57 </RelativeLayout>

源码下载地址:源码

android 用NineOldAndroid实现的弹出按钮

时间: 2024-10-05 12:27:02

android 用NineOldAndroid实现的弹出按钮的相关文章

Android点击列表后弹出输入框,所点击项自动滚动到输入框上方(类似微信的评论)

Android点击列表后弹出输入框,所点击项自动滚动到输入框上方 使用微信的朋友圈会发现,点击某一条评论后输入框会弹出来,然后所点击的那一项会自动地滚动到输入框上方的位置,这样如果开始所点击的评论在屏幕很下方的话,就不会被输入框遮住,虽然微信这一点在我的MX2频繁点几次后滚动的位置就完全错误了,但据说在有些机型上效果还不错,还有其他地方可能会有类似的需求,比如登录时软键盘可能会把登录按钮遮住. 要实现这个功能需要注意的地方主要有两点: 什么时候进行滚动操作,以及有可能还需要在输入框消失时回滚回去

【Android】android PopupWindow实现从底部弹出或滑出选择菜单或窗口

转载自:android PopupWindow实现从底部弹出或滑出选择菜单或窗口 Android PopupWindow的使用和分析 Popupwindow的使用 PopupWindow用法

Android ListView 长按列表弹出菜单

Android ListView 长按列表弹出菜单 设置长按菜单 listView.setOnCreateContextMenuListener(new View.OnCreateContextMenuListener() { @Override public void onCreateContextMenu(ContextMenu menu, View v, ContextMenuInfo menuInfo) { menu.add(0, 0, 0, "删除单号"); menu.add

在Mint 16中当按下光驱的弹出按钮后桌面上的光驱图标没有自动消失的问题解决

/*********************************************************************  * Author  : Samson  * Date    : 07/29/2014  * Test platform:  *              Mint 16  *              GNU bash, version 4.2.45  * *************************************************

android PopupWindow实现从底部弹出或滑出选择菜单或窗口

本实例弹出窗口主要是继承PopupWindow类来实现的弹出窗体,布局可以根据自己定义设计.弹出效果主要使用了translate和alpha样式实现,具体实习如下: 第一步:设计弹出窗口xml: Xml代码   <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&qu

Android Demo---实现从底部弹出窗口

在前面的博文中,小编简单的介绍了如何制作圆角的按钮以及圆角的图片,伴着键盘和手指之间的舞步,迎来新的问题,不知道小伙伴有没有这样的经历,以App为例,点击头像的时候,会从底部弹出一个窗口,有从相册中选择.拍照.取消的字样,点击相应的按钮,完成相应的操作,在小编做项目的过程中遇到类似的问题,小编经过一番捣鼓,终于搞定了ing,今天这篇博文博文,小编简单的介绍一下,如何点击头像,实现从底部弹出窗口的故事,这个故事实现的是弹出滑动窗口,主要是使用了一些设置Activity的样式来实现弹出效果和滑动效果

android Activity实现从底部弹出或滑出选择菜单或窗口

alert_dialog.Xml代码   <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_con

android中使用PopupWindow实现弹出窗口菜单

结合上篇android中使用ViewPager实现图片拖动,我们实现了点击“帮助”按钮的功能,这一篇则是接着上一篇,让我们一起来完成“我的”按钮的功能,这一功能,则是使用PopupWindow来实现弹出菜单. 再上项目结构图,如图: 从项目结构图可见,我们这里并没有新建新的Activity,因为“我的”按钮和“帮助”是在一个页面的,所以,我们只需新建一个效果图中的,弹出菜单的布局文件即可,即popup_menu.xml,代码如下: Xml代码 <? xml version = "1.0&q

Android常用的五种弹出对话框

一个Android开发中常用对话框的小例子,共有五种对话框:普通弹出对话框,单选对话框,多选对话框,输入对话框及进度条样式对话框: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"