1

我正在尝试创建一个顺序加载动画，显示 5 个点，这些点一个接一个地变黑，以显示加载动画。我已经制作了动画——但到目前为止——只有一个点变黑了——我试图把第二个变黑的尝试似乎没有奏效（一旦我弄清楚如何为它制作动画，我就会将该方法应用于剩余的 3 个点——只是为了让您知道代码现在的位置-此时我仅尝试为第二个点设置动画，但它不起作用-第一个点按原样闪烁-然后其他 4 个点没有任何反应动画）

——阿玛尼·斯旺

SRC 片段：

try {
        // updating layout initially has updating text with 1 dot in the xml
        setContentView(R.layout.updating);
        // This image view has the updating text to be progressively updated
        // with dots addition
        ImageView loading = (ImageView) findViewById(R.id.loading_empty1);
        //Button goButton = (Button) findViewById(R.id.loading_empty);
        // Set updating button to drawable animation
        loading.setBackgroundResource(R.drawable.updating1);
        loadingAnimation = (AnimationDrawable) loading.getBackground();


        ImageView loading2 = (ImageView) findViewById(R.id.loading_empty2);
        //Button goButton = (Button) findViewById(R.id.loading_empty);
        // Set updating button to drawable animation
        loading2.setBackgroundResource(R.drawable.updating2);
        loadingAnimation = (AnimationDrawable) loading2.getBackground();

动画 XML 片段 #1：

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"    
    android:oneshot="false">    
    <item android:drawable="@drawable/loading_empty" android:duration="500" />    
    <item android:drawable="@drawable/loading_full" android:duration="500" />    
</animation-list>

动画 XML 片段 #2：

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"    
    android:oneshot="false">    
    <item android:drawable="@drawable/loading_empty" android:duration="500" />    
    <item android:drawable="@drawable/loading_full" android:duration="500" />    
</animation-list>

布局 XML：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/background"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/updating_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:gravity="center"
        android:text="@string/updating_text"
        android:textColor="#000000"
        android:textSize="14sp" />

    <ImageView
        android:id="@+id/loading_empty1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="150dp"
        android:layout_toLeftOf="@+id/loading_empty2"
        android:layout_marginBottom="20dp"
        android:layout_marginRight="15dp"
        android:background="@drawable/updating1"
        android:src="@drawable/loading_empty" />

    <ImageView
        android:id="@+id/loading_empty3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/loading_empty2"
        android:layout_centerHorizontal="true"
        android:background="@drawable/updating3"
        android:layout_marginRight="15dp"
        android:src="@drawable/loading_empty" />

    <ImageView
        android:id="@+id/loading_empty2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/loading_empty1"
        android:layout_toLeftOf="@+id/loading_empty3"
        android:background="@drawable/updating2"
        android:layout_marginRight="15dp"
        android:src="@drawable/loading_empty" />

    <ImageView
        android:id="@+id/loading_empty4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/loading_empty3"
        android:layout_toRightOf="@+id/loading_empty3"
        android:background="@drawable/updating4"
        android:layout_marginRight="15dp"
        android:src="@drawable/loading_empty" />

    <ImageView
        android:id="@+id/loading_empty5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/loading_empty4"
        android:layout_toRightOf="@+id/loading_empty4"
        android:background="@drawable/updating5"
        android:src="@drawable/loading_empty" />

</RelativeLayout>
4

2 回答 2

2

你为什么不为此使用动画列表？4个点作为1张图像，动画列表中的每个项目作为动画中的一帧？

像这样http://android-er.blogspot.com/2012/01/create-frame-animation-with.html

于 2013-07-24T15:55:51.760 回答
1

这可以使用单个ImageView,animation-list和AnimationDrawableAndroid 类来完成。

  • drawable复制文件夹中的五个图像。
  • drawable在 .xml 文件夹中创建 XML 文件animation-list。
  • 列出此 xml 文件中的所有五个图像。
  • 在 xml 文件中设置每个图像的动画持续时间。
  • 将您的 xml 文件设置为ImageView.
  • 用于getDrawable()从 xml 中获取每个图像。
  • 开始动画。

例如，假设您创建了五个名称为 dot01.png、dot02.png、dot03.png、dot04.png、dot05..png的点图像，那么您在文件夹中的 xml 文件drawable应该是，

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="true" >

    <item
        android:drawable="@drawable/dot01"
        android:duration="150"/>
    <item
        android:drawable="@drawable/dot02"
        android:duration="150"/>
    <item
        android:drawable="@drawable/dot03"
        android:duration="150"/>
    <item
        android:drawable="@drawable/dot04"
        android:duration="150"/>        
    <item
        android:drawable="@drawable/dot05"
        android:duration="150"/>


    <!-- Reset to original -->
    <item
        android:drawable="@drawable/dot01"
        android:duration="10"/>

</animation-list>

现在将该xml设置为图像资源并从实例方法ImageView启动动画，start()AnimationDrawable

ImageView DotAnimImage = (ImageView) findViewById(R.id.imageView1);
// dots_animation below is the name of your xml file.
DotAnimImage.setImageResource(R.drawable.dots_animation);
// Now create a reference to getDrawable
AnimationDrawable dotsAnimation = (AnimationDrawable) DotAnimImage.getDrawable();
// Start animation
dotsAnimation.start();

上面的代码可以工作，但它只会为图像设置一次动画，这是因为 android 中的一个错误，android 认为即使动画已经结束，动画仍在运行。解决方案是使用实例方法检查动画是否正在运行并使用isRunning()方法AndroidDrawable手动停止它stop()，

//Check if animation is running and stop it,
if (dotsAnimation.isRunning()) {
    dotsAnimation.stop();
    // start again,
    dotsAnimation.start();
}

你的最终代码应该是，

ImageView DotAnimImage = (ImageView) findViewById(R.id.imageView1);
DotAnimImage.setImageResource(R.drawable.dots_animation);
AnimationDrawable dotsAnimation = (AnimationDrawable) DotAnimImage.getDrawable();

if (dotsAnimation.isRunning()) {
    dotsAnimation.stop();
}

dotsAnimation.start();
于 2015-01-31T11:27:40.163 回答