Question

我尝试制作如下所示的菜单动画：

从此site

但到目前为止，我失败了。我尝试使用ObjectAnimator，TranstionSet等但无法获得相同的效果。我得到的是这个.. [见下图]

我的图片在自己的位置上弹跳。请理解我的目标是为这些图像获得相同的过渡/动画效果。我尝试在网上搜索但是徒劳无功，看到了很多关于动画的代码而没有任何解释。如果有人能提供代码或指导我实现这个动画，将不胜感激。我真的很困惑android的转换和动画库。任何帮助将不胜感激。注意：上图中的反向效果[退出]也是

我目前的代码供参考（我确实尝试了其他方式[失败]。）布局

＆＃13;

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/cal_menu"
    android:visibility="invisible"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:background="#FF9900"
    android:padding="16dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp">
        <ImageView
            android:id="@+id/img1"
            android:src="@drawable/ic_action_paste"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content" />
        <ImageView
            android:id="@+id/img2"
            android:src="@drawable/ic_action_paste"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content" />
        <ImageView
            android:id="@+id/img3"
            android:src="@drawable/ic_action_paste"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp">
        <ImageView
            android:id="@+id/img4"
            android:src="@drawable/ic_action_paste"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content" />
        <ImageView
            android:id="@+id/img5"
            android:src="@drawable/ic_action_paste"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content" />
        <ImageView
            android:id="@+id/img6"
            android:src="@drawable/ic_action_paste"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content" />
    </LinearLayout>
</LinearLayout>

＆＃13;

  private void initializeDummyFields(View view){
    cal_menu = (LinearLayout)view.findViewById(R.id.cal_menu);
    img1 = (ImageView) view.findViewById(R.id.img1);
    img2 = (ImageView) view.findViewById(R.id.img2);
    img3 = (ImageView) view.findViewById(R.id.img3);
    img4 = (ImageView) view.findViewById(R.id.img4);
    img5 = (ImageView) view.findViewById(R.id.img5);
    img6 = (ImageView) view.findViewById(R.id.img6);
}

private void dummyAnimation(){
    cal_menu.setVisibility(View.VISIBLE);
    Animation animation = new TranslateAnimation(0, 0, 0, 1);
    animation.setDuration(300);
    cal_menu.setAnimation(animation);
    animation.start();

    Animation animation6 =  new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
            Animation.RELATIVE_TO_PARENT, -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    animation6.setDuration(1000);
    animation6.setStartOffset(300);
    animation6.setInterpolator(new BounceInterpolator());
    img6.setAnimation(animation6);
    animation6.start();

    Animation animation5 =  new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
            Animation.RELATIVE_TO_PARENT, -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    animation5.setDuration(1000);
    animation5.setStartOffset(400); //setting different startOffset so they start at different time
    animation5.setInterpolator(new BounceInterpolator());
    img5.setAnimation(animation5);
    animation5.start();

    Animation animation4 =  new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
            Animation.RELATIVE_TO_PARENT, -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    animation4.setDuration(1000);
    animation4.setStartOffset(500);
    animation4.setInterpolator(new BounceInterpolator());
    img4.setAnimation(animation4);
    animation4.start();

    Animation animation3 = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
            Animation.RELATIVE_TO_PARENT, -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    animation3.setDuration(1000);
    animation3.setStartOffset(600);
    animation3.setInterpolator(new BounceInterpolator());
    img3.setAnimation(animation3);
    animation3.start();

    Animation animation2 = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
            Animation.RELATIVE_TO_PARENT, -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    animation2.setDuration(1000);
    animation2.setStartOffset(700);
    animation2.setInterpolator(new BounceInterpolator());
    img2.setAnimation(animation2);
    animation2.start();

    Animation animation1 = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
            Animation.RELATIVE_TO_PARENT, -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    animation1.setDuration(1000);
    animation1.setStartOffset(800);
    animation1.setInterpolator(new BounceInterpolator());
    img1.setAnimation(animation1);
    animation1.start();
}

如何实现此菜单下拉动画？

0 个答案: