如何在android中制作星星形状并设置动画？

我想为我的项目做一个星形。 我搜索了一下，现在我终于可以用画布画出星星的形状了

但是接下来我想要的对我来说真的很难。真是噩梦。 我试了又找，但什么都不适合我

我想要的是星星必须由没有背景色的线条组成。 唯一一行。。越过界线

---

然后一条线被表达并淡入淡出，下一条线被创建并再次淡出，然后这条线被创建，然后再次淡出，我希望这是永久性的动作。直到我将此活动的屏幕留给另一个屏幕。

我不认为您会找到完全符合您需要的代码，但您可以使用其他代码并对其进行调整

您可以使用在画布上逐行绘制星星的代码（例如，从这里开始：），并根据时间管理正在绘制的星星的哪一行和未绘制的星星的哪一行（构建一个管理阶段的小型“状态机”）

---

您可以在适当的阶段在此视图上使用简单的淡入淡出动画来处理淡入淡出的问题。

此代码取自我不久前从事的一个项目。我想它能满足你的需要

首先，我不知道你是如何为星星画线的。我刚刚使用VectorDrawables创建了星形线条（有关如何使用VectorDrawables的更多详细信息，请参阅本文）。我应该警告你，我做得很匆忙，所以不会很好看

警告：此帖子将很长

star1.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="48dp"
    android:height="48dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">    
    <path android:pathData="M20,24L12,0"
        android:strokeColor="@color/starColor"
        android:strokeWidth="0.1"/>    
</vector>

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="48dp"
    android:height="48dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">    
    <path android:pathData="M4,24L12,0"
        android:strokeColor="@color/starColor"
        android:strokeWidth="0.1"/>    
</vector>

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="48dp"
    android:height="48dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">    
    <path android:pathData="M0,8L24,8"
        android:strokeColor="@color/starColor"
        android:strokeWidth="0.1"/>    
</vector>

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="48dp"
    android:height="48dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">
    <path android:pathData="M4,24L24,8"
        android:strokeColor="@color/starColor"
        android:strokeWidth="0.1"/>
</vector>

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="48dp"
    android:height="48dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">
    <path android:pathData="M20,24L0,8"
        android:strokeColor="@color/starColor"
        android:strokeWidth="0.1"/>
</vector>

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/image1"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:alpha="0"/>

    <ImageView
        android:id="@+id/image2"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:alpha="0"/>

    <ImageView
        android:id="@+id/image3"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:alpha="0"/>

    <ImageView
        android:id="@+id/image4"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:alpha="0"/>

    <ImageView
        android:id="@+id/image5"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:alpha="0"/>

</android.support.constraint.ConstraintLayout>

正如您可能已经注意到的，我没有使用

android:src

属性将任何可绘制内容分配给

ImageView

。我鼓励你去做，试着去做。同时，我以编程方式添加图像

在

onCreate

方法上方声明以下变量

private ImageView image1, image2, image3, image4, image5;
private Context context;
private int i = 1;
private long duration = 800;
private Handler animHandler;

animHandler

将负责保持动画运行。我将使用

I

跟踪要设置动画的

ImageView

。顾名思义，字段

duration

将保存动画所需的持续时间

下面是代码的其余部分。我会尽可能提供意见

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_test);

    // Initialising the imageview. I'm using SDK 26 so I did not
    // require typecasting.
    image1 = findViewById(R.id.image1);
    image2 = findViewById(R.id.image2);
    image3 = findViewById(R.id.image3);
    image4 = findViewById(R.id.image4);
    image5 = findViewById(R.id.image5);

    context = TestActivity.this;

    new Handler().postDelayed(new Runnable() {
        @Override
        public void run() {
            setupView(); // This method will initialize all IVs 
                         // and add the vector drawable as bitmap
            animHandler = new Handler();
            startAnim();
        }
    }, 200);

}

设置视图

private void setupView() {
    setVectorDrawable(image1, ContextCompat.getDrawable(context,R.drawable.star1));
    setVectorDrawable(image2, ContextCompat.getDrawable(context,R.drawable.star2));
    setVectorDrawable(image3, ContextCompat.getDrawable(context,R.drawable.star3));
    setVectorDrawable(image4, ContextCompat.getDrawable(context,R.drawable.star4));
    setVectorDrawable(image5, ContextCompat.getDrawable(context,R.drawable.star5));
}

