首先,将整个菜单动画分解开来。
1.一级菜单按钮的旋转动画2个,十字和叉叉状态的转换。
2.二级菜单按钮的平移动画2个,弹簧效果的in和out
3.二级菜单按钮的点击效果,放大消失,其他未点击按钮缩小消失。
4.一级菜单按钮的恢复效果,放大出现
现在 逐一去实现:
首先是一级菜单按钮的旋转动画,这2个动画可以直接在xml中定义,然后load到代码中来,具体代码如下:
rotate_story_add_button_in.xml
[code="java"]<?xml version="1.0" encoding="UTF-8"?><rotate xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/linear_interpolator" android:duration="150" android:fromdegrees="0.0" android:todegrees="-225.0" android:pivotx="50.0%" android:pivoty="50.0%" android:fillafter="true" android:fillenabled="true"></rotate>[/code]
rotate_story_add_button_out.xml
[code="java"]<?xml version="1.0" encoding="UTF-8"?><rotate xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/linear_interpolator" android:duration="150" android:fromdegrees="-225.0" android:todegrees="0.0" android:pivotx="50.0%" android:pivoty="50.0%" android:fillafter="true" android:fillenabled="true"></rotate>[/code]
这2段没什么好说的,定义好角度即可。
接下来是需要我们在代码中定义的动画部分,这几个动画的部分需要定义一个基类,作为统一的调用接口,这个基类被称作InOutAnimation,继承自AnimationSet,这个基类的主要工作是为view提供in和out两种不同的状态时的动画效果。其子类需要实现2个方法:
[code="java"]1 protected abstract void addInAnimation(View aview[]);
2 protected abstract void addOutAnimation(View aview[]);[/code]
从而进行view的入场和离场动画。
下面是InOutAnimation的代码部分:
[code="java"]public abstract class InOutAnimation extends AnimationSet {
public Direction direction;
public enum Direction {
IN, OUT;
}
public InOutAnimation(Direction direction, long l, View[] aview) {
super(true);
this.direction = direction;
switch (this.direction) {
case IN:
addInAnimation(aview);
break;
case OUT:
addOutAnimation(aview);
break;
}
setDuration(l);
}
protected abstract void addInAnimation(View aview[]);
protected abstract void addOutAnimation(View aview[]);
}[/code]
接下来就是重头戏啦,二级菜单按钮的平移动画。
这部分动画看起来可能会比较复杂和神秘,其实不然,当把整个动画过程分解开来的时候,都是最最简单的平移而已,我们要做的只是定义一下平移的起点和终点、开始动画的顺序以及插值(Interpolator),让整个过程看起来很炫。
先说动画的起点和终点吧,起点很简单,就是整个view的左下角,即0,0点,为了效果漂亮一些,我们稍微的将左下角位置定义的有一些偏移,经验上的值是16,-13,这个点的位置看你心情而定咯~ 好 终点就是你想让他在的点上就好了,终点我们将定义到layout中去,为这个2级菜单指定一个margin的值就好。
还是上代码比较直观:
动画如下:
1 收缩部分:TranslateAnimation(xOffset + -mlp.leftMargin, 0F,yOffset + mlp.bottomMargin, 0F)
2 扩张部分:TranslateAnimation(0F, xOffset + -mlp.leftMargin, 0F,yOffset + mlp.bottomMargin)
位置定义部分:
例如:
android:layout_marginBottom="142dp" android:layout_marginLeft="10.667dp"
这个位置大家可以直观的在布局文件中看到,详细的布局文件也将在下面展示。
以上是单独的每一个二级按钮的动画,而组合的动画就是指定了一下开始的时间差以及插值:
这个就是奥妙所在了,OvershootInterpolator AnticipateInterpolator 这2个插值器提供了弹力效果。
整段的代码如下:
ComposerButtonAnimation.java
[code="java"]位置定义部分:
例如:
android:layout_marginBottom="142dp" android:layout_marginLeft="10.667dp"
这个位置大家可以直观的在布局文件中看到,详细的布局文件也将在下面展示。
以上是单独的每一个二级按钮的动画,而组合的动画就是指定了一下开始的时间差以及插值:
这个就是奥妙所在了,OvershootInterpolator AnticipateInterpolator 这2个插值器提供了弹力效果。
整段的代码如下:
ComposerButtonAnimation.java
[code="java"]public class ComposerButtonAnimation extends InOutAnimation {
public static final int DURATION = 500;
private static final int xOffset = 16;
private static final int yOffset = -13;
public ComposerButtonAnimation(Direction direction, long l, View view) {
super(direction, l, new View[] { view });
}
public static void startAnimations(ViewGroup viewgroup,
InOutAnimation.Direction direction) {
switch (direction) {
case IN:
startAnimationsIn(viewgroup);
break;
case OUT:
startAnimationsOut(viewgroup);
break;
}
}
private static void startAnimationsIn(ViewGroup viewgroup) {
for (int i = 0; i
分享到:
相关推荐
Path 2.0是一款流行的社交网络应用,...通过研究和分析Path 2.0的菜单源码,开发者可以学习到如何构建高效、优雅的Android界面,以及如何实现高级交互效果。这些知识对于提升Android应用的用户体验具有重要的实践价值。
在Axure中实现这一效果,需要设计师对每个菜单项的位置、大小和动画效果进行精细调整,确保在不同设备上都能呈现出良好的视觉效果和触感反馈。 其次,了解Axure的基础功能是构建Path2.0菜单的前提。例如,我们需要...
本文将深入探讨如何利用Android属性动画(Property Animation)来实现Path2.0风格的菜单效果,这一效果通常是通过平滑的路径变换来实现的,给人一种现代而优雅的感觉。 首先,我们要理解Android属性动画的概念。...
"高仿path2.0扇形效果"是一个典型的例子,它展示了如何利用布局和动画来创建与PATH应用相似的菜单展示方式。这种扇形效果能吸引用户的注意力,提供独特的交互体验。接下来,我们将深入探讨如何利用Android的布局和...
【Android 源码分析:PathButton 扇形旋转菜单】 在 Android 开发中,为了提升用户体验和界面的美观度,开发者经常会使用各种创新的UI控件。PathButton 就是一个这样的例子,它是一个实现扇形旋转效果的菜单按钮。...
本篇文章将详细解析如何在Android中实现类似Path 2.0的菜单功能,通过分析提供的"TestPath"源代码,我们可以学习到一些核心技术和设计理念。 首先,让我们了解菜单的基本结构。在Android中,菜单通常分为两种类型:...
【Android应用源码之PathButton(扇形旋转菜单)】是一个Android开发相关的资源,它包含了一个实现扇形旋转菜单的源代码示例。这个菜单在用户交互时会以扇形的方式展开或收起,通常用于提供多选项或者增强用户体验。在...
3. **NavigationView**: 在Android中,NavigationView是一个常用的组件,常用于侧滑菜单的实现。它可以与DrawerLayout配合,提供一个可滑出的侧边栏,显示各种菜单选项。从描述来看,Path2.0可能利用了这个组件来...
在Android中实现这种效果,主要涉及以下几个技术点: 1. **图形绘制**:扇形菜单的核心在于扇形的绘制。这通常需要利用`Canvas`类和`Paint`类进行定制化画图。开发者需要计算每个扇叶的角度、半径以及它们在屏幕上...
"Android Path 菜单效果 Satellite Menu"是一个实现炫酷旋转菜单的项目,它利用Path2.0技术为用户提供了一种新颖的操作方式。这种菜单在用户点击主按钮后,会从按钮周围弹出一系列小按钮,再次点击小按钮时,所有小...
在本教程中,我们将深入探讨如何在Android应用中实现一个简洁的PATH菜单,特别是旋转菜单。 首先,我们需要理解"旋转菜单"的概念。旋转菜单是一种特殊的PATH菜单,它的呈现方式是随着用户的操作,菜单项会以旋转...
在Android中,可以重写onDraw()方法来绘制菜单项,并在触摸事件中更新角度,从而实现平滑的拖动效果。 4. **图形绘制**:Android提供了Canvas类,允许开发者在屏幕上绘制各种形状,包括圆形和弧线。我们可以利用...
使用`ObjectAnimator`或`ValueAnimator`,可以控制每个菜单项的平移和缩放,以实现扇形的展开和收缩动画。 5. **事件监听**:每个菜单项应有对应的点击事件处理。在自定义View中,可以通过设置`OnClickListener`来...
在Android应用开发中,网络请求是必不可少的一部分,而Retrofit2.0则是一个非常流行的、由Square公司开发的网络请求库。它通过简洁的接口设计,使得网络调用变得直观且易于管理。在这个Demo中,开发者展示了如何集成...
在这个项目中,我们将深入探讨如何在Android中实现这样的按钮效果。 首先,我们要了解`Path`对象在Android图形绘制中的作用。`Path`类是用于定义路径的,它可以包含直线、曲线等几何形状,并且可以用来填充或描边。...
此款源码实现了Path2.0菜单的多种效果,旨在帮助开发者理解和掌握如何在自己的应用程序中实现类似的功能。下面将详细探讨相关知识点。 1. **Android界面设计**:Android应用的用户界面设计是吸引用户的关键因素之一...
- `实现Path2.0中绚丽的的旋转菜单-Android 实例教程-eoe Android开发者社区 - Powered by Discuz!.htm` 这个文件可能介绍了如何基于Path2.0的旋转菜单效果进行开发,Path2.0是Google设计的一款应用程序,其旋转菜单...
【Android应用源码之PathButton(扇形旋转菜单)】是一个深入探讨Android应用程序开发的案例,主要关注自定义视图的实现,特别是PathButton,它是一个具有扇形旋转效果的菜单组件。在Android开发中,自定义视图是提升...
这个压缩包可能包含了一个实现此类菜单的示例项目,让我们来详细探讨一下这种菜单的设计理念以及如何在Android应用中实现它。 首先,圆形旋转菜单的核心概念是利用旋转动画和触摸事件来展示一系列选项。用户点击或...
通过改变子图层的位置、角度和大小,可以实现扇形展开和收缩的效果。 4. **CGAffineTransform**:用于旋转、缩放和位移图层的关键工具是`CGAffineTransform`。通过调整这个变换矩阵,我们可以让菜单项以特定的角度...