Android 安卓动画 属性动画 - 渐变/透明度 动画

目录

引入

动画 - 相关文章篇

布局文件 篇

代码逻辑 篇


引入

属性动画的出现,弥补了补间动画的不足之处,补间动画,只是改变了表面上的东西,但是其中属性并未改变,而属性动画相反,改变了表面上的东西,并且也更改了其属性。


类:ObjectAnimator

用于操作属性动画的类


 

动画 - 相关文章篇

帧动画

帧动画:  https://blog.csdn.net/qq_40881680/article/details/82222684

 

补间动画

补间动画-平移动画:  https://blog.csdn.net/qq_40881680/article/details/82255459

补间动画-缩放动画:  https://blog.csdn.net/qq_40881680/article/details/82260914

补间动画-旋转动画:  https://blog.csdn.net/qq_40881680/article/details/82261557

补间动画-透明/渐变动画:  https://blog.csdn.net/qq_40881680/article/details/82261869

补间动画-组合动画(四个动画一起播放):  https://blog.csdn.net/qq_40881680/article/details/82285987

 

属性动画

属性动画-渐变透明动画:  https://blog.csdn.net/qq_40881680/article/details/82318363

属性动画-旋转动画:  https://blog.csdn.net/qq_40881680/article/details/82354017

属性动画-缩放动画:  https://blog.csdn.net/qq_40881680/article/details/82377850

属性动画-移动动画:  https://blog.csdn.net/qq_40881680/article/details/82378391

属性动画-组合动画:  https://blog.csdn.net/qq_40881680/article/details/82381258


先来看下基本效果:


布局文件 篇

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#9c98ce"
        android:orientation="vertical"
        android:paddingLeft="20dp"
        android:paddingRight="20dp"
        android:paddingTop="10dp">

        <Button
            android:id="@+id/button"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#5b7bda"
            android:text="点击演示动画"
            android:textColor="#fff" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="4"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="20dp"
            android:background="@mipmap/kuiba" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="《魁拔》"
            android:textSize="18sp" />

    </LinearLayout>
    
</LinearLayout>

代码逻辑 篇

属性动画用到的是:ObjectAnimator

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    ObjectAnimator objectAnimator;
    private Button button;
    private ImageView image;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    private void initView() {
        button = (Button) findViewById(R.id.button);
        image = (ImageView) findViewById(R.id.image);
        button.setOnClickListener(this);
        image.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.button:
                objectAnimator = ObjectAnimator.ofFloat(image,"alpha",1f,0f);
                objectAnimator.setDuration(2000);
                objectAnimator.start();
                break;
            case R.id.image:
                Toast.makeText(this, "我是属性动画", Toast.LENGTH_SHORT).show();
                break;
        }
    }
}

AndroidStudio快速实例化-插件安装与使用:https://blog.csdn.net/qq_40881680/article/details/82012180

以上Java代码 objectAnimator = ObjectAnimator.ofFloat(image,"alpha",1f,0f);

括号中的参数:

第一个参数,要实现动画的控件id

第二个参数,要实现的动画属性,以下列出6种:  

propertyName

详细作用
alpha 实现渐变效果
rotation 实现旋转旋转效果
translationX 实现水平移动效果(左或右移动)
translationY 实现纵向移动效果(向上或者向下移动)
scaleX 实现轴X缩放效果(放大或者缩小)
scaleY 实现轴Y缩放效果(放大或者缩小)

以上两个参数是所有的实现效果都是这样写的,接下来介绍渐变动画的参数

第三个参数,开始时的透明状态( 1f 为不透明,0f 为完全透明,取值 0f ~ 1f )

第四个参数,结束时的透明状态( 1f 为不透明,0f 为完全透明,取值 0f ~ 1f )

在这里还可以加上第五个参数,表示为,渐变后再回到某一状态(1f为不透明,0f为完全透明,取值0f~1f),看代码

objectAnimator = ObjectAnimator.ofFloat(image,"alpha",1f,0f,0.7f);

这样的话实现效果就变成了如下:

开始为1f,渐变后为0f,最后回到0.7f

ObjectAnimator 类 方法 详细解释
setDuration(2000) 设置动画持续时间,单位:毫秒ms
start(); 开始执行动画

 

 

 

 

有问题请联系我QQ:16191592

或者和在线QQ聊天: 》》点击和我聊天《《

 

 
发布了100 篇原创文章 · 获赞 1029 · 访问量 76万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 猿与汪的秘密 设计师: 上身试试

分享到微信朋友圈

×

扫一扫,手机浏览