一 类似全民飞机大战那种按钮点击之后缩小一点马上回复的效果。
另外长按缩的更小。
用scaleanimation来实现
类似这样
/*
* animate scale
*/
final ScaleAnimation animation =new ScaleAnimation(1.0f,0.8f, 1.0f, 0.8f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
left_lin=(LinearLayout)findViewById(R.id.left_lin);
left_lin.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
/*
* animate scale
*/
animation.setDuration(500);
left_lin.startAnimation(animation);
}
});
效果蛮不错的,1.0代表原始大小,0.8是缩放后的大小,Animation.RELATIVE_TO_SELF是指相对自己来说,0.5f是x轴或者Y轴缩放中心点坐标。
2.浮层按钮效果 很多app现在为了突出某个功能,会有一个浮在界面内容上面的类似蓝色图标的按钮。
http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1028/1857.html 记录了这个实现方法
还有一个大神搜集了一个网站,总结了一些开源的免费的特效
http://www.open-open.com/lib/view/open1411443332703.html
收集android上开源的酷炫的交互动画和视觉效果:Interactive-animation
以下摘抄
要实现float action button可以有多种方法,一种只适合android L,另外一种适合任意版本。
用ImageButton实现
这种方式其实是在ImageButton的属性中使用了android L才有的一些特性:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<ImageButton
android:layout_width= "56dp"
android:layout_height= "56dp"
android:src= "@drawable/plus"
android:layout_alignParentBottom= "true"
android:layout_alignParentRight= "true"
android:layout_marginRight= "16dp"
android:layout_marginBottom= "16dp"
android:tint= "@android:color/white"
android:id= "@+id/fab"
android:elevation= "1dp"
android:background= "@drawable/ripple"
android:stateListAnimator= "@anim/fab_anim"
/>
|
仔细一点,你会发现我们将这个ImageButton放到了布局的右下角,为了实现float action button应该具备的效果,需要考虑以下几个方面:
·Background
·Shadow
·Animation
背景上我们使用ripple drawable来增强吸引力。注意上面的xml代码中我们将background设置成了@drawable/ripple ,ripple drawable的定义如下:
1
2
3
4
5
6
7
|
<ripple xmlns:android= "http://schemas.android.com/apk/res/android" android:color= "?android:colorControlHighlight" >
<item>
<shape android:shape= "oval" >
<solid android:color= "?android:colorAccent" />
</shape>
</item>
</ripple>
|
既然是悬浮按钮,那就需要强调维度上面的感觉,当按钮被按下的时候,按钮的阴影需要扩大,并且这个过程是渐变的,我们使用属性动画去改变translatioz。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<selector xmlns:android= "http://schemas.android.com/apk/res/android" >
<item
android:state_enabled= "true"
android:state_pressed= "true" >
<objectAnimator
android:duration= "@android:integer/config_shortAnimTime"
android:propertyName= "translationZ"
android:valueFrom= "@dimen/start_z"
android:valueTo= "@dimen/end_z"
android:valueType= "floatType" />
</item>
<item>
<objectAnimator
android:duration= "@android:integer/config_shortAnimTime"
android:propertyName= "translationZ"
android:valueFrom= "@dimen/end_z"
android:valueTo= "@dimen/start_z"
android:valueType= "floatType" />
</item>
</selector>
|
使用自定义控件的方式实现悬浮按钮
这种方式不依赖于android L,而是码代码。
首先定义一个这样的类:
1
2
3
|
public class CustomFAB extends ImageButton {
...
}
|
然后是读取一些自定义的属性(假设你了解styleable的用法)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
private void init(AttributeSet attrSet) {
Resources.Theme theme = ctx.getTheme();
TypedArray arr = theme.obtainStyledAttributes(attrSet, R.styleable.FAB, 0, 0);
try {
setBgColor(arr.getColor(R.styleable.FAB_bg_color, Color.BLUE));
setBgColorPressed(arr.getColor(R.styleable.FAB_bg_color_pressed, Color.GRAY));
StateListDrawable sld = new StateListDrawable();
sld.addState( new int[] {android.R.attr.state_pressed}, createButton(bgColorPressed));
sld.addState( new int[] {}, createButton(bgColor));
setBackground(sld);
}
catch (Throwable t) {}
finally {
arr.recycle();
}
}
|
在xml中我们需要加入如下代码,一般是在attr.xml文件中。
1
2
3
4
5
6
7
8
|
<?xml version= "1.0" encoding= "utf-8" ?>
<resources>
<declare-styleable name= "FAB" >
<!-- Background color -->
<attr name= "bg_color" format= "color|reference" />
<attr name= "bg_color_pressed" format= "color|reference" />
</declare-styleable>
</resources>
|
使用StateListDrawable来实现不同状态下的背景
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
private Drawable createButton(int color) {
OvalShape oShape = new OvalShape();
ShapeDrawable sd = new ShapeDrawable(oShape);
setWillNotDraw( false );
sd.getPaint().setColor(color);
OvalShape oShape1 = new OvalShape();
ShapeDrawable sd1 = new ShapeDrawable(oShape);
sd1.setShaderFactory( new ShapeDrawable.ShaderFactory() {
@Override
public Shader resize(int width, int height) {
LinearGradient lg = new LinearGradient(0,0,0, height,
new int[] {
Color.WHITE,
Color.GRAY,
Color.DKGRAY,
Color.BLACK
}, null , Shader.TileMode.REPEAT);
return lg;
}
});
LayerDrawable ld = new LayerDrawable( new Drawable[] { sd1, sd });
ld.setLayerInset(0, 5, 5, 0, 0);
ld.setLayerInset(1, 0, 0, 5, 5);
return ld;
}
|
最后将控件放xml中:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<RelativeLayout xmlns:android= "http://schemas.android.com/apk/res/android"
xmlns:tools= "http://schemas.android.com/tools"
xmlns:custom= "http://schemas.android.com/apk/res/com.survivingwithandroid.fab"
android:layout_width= "match_parent"
android:layout_height= "match_parent"
android:paddingLeft= "@dimen/activity_horizontal_margin"
android:paddingRight= "@dimen/activity_horizontal_margin"
android:paddingTop= "@dimen/activity_vertical_margin"
android:paddingBottom= "@dimen/activity_vertical_margin"
tools:context= ".MyActivity" >
...
<com.survivingwithandroid.fab.CustomFAB
android:layout_width= "56dp"
android:layout_height= "56dp"
android:src= "@android:drawable/ic_input_add"
android:layout_alignParentBottom= "true"
android:layout_alignParentRight= "true"
android:layout_marginRight= "16dp"
android:layout_marginBottom= "16dp"
custom:bg_color= "@color/light_blue"
android:tint= "@android:color/white"
/>
</RelativeLayout>
|
时间: 2024-08-29 11:53:30