小天一如既往的给大家带来最简单最实用的右菜单回弹效果,希望对大家有所帮助!
首先还是讲一下功能和原理:就是当你点击右边菜单的时候,会出现4个子菜单,当然大家也可以根据自己的需求设置子菜单的个数,然后回弹菜单的特效就是这四个菜单是从右边弹出来的,然后又有一段回弹的效果。其实原理很简单,就是Animation的移动效果,先向左滑一段距离然后再向右滑一段距离,多的就不多说了,当你看过之后就知道其实很简单了。
首先看一下布局页面
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context="gulubaobao.com.demo.MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:background="@android:color/holo_red_dark">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20dp"
android:layout_centerInParent="true"
android:text="主页"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20dp"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:text="菜单"
android:onClick="onMainClick"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/main_caidan_relative"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
<LinearLayout
android:layout_width="150dp"
android:layout_height="200dp"
android:layout_alignParentRight="true"
android:layout_marginTop="50dp"
android:orientation="vertical">
<TextView
android:id="@+id/main_text_caidan_one"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="菜单一"
android:layout_weight="1"
android:textSize="18dp"/>
<TextView
android:id="@+id/main_text_caidan_two"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="菜单二"
android:layout_weight="1"
android:textSize="18dp"/>
<TextView
android:id="@+id/main_text_caidan_three"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="菜单三"
android:layout_weight="1"
android:textSize="18dp"/>
<TextView
android:id="@+id/main_text_caidan_four"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="菜单四"
android:layout_weight="1"
android:textSize="18dp"/>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
接下来是主方法:
MainActivity.java
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.TranslateAnimation;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
public RelativeLayout relativeLayout;
public TextView one,two,three,four;
public AnimationSet animationSet,animationSet2,animationSet3,animationSet4;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化控件
one = (TextView) findViewById(R.id.main_text_caidan_one);
two = (TextView) findViewById(R.id.main_text_caidan_two);
three = (TextView) findViewById(R.id.main_text_caidan_three);
four = (TextView) findViewById(R.id.main_text_caidan_four);
relativeLayout = (RelativeLayout) findViewById(R.id.main_caidan_relative);
addAnimation();//添加需要用到的动画效果
//添加菜单子选项的点击事件
one.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"one",Toast.LENGTH_SHORT).show();
}
});
two.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"two",Toast.LENGTH_SHORT).show();
}
});
three.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"three",Toast.LENGTH_SHORT).show();
}
});
four.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"four",Toast.LENGTH_SHORT).show();
}
});
}
/**
* 添加需要用到的动画效果
*/
private void addAnimation() {
//创建动画
animationSet = new AnimationSet(true);
TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 1f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation.setDuration(500);
animationSet.addAnimation(translateAnimation);
TranslateAnimation translateAnimation2 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0.2f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation2.setDuration(200);
translateAnimation2.setStartOffset(500);
animationSet.setFillAfter(true);
animationSet.addAnimation(translateAnimation2);
animationSet2 = new AnimationSet(true);
TranslateAnimation translateAnimation3 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 1f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation3.setDuration(500);
translateAnimation3.setStartOffset(100);
animationSet2.addAnimation(translateAnimation3);
TranslateAnimation translateAnimation4 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0.2f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation4.setDuration(200);
translateAnimation4.setStartOffset(600);
animationSet2.setFillAfter(true);
animationSet2.addAnimation(translateAnimation4);
animationSet3 = new AnimationSet(true);
TranslateAnimation translateAnimation5 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 1f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation5.setDuration(500);
translateAnimation5.setStartOffset(200);
animationSet3.addAnimation(translateAnimation5);
TranslateAnimation translateAnimation6 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0.2f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation6.setDuration(200);
translateAnimation6.setStartOffset(700);
animationSet3.setFillAfter(true);
animationSet3.addAnimation(translateAnimation6);
animationSet4 = new AnimationSet(true);
TranslateAnimation translateAnimation7 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 1f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation7.setDuration(500);
translateAnimation7.setStartOffset(300);
animationSet4.addAnimation(translateAnimation7);
TranslateAnimation translateAnimation8 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0.2f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
translateAnimation8.setDuration(200);
translateAnimation8.setStartOffset(800);
animationSet4.setFillAfter(true);
animationSet4.addAnimation(translateAnimation8);
}
/**
* 菜单的点击事件
* @param v
*/
public void onMainClick(View v){
if(relativeLayout.isShown()){
relativeLayout.setVisibility(View.GONE);//如果页面显示将其隐藏
}else{
relativeLayout.setVisibility(View.VISIBLE);//如果页面隐藏将其显示
//调用动画
one.startAnimation(animationSet);
two.startAnimation(animationSet2);
three.startAnimation(animationSet3);
four.startAnimation(animationSet4);
}
}
}
一共就这么多,如果大家觉得好,请点个赞,谢谢!
大家如果需要源码可以去http://download.csdn.net/detail/u012600997/9437000下载,不过需要1资源分哟,所以大家还是看代码吧