Kotlin 中的安卓动画
原文:https://www.geeksforgeeks.org/android-animations-in-kotlin/
动画是一种方法,其中一组图像以特定的方式组合并处理,然后它们作为运动图像出现。构建动画使屏幕上的对象看起来像是活的。安卓有相当多的工具可以帮助你相对轻松地创建动画。因此在本文中,我们将学习使用 Kotlin 创建动画。下面是我们在用 xml 编写代码时使用的一些属性。
属性表:
首先,我们将创建一个新的安卓应用程序。然后,我们将创建一些动画。 如果已经创建了项目,则忽略步骤 1。
创建新项目
- 打开安卓工作室
- 转到文件= >新建= >新项目。
- 然后,选择空活动并单击下一步
- 将应用程序名称写成 DynamicEditTextKotlin
- 根据需要选择最小 SDK,这里我们选择了 21 作为最小 SDK
- 选择语言为 Kotlin,然后点击完成按钮。
如果您正确地遵循了上述过程,您将成功地获得一个新创建的项目。 创建项目后,我们将修改 xml 文件。在 xml 文件中,我们将创建一个执行所有动画的文本视图,以及八个不同动画的八个按钮。
修改 activity_main.xml 文件
打开 res/layout/activity_main.xml 文件并向其中添加代码。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/linearLayout"
android:gravity="center"
android:text="Geeks for Geeks"
android:textSize="32sp"
android:textColor="@color/colorPrimaryDark"
android:textStyle="bold" />
<LinearLayout
android:id="@+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="@+id/fade_in"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Fade In"
android:textAllCaps="false" />
<Button
android:id="@+id/fade_out"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Fade Out"
android:textAllCaps="false" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="@+id/zoom_in"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Zoom In"
android:textAllCaps="false" />
<Button
android:id="@+id/zoom_out"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Zoom Out"
android:textAllCaps="false" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="@+id/slide_down"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Slide Down"
android:textAllCaps="false" />
<Button
android:id="@+id/slide_up"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Slide Up"
android:textAllCaps="false" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="@+id/bounce"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Bounce"
android:textAllCaps="false" />
<Button
android:id="@+id/rotate"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Rotate"
android:textAllCaps="false" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
修改布局后,我们将为动画创建 xml 文件。所以我们将首先创建一个名为动漫的文件夹。 在这个文件夹中,我们将添加用于制作动画的 XML 文件。为此,请转到 app/res 右键单击,然后选择安卓资源目录并将其命名为动漫。
bounce.xml
在这个动画中,文本像球一样弹跳。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fillAfter="true">
<translate
android:fromYDelta="100%"
android:toYDelta="-20%"
android:duration="300" />
<translate
android:startOffset="500"
android:fromYDelta="-20%"
android:toYDelta="10%"
android:duration="150" />
<translate
android:startOffset="1000"
android:fromYDelta="10%"
android:toYDelta="0"
android:duration="100" />
</set>
淡入. xml
在淡入动画中,文本将从背景中出现。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<alpha
android:duration="1000"
android:fromAlpha="0.1"
android:toAlpha="1.0" />
</set>
淡出. xml
在淡出动画中,文本的颜色会在特定的时间内淡化。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<alpha
android:duration="1000"
android:fromAlpha="1.0"
android:toAlpha="0.1" />
</set>
rotate.xml
在旋转动画中,文本旋转一段特定的时间。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromDegrees="0"
android:interpolator="@android:anim/linear_interpolator"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="0"
android:toDegrees="360" />
slide_down.xml
在这个动画中,文本将从上到下。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromYDelta="-100%"
android:toYDelta="0" />
</set>
slide_up.xml
在这个动画中,文本将从底部到顶部。
可扩展标记语言
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromYDelta="0"
android:toYDelta="-100%" />
</set>
放大. xml
在此动画中,文本在特定时间内会变大。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXScale="1"
android:fromYScale="1"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="1.5"
android:toYScale="1.5">
</scale>
</set>
zoom_out.xml
在此动画中,文本在特定时间内会变小。
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="0.5"
android:toYScale="0.5" >
</scale>
</set>
在用 xml 创建所有动画之后。我们将创建主活动。
创建 MainActivity.kt 文件
打开 app/src/main/Java/net . geeks forgeeks . animationsinkotlin/mainactivity . kt 文件,并在其中添加以下代码。
Java 语言(一种计算机语言,尤用于创建网站)
package net.geeksforgeeks.animationsinkotlin
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.os.Handler
import android.view.View
import android.view.animation.AnimationUtils
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
fade_in.setOnClickListener {
textView.visibility = View.VISIBLE
val animationFadeIn = AnimationUtils.loadAnimation(this, R.anim.fade_in)
textView.startAnimation(animationFadeIn)
}
fade_out.setOnClickListener {
val animationFadeOut = AnimationUtils.loadAnimation(this, R.anim.fade_out)
textView.startAnimation(animationFadeOut)
Handler().postDelayed({
textView.visibility = View.GONE
}, 1000)
}
zoom_in.setOnClickListener {
val animationZoomIn = AnimationUtils.loadAnimation(this, R.anim.zoom_in)
textView.startAnimation(animationZoomIn)
}
zoom_out.setOnClickListener {
val animationZoomOut = AnimationUtils.loadAnimation(this, R.anim.zoom_out)
textView.startAnimation(animationZoomOut)
}
slide_down.setOnClickListener {
val animationSlideDown = AnimationUtils.loadAnimation(this, R.anim.slide_in)
textView.startAnimation(animationSlideDown)
}
slide_up.setOnClickListener {
val animationSlideUp = AnimationUtils.loadAnimation(this, R.anim.slide_out)
textView.startAnimation(animationSlideUp)
}
bounce.setOnClickListener {
val animationBounce = AnimationUtils.loadAnimation(this, R.anim.bounce)
textView.startAnimation(animationBounce)
}
rotate.setOnClickListener {
val animationRotate = AnimationUtils.loadAnimation(this, R.anim.rotate)
textView.startAnimation(animationRotate)
}
}
}
As, AndroidManifest.xml 文件是安卓应用中非常重要的文件,所以下面是 Manifest 文件的代码。
AndroidManifest.xml 文件
Code inside src/main/AndroidManifest.xml file would look like below
可扩展标记语言
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="net.geeksforgeeks.animationsinkotlin">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
作为模拟器运行:
你可以在这里找到完整的代码:https://github.com/missyadavmanisha/AnimationsInKotlinT2】