Android开发：请求制作带飞行图标的加载器及与附件GIF一致的加载器

Hey there! Let's walk through building both of these Android loaders you need—one with a flying image, and another that matches your target GIF exactly. Here's how to do it:

This loader’s all about making your chosen flying graphic (like a plane or bird icon) loop through a dynamic path with subtle animations to feel natural.

Step-by-Step Implementation: #

• Prep Your Resource: Drop your flying image (e.g., ic_plane.png) into the res/drawable folder of your project.
• Add the Loader View: In your layout XML, include an ImageView that’ll act as the loader (initially hidden):

<ImageView
    android:id="@+id/flyingLoader"
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:src="@drawable/ic_plane"
    android:visibility="gone"
    android:layout_centerInParent="true"/>

• Build the Flight Animation: Use Android’s property animations to combine translation, rotation, and transparency for a smooth flying effect. Add this code in your Activity/Fragment when you need to show the loader:

val flyingLoader = findViewById<ImageView>(R.id.flyingLoader)
flyingLoader.visibility = View.VISIBLE

// Combine multiple animations for a realistic flight path
val translateX = ObjectAnimator.ofFloat(flyingLoader, "translationX", 0f, 100f, 0f, -100f, 0f)
val translateY = ObjectAnimator.ofFloat(flyingLoader, "translationY", 0f, -50f, 0f, 50f, 0f)
val rotate = ObjectAnimator.ofFloat(flyingLoader, "rotation", 0f, 30f, 0f, -30f, 0f)
val alpha = ObjectAnimator.ofFloat(flyingLoader, "alpha", 0.6f, 1f, 0.6f)

val animSet = AnimatorSet()
animSet.playTogether(translateX, translateY, rotate, alpha)
animSet.duration = 2000 // Adjust speed as needed
animSet.repeatCount = ValueAnimator.INFINITE
animSet.start()

• Clean Up When Done: Don’t forget to stop the animation and hide the loader once your content loads:

animSet.cancel()
flyingLoader.visibility = View.GONE

To replicate the exact effect of your target GIF, you’ve got two solid options depending on how complex the GIF is:

Option 1: Frame Animation (Best for Simple Loops) #

If your GIF is a short, repeating sequence, split it into individual PNG frames (use a free tool like EZGIF to do this quickly), then create a frame animation XML:

<!-- res/drawable/loader_frame_animation.xml -->
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/frame_1" android:duration="100"/>
    <item android:drawable="@drawable/frame_2" android:duration="100"/>
    <!-- Add all your frames here, matching the original GIF's timing -->
</animation-list>

Then add the loader to your layout:

<ImageView
    android:id="@+id/frameLoader"
    android:layout_width="64dp"
    android:layout_height="64dp"
    android:src="@drawable/loader_frame_animation"
    android:visibility="gone"
    android:layout_centerInParent="true"/>

Start the animation when needed:

val frameLoader = findViewById<ImageView>(R.id.frameLoader)
frameLoader.visibility = View.VISIBLE
val animDrawable = frameLoader.drawable as AnimationDrawable
animDrawable.start()

Stop it when loading finishes:

animDrawable.stop()
frameLoader.visibility = View.GONE

Option 2: Load the Direct GIF (Best for Complex Animations) #

If splitting frames is too tedious, use the Glide library to load the GIF directly (place your GIF in the res/raw folder):
First, add Glide to your build.gradle (Module level):

dependencies {
    implementation 'com.github.bumptech.glide:glide:4.16.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.16.0'
}

Add the ImageView to your layout:

<ImageView
    android:id="@+id/gifLoader"
    android:layout_width="64dp"
    android:layout_height="64dp"
    android:visibility="gone"
    android:layout_centerInParent="true"/>

Load the GIF in your code:

val gifLoader = findViewById<ImageView>(R.id.gifLoader)
gifLoader.visibility = View.VISIBLE
Glide.with(this)
    .asGif()
    .load(R.raw.your_target_gif) // Replace with your GIF's filename
    .into(gifLoader)

Clean up when done:

Glide.with(this).clear(gifLoader)
gifLoader.visibility = View.GONE

内容的提问来源于stack exchange，提问作者Seetha