zoukankan      html  css  js  c++  java
  • Android编程权威指南第三版 第32章

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 本文链接:https://blog.csdn.net/qq_35564145/article/details/90005345

    1.首先,让日落可逆。也就是说,点击屏幕,等太阳落下后,再次点击屏幕,让太阳升起来。 动画集不能逆向执行,因此,你需要新建一个AnimatorSet。

    2.第二个挑战是添加太阳动画特效,让它有规律地放大、缩小或是加一圈旋转的光线。(这实际是反复执行一段动画特效,可考虑使用ObjectAnimator的setRepeatCount(int)方法。) 另外,海面上要是有太阳的倒影就更真实了。

    3.最后,再来看个颇具挑战的练习。在日落过程中实现动画反转。在太阳慢慢下落时点击屏幕, 让太阳无缝回升至原来所在的位置。或者,在太阳落下进入夜晚时点击屏幕,让太阳重新升回天 空,就像日出。

    一、日落可逆

    这部分比较简单,根据提示新建新的动画和动画集就可以,直接上代码

    1
    2
    3
    4
    5
    6
    7
    8
     //上升动画
    sun_upAnimator = ObjectAnimator.ofFloat(mSunView, "y", sunYFirstEnd,sunYFirstStart).setDuration(3000);
    sun_upAnimator.setInterpolator(new AccelerateInterpolator());
    //上升动画集
    sun_upAnimatorSet = new AnimatorSet();
    sun_upAnimatorSet.play(sun_upAnimator)
    .with(sunsetSkyAnimator)
    .before(nightSkyAnimator);

    二、太阳动画特效

    这部分主要涉及缩放动画、旋转动画,提示使用ObjectAnimator的setRepeatCount(int)方法,但是我并未使用,我的代码如下

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
     //变大
    bigXAnimator = ObjectAnimator.ofFloat(mSunView,"scaleX",1.0f,2.0f).setDuration(3000);
    bigYAnimator = ObjectAnimator.ofFloat(mSunView,"scaleY",1.0f,2.0f).setDuration(3000);
    //变小
    smallXAnimator = ObjectAnimator.ofFloat(mSunView,"scaleX",2.0f,1.0f).setDuration(3000);
    smallYAnimator = ObjectAnimator.ofFloat(mSunView,"scaleY",2.0f,1.0f).setDuration(3000);

    //旋转特效
    //顺时针
    clockwiseAnimator = ObjectAnimator.ofFloat(mSunView,"rotation",0f,720f).setDuration(3000);
    //逆时针
    anti_clockwiseAnimator = ObjectAnimator.ofFloat(mSunView,"rotation",360f,0f).setDuration(3000);

    旋转动画特别说明:通过旋转sun来实现旋转的光线的效果,所以修改sun.xml给sun加上边框间断线

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android = "http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@color/bright_sun"/>

    <stroke
    android:width="2dp"
    android:color="@color/huawei_red"
    android:dashWidth="25dp"
    android:dashGap="8dp"/>
    </shape>

    以上动画直接.with()加到动画集即可。

    One more thing:

    为了让太阳更真实,添加倒影效果

    ①在布局文件中,再添加一个FrameLayout,记得android:layout_weight调成0.5,这样sky和sea各一半。

    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
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
     <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
    android:id="@+id/sky"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.5"
    android:background="@color/blue_sky">
    <ImageView
    android:id="@+id/sun"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_gravity="center"
    android:src="@drawable/sun"
    android:contentDescription="@string/todo" />
    &l 大专栏  Android编程权威指南第三版 第32章t;/FrameLayout>

    <FrameLayout
    android:id="@+id/sea"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.5"
    android:background="@color/sea">
    <ImageView
    android:id="@+id/little_sun"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_gravity="center"
    android:src="@drawable/sun"
    android:contentDescription="@string/todo"
    android:alpha="0.7"/>
    </FrameLayout>

    </LinearLayout>

    ②倒影需要有位移动画、缩放动画、旋转动画、渐变透明动画。代码如下

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
     //--------------------------------倒影--------------------------------//
    //透明度
    alphaAnimator = ObjectAnimator.ofFloat(mLittleSunView, "alpha", 0.7f, 0.0f).setDuration(3000);
    unalphaAnimator = ObjectAnimator.ofFloat(mLittleSunView,"alpha",0.0f,0.7f).setDuration(3000);
    //大小
    little_bigXAnimator = ObjectAnimator.ofFloat(mLittleSunView,"scaleX",1.0f,2.0f).setDuration(3000);
    little_bigYAnimator = ObjectAnimator.ofFloat(mLittleSunView,"scaleY",1.0f,2.0f).setDuration(3000);
    little_smallXAnimator = ObjectAnimator.ofFloat(mLittleSunView,"scaleX",2.0f,1.0f).setDuration(3000);
    little_smallYAnimator = ObjectAnimator.ofFloat(mLittleSunView,"scaleY",2.0f,1.0f).setDuration(3000);
    //旋转特效
    little_clockwiseAnimator = ObjectAnimator.ofFloat(mLittleSunView,"rotation",0f,720f).setDuration(3000);
    little_anti_clockwiseAnimator = ObjectAnimator.ofFloat(mLittleSunView,"rotation",360f,0f).setDuration(3000);
    //位移
    little_upAnimator = ObjectAnimator.ofFloat(mLittleSunView, "y", littlesunYFirstStart, littlesunYFirstEnd).setDuration(3000);
    little_upAnimator.setInterpolator(new AccelerateInterpolator());
    little_downAnimator = ObjectAnimator.ofFloat(mLittleSunView, "y", littlesunYFirstEnd, littlesunYFirstStart).setDuration(3000);
    little_downAnimator.setInterpolator(new AccelerateInterpolator());

    分别定义太阳下降、太阳上升、倒影下降、倒影上升动画集,再合并为上升、下降总动画集

    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
    26
    27
    28
    29
    30
    31
    32
    33
    34
     //太阳下降动画集
    sun_downAnimatorSet = new AnimatorSet();
    sun_downAnimatorSet.play(sun_downAnimator)
    .with(sunsetSkyAnimator)
    .with(bigXAnimator).with(bigYAnimator)
    .with(clockwiseAnimator)
    .before(nightSkyAnimator);
    //太阳上升动画集
    sun_upAnimatorSet = new AnimatorSet();
    sun_upAnimatorSet.play(sun_upAnimator)
    .with(sunsetSkyAnimator)
    .with(smallXAnimator).with(smallYAnimator)
    .with(anti_clockwiseAnimator)
    .before(nightSkyAnimator);
    //倒影上升动画集、
    little_upAnimatorSet = new AnimatorSet();
    little_upAnimatorSet
    .play(little_anti_clockwiseAnimator)
    .with(little_bigXAnimator).with(little_bigYAnimator)
    .with(alphaAnimator)
    .with(little_upAnimator);
    //倒影下降动画集
    little_downAnimatorSet = new AnimatorSet();
    little_downAnimatorSet
    .play(little_clockwiseAnimator)
    .with(little_smallXAnimator).with(little_smallYAnimator)
    .with(little_downAnimator)
    .with(unalphaAnimator);

    //总动画集
    downAnimatorSet = new AnimatorSet();
    downAnimatorSet.play(sun_downAnimatorSet).with(little_upAnimatorSet);
    upAnimatorSet = new AnimatorSet();
    upAnimatorSet.play(sun_upAnimatorSet).with(little_downAnimatorSet);

    三、日落动画反转

    目前暂时还没做。

    推荐文章

    关于Android动画用法,推荐这篇https://blog.csdn.net/qq_40881680/article/details/82378391,写得很好,在我学动画部分的时候,对我帮助很大。

  • 相关阅读:
    Django(一)
    web 框架
    图片
    day16
    day 15
    day14 HTML CSS
    day12
    day11
    python IO多路复用,初识多线程
    python socket
  • 原文地址:https://www.cnblogs.com/lijianming180/p/12347558.html
Copyright © 2011-2022 走看看