Android:在画布上对单个路径的 alpha 进行动画处理

发布于 2024-10-11 23:37:14 字数 735 浏览 1 评论 0原文

我想在 Android 画布上为单个路径设置动画。

public class MyView extends View {
    private Path paths[];
    protected void onDraw( Canvas canvas ) {
        Paint paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth( 8 );
        paint.setColor(Color.BLUE);

        Path path = new Path();
        path.moveTo(75, 11);
        path.quadTo(62, 87, 10, 144);
        canvas.drawPath( path, paint );
        paths[0] = path;

        path.reset();
        path.moveTo(50, 100);
        path.lineTo(150, 200);
        canvas.drawPath( path, paint );
        paths[1] = path;
    }
}

现在我有路径[],我想分别为每个路径设置动画。我希望它能改变阿尔法,就像它在增长一样。起初只有一个小点,然后它长成一条线,重复。

能做到吗?

如何?

I would like to animate a single Path on the android canvas.

public class MyView extends View {
    private Path paths[];
    protected void onDraw( Canvas canvas ) {
        Paint paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth( 8 );
        paint.setColor(Color.BLUE);

        Path path = new Path();
        path.moveTo(75, 11);
        path.quadTo(62, 87, 10, 144);
        canvas.drawPath( path, paint );
        paths[0] = path;

        path.reset();
        path.moveTo(50, 100);
        path.lineTo(150, 200);
        canvas.drawPath( path, paint );
        paths[1] = path;
    }
}

Now I have paths[], I would like to animate each one separately. I would like it to change alpha like it was growing. At first there is just a little dot, then it grows into a line, repeat.

Can it be done?

How?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

柠檬色的秋千 2024-10-18 23:37:14

我将添加一个范围从 0 到 1 的新浮点数,以保留当前动画百分比并使用它来设置当前的 alpha

public class MyView extends View {
     private Path paths[];
     private float mAnimPercentage = 0.0f;

    private static final int clip(int value){  //forces the value to be between 0 and 255
        return Math.max(0, Math.min(255, value));
    }
    protected void onDraw( Canvas canvas ) {
        Paint paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth( 8 );
        paint.setColor(Color.BLUE);

        Path path = new Path();
        path.moveTo(75, 11);
        path.quadTo(62, 87, 10, 144);
        //edited here
        paint.setAlpha(clip(mAnimPercentage*255*2));
        canvas.drawPath( path, paint );
        paths[0] = path;

        path.reset();
        path.moveTo(50, 100);
        path.lineTo(150, 200);
        //edited here
        paint.setAlpha(clip(-127 + mAnimPercentage*255*2));   //the biggest is the negative value, the latter this path will show, the biggest is the number multiplied by mAnimPercentage, the fastest this path will get completely opaque
        canvas.drawPath( path, paint );
        paths[1] = path;
        mAnimPercentage+= 0.01; //FIXME this is for TEST only, you should update it with an animator
        postInvalidate();
    }
}

I would add a new float ranging from 0 to 1 that keeps the current animation percentage and use it to set the current alpha

public class MyView extends View {
     private Path paths[];
     private float mAnimPercentage = 0.0f;

    private static final int clip(int value){  //forces the value to be between 0 and 255
        return Math.max(0, Math.min(255, value));
    }
    protected void onDraw( Canvas canvas ) {
        Paint paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth( 8 );
        paint.setColor(Color.BLUE);

        Path path = new Path();
        path.moveTo(75, 11);
        path.quadTo(62, 87, 10, 144);
        //edited here
        paint.setAlpha(clip(mAnimPercentage*255*2));
        canvas.drawPath( path, paint );
        paths[0] = path;

        path.reset();
        path.moveTo(50, 100);
        path.lineTo(150, 200);
        //edited here
        paint.setAlpha(clip(-127 + mAnimPercentage*255*2));   //the biggest is the negative value, the latter this path will show, the biggest is the number multiplied by mAnimPercentage, the fastest this path will get completely opaque
        canvas.drawPath( path, paint );
        paths[1] = path;
        mAnimPercentage+= 0.01; //FIXME this is for TEST only, you should update it with an animator
        postInvalidate();
    }
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文