setVectorDrawable

private void setVectorDrawable(ImageView imageView, Drawable drawable) {
    Bitmap bitmap = Bitmap.createBitmap(imageView.getWidth(),
            imageView.getHeight(), Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(bitmap);
    drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
    drawable.draw(canvas);

    imageView.setImageBitmap(bitmap);
}

Runnable runnable = new Runnable() {
    @Override
    public void run() {
        switch (i) {
            case 1:
                animateStarIn(image1);
                break;
            case 2:
                animateStarIn(image2);
                break;

            case 3:
                animateStarIn(image3);
                break;
            case 4:
                animateStarIn(image4);
                break;

            case 5:
                animateStarIn(image5);
                break;
            case 6:
                animateStartOut(image1);
                break;

            case 7:
                animateStartOut(image2);
                break;
            case 8:
                animateStartOut(image3);
                break;

            case 9:
                animateStartOut(image4);
                break;
            case 10:
                animateStartOut(image5);
                break;
        }
        i++;
        if (i == 11) i = 1;
        animHandler.postDelayed(runnable, duration);
    }
};

private void animateStarIn(ImageView imageView) {
    imageView.animate().alpha(1).setDuration(duration).setInterpolator(new AccelerateInterpolator());
}
private void animateStartOut (ImageView imageView) {
    imageView.animate().alpha(0).setDuration(duration).setInterpolator(new DecelerateInterpolator());
}

在这里，我创建了5个不同的位图来保存这5行。这还不是什么大问题。但是对于更大的项目（我必须一起使用69个位图），内存中有很多位图可能不是一个好的做法。5个位图应该可以正常工作

startAnim

private void startAnim() {
    runnable.run();
}

可运行

private void setVectorDrawable(ImageView imageView, Drawable drawable) {
    Bitmap bitmap = Bitmap.createBitmap(imageView.getWidth(),
            imageView.getHeight(), Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(bitmap);
    drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
    drawable.draw(canvas);

    imageView.setImageBitmap(bitmap);
}

Runnable runnable = new Runnable() {
    @Override
    public void run() {
        switch (i) {
            case 1:
                animateStarIn(image1);
                break;
            case 2:
                animateStarIn(image2);
                break;

            case 3:
                animateStarIn(image3);
                break;
            case 4:
                animateStarIn(image4);
                break;

            case 5:
                animateStarIn(image5);
                break;
            case 6:
                animateStartOut(image1);
                break;

            case 7:
                animateStartOut(image2);
                break;
            case 8:
                animateStartOut(image3);
                break;

            case 9:
                animateStartOut(image4);
                break;
            case 10:
                animateStartOut(image5);
                break;
        }
        i++;
        if (i == 11) i = 1;
        animHandler.postDelayed(runnable, duration);
    }
};

private void animateStarIn(ImageView imageView) {
    imageView.animate().alpha(1).setDuration(duration).setInterpolator(new AccelerateInterpolator());
}
private void animateStartOut (ImageView imageView) {
    imageView.animate().alpha(0).setDuration(duration).setInterpolator(new DecelerateInterpolator());
}

简而言之，我正在创建一个runnable，它将根据值变量

I

的不同设置不同的

ImageView

动画

让我再次强调，我已经发布了一段时间前我参与的一个项目的代码。即使它不能直接满足您的要求，我也会鼓励您进行试验，并尝试一下，让它工作起来

编辑

此动画通过确保

runnable

重复来工作。要停止动画，请使用

animHandler.removeCallbacks(runnable);

---

是啊，我看过这个例子。哇。。真难以置信。太完美了。但是你说，“这使得动画制作很方便，但可能会导致性能问题，我们将在后面讨论”。我会把这个放到我的应用程序中。是否会出现性能问题？优化还有比使用它更好的方法吗？例如，创建并附加GIF。功能是完美的，但最后，我想问一下性能问题。@Julidi如果我们谈论的是5

ImageView

s，它本身不会影响性能。安卓显示器显示正在使用7MB（这并不多）。此外，在示例中，我使用了

ImageView

大小作为

200dp

。如果你要缩小它的规模，比如说75dp，那么内存使用量将下降到1-2MB。使用

path

在画布上绘制会更高效，但更耗时。如何停止它呢？Thx！！我必须使用这种单例模式还是静态类？或者你认为把它作为一个总体目标更好？我只是觉得这是一个活动的长代码。