先上图
再看代码
package com.xiayiye5.composefirst.components
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.ExperimentalAnimationApi
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Column
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Delete
import androidx.compose.material.icons.filled.Menu
import androidx.compose.runtime.*
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import com.xiayiye5.composefirst.R
/*
* Copyright (c) 2022, 13343401268@163.com All Rights Reserved.
* # #
* # _oo0oo_ #
* # o8888888o #
* # 88" . "88 #
* # (| -_- |) #
* # 0\ = /0 #
* # ___/`---'\___ #
* # .' \\| |# '. #
* # / \\||| : |||# \ #
* # / _||||| -:- |||||- \ #
* # | | \\\ - #/ | | #
* # | \_| ''\---/'' |_/ | #
* # \ .-\__ '-' ___/-. / #
* # ___'. .' /--.--\ `. .'___ #
* # ."" '< `.___\_<|>_/___.' >' "". #
* # | | : `- \`.;`\ _ /`;.`/ - ` : | | #
* # \ \ `_. \_ __\ /__ _/ .-` / / #
* # =====`-.____`.___ \_____/___.-`___.-'===== #
* # `=---=' #
* # ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ #
* # #
* # 佛祖保佑 永无BUG #
* # #
*/
/**
* @author 下一页5(轻飞扬)
* 创建时间:2022/5/18 10:28
* 个人小站:http://yhsh.wap.ai(已挂)
* 最新小站:http://www.iyhsh.icoc.in
* 联系作者:企鹅 13343401268
* 博客地址:http://blog.csdn.net/xiayiye5
* 项目名称:ComposeFirst
* 文件包名:com.xiayiye5.composefirst.components
* 文件说明:Compose中Animation动画的基本用法
*/
@OptIn(ExperimentalAnimationApi::class)
@Composable
fun AnimationSamples() {
var show by remember {
mutableStateOf(false)
}
Scaffold(topBar = {
TopAppBar(
navigationIcon = { Icon(imageVector = Icons.Default.Menu, contentDescription = null) },
title = { Text(text = "动画的基本用法") },
actions = {
Icon(
imageVector = Icons.Default.Delete,
contentDescription = null,
tint = Color.White
)
Text(text = "删除", color = Color.White)
})
}, backgroundColor = colorResource(id = R.color.purple_200)) {
Column() {
Button(onClick = { show = !show }) {
Text(text = "点击切换显示隐藏动画")
}
AnimatedVisibility(visible = show, enter = fadeIn(), exit = fadeOut()) {
Image(
painter = painterResource(id = R.drawable.image_bitmap),
contentDescription = null
)
}
}
}
}
@Preview
@Composable
fun AnimationSamplesPreview() {
AnimationSamples()
}