动画组件与
#编程 #教程 #kotlin #android

firebase icon

你好,互联网上了不起的人!希望你一切都好。

随着用户越来越习惯流体动画和直观的交互,将动画纳入您的应用程序已成为成功的关键元素。

动画*助理

在态度更改动画时,应使用此API。让我看看我们如何在实践中做到这一点。

您只需要声明您的变量为动画*asstate。就我而言,我要动画颜色:

我只是用颜色变量设置颜色,而我们将要使用的背景彩色是使用anistecolorAsstate声明的,该颜色将颜色作为参数。

现在,让我们创建两个按钮,然后单击它们后,我们将为颜色变量设置另一个值:

您将看到类似的东西:

gif of a phone showing the color change

动画内容大小

扩展组件的内容对我们来说并不令人惊讶,但是您可以通过添加一些动画来使其变得更漂亮。

您只需要在卡的修饰符

的修饰符中添加animateContentsize

这是我的卡,没有任何动画。单击它时,它只会扩展:

gif of a phone showing a card

为了动画,我将在修饰符的列上调用AnimAteContentsize:

gif of a phone showing a card

动画可见性

我喜欢用Jetpack Compose创建动画视图的方式。您是否曾经想过在滚动列表时如何动画元素?让我们这样做。

首先,我将创建一个懒惰的列列表。如果您不知道该如何开发,只需查看my article about list and grid layouts

为了创建动画可见性,我们可以利用动画可视化方法。每次关联的布尔值都会改变时,此方法会触发动画组件。

我将动画两个组成部分:一个浮动动作栏和一个文本。让我们创建一个负责动画这些视图的函数:

可见:设置以确定动画是否应发生。
出口:使用它来控制组件消失时动画的发生方式。
输入:使用它来控制组件出现时动画的发生方式。
现在,让我们使用脚手架方法在我们的主要活动中调用这些功能。

首先,浮动动作按钮:

现在,让我们参考内容参数中的动画文本:

最后但并非最不重要的一点是,让我们致电列表:

gif of a phone showing a card

结论

您可以使用Compose创建许多其他动画。

如果大家都有兴趣,我可以演示并提供这些自定义。

将动画直接整合到构图中,简化了过程并优化了性能。拥抱这项技术可以打开一个创造性的世界,并增强用户体验,确保Android UI开发的前途未来。

所有代码和典范是on this repository.

快乐编码â€


请让我知道您在评论中的想法。

与我联系ð

Linkedin

GitHub

Instagram

Medium

git of a woman