android 点击效果动画增强
1.使用开源库制作view 的放大+透明度的动画
animate(v).scaleX(factor).scaleY(factor).alpha(0);
2. 设计回调接口
public interface ClickAnimation {
public void onClick(View v);
}
3. 在view 的onclick 的处理中增加动画的调用,并把以前的onclick事件处理 作为回调加入到animation中,在动画完成后回调处理函数。在动画结束时将view的状态恢复到原始状态
private void animateClickView(final View v, final ClickAnimation callback) {
float factor = 2;
animate(v).scaleX(factor).scaleY(factor).alpha(0).setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
ViewHelper.setScaleX(v, 1);
ViewHelper.setScaleY(v, 1);
ViewHelper.setAlpha(v, 1);
if (callback != null) {
callback.onClick(v);
}
super.onAnimationEnd(animation);
}
});
}
4. TODO:可以依据这个结构,添加更多动画效果。比如摇摆/震动等
实现效果参见youku视频:
http://v.youku.com/v_show/id_XNjYzOTI4NzMy.html
具体实现参加代码:
java文件
package com.buptfarmer.devapp;
import static com.nineoldandroids.view.ViewPropertyAnimator.animate;
import com.nineoldandroids.animation.Animator;
import com.nineoldandroids.animation.AnimatorListenerAdapter;
import com.nineoldandroids.view.ViewHelper;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
public class ClickAnimationExample extends Activity implements OnClickListener {
private Button aaaBtn;
private Button bbbBtn;
private ImageView bbbImg;
private Button cccBtn;
private TextView aaaText;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.click_animation_example);
initView();
}
private void initView() {
aaaBtn = (Button) findViewById(R.id.aaa_btn);
aaaBtn.setOnClickListener(this);
aaaText = (TextView) findViewById(R.id.aaa_text);
aaaText.setOnClickListener(this);
bbbBtn = (Button) findViewById(R.id.bbb_btn);
bbbBtn.setOnClickListener(this);
bbbImg = (ImageView) findViewById(R.id.bbb_img);
bbbImg.setOnClickListener(this);
}
private void animateClickView(final View v, final ClickAnimation callback) {
float factor = 2;
animate(v).scaleX(factor).scaleY(factor).alpha(0).setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
ViewHelper.setScaleX(v, 1);
ViewHelper.setScaleY(v, 1);
ViewHelper.setAlpha(v, 1);
if (callback != null) {
callback.onClick(v);
}
super.onAnimationEnd(animation);
}
});
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
animateClickView(v, new ClickAnimation() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
if (v == aaaBtn) {
Toast.makeText(getApplicationContext(), "aaaBtn has been clicked", Toast.LENGTH_SHORT)
.show();
} else if (v == aaaText) {
Toast.makeText(getApplicationContext(), "aaaText has been clicked", Toast.LENGTH_SHORT)
.show();
} else if (v == bbbBtn) {
Toast.makeText(getApplicationContext(), "bbbBtn has been clicked", Toast.LENGTH_SHORT)
.show();
} else if (v == bbbImg) {
Toast.makeText(getApplicationContext(), "bbbImg has been clicked", Toast.LENGTH_SHORT)
.show();
}
}
});
}
public interface ClickAnimation {
public void onClick(View v);
}
}
layout 布局文件
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<ImageView
android:id="@+id/bbb_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="bbb_img"
android:src="@drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="@+id/aaa_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="aaa" />
<TextView
android:id="@+id/aaa_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="aaa_text" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="@+id/bbb_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bbb" />
</LinearLayout>
<Button
android:id="@+id/ccc_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ccc" />
</LinearLayout>