使用 SurfaceView 在画布上添加和管理图层

发布于 2025-01-06 21:20:58 字数 1062 浏览 0 评论 0原文

我想说,也许(可能)“层”这个词不是正确的,但我相信它给出了我想做的事情的正确想法。

我正在使用实现 SurfaceHolder.Callback 的 SurfaceView。

我正在画布上工作。我正在绘制一组相当复杂的点。 我对画布进行了翻译、旋转和缩放(translateX 和 translateY 是变量,当用户与画布交互时会发生变化):

canvas.translate(0, 0);
canvas.rotate(-90);
canvas.translate(translateX, translateY);
canvas.scale(scaleX, scaleY);

我的下一步是在此画布上添加文本和图像。 文本和图像都不应缩放或旋转,而只能平移(它们应遵循画布)。

出于这个原因,我正在考虑拥有某种“层”或类似的透明东西,它只跟随画布运动,并且不会在放大或缩小或旋转时发生变化[将它们视为某种保留在整个画布上的 UI帆布]。

编辑:

这是一个片段:

  @Override
    public void onDraw(Canvas canvas) {
        try{
            pt.setColor(Color.BLACK);
            canvas.drawColor(Color.WHITE);
            canvas.drawText("HELLOOOOOOOOOOOOOOOO", 100, 10, pt);
            pt.setAntiAlias(true);  
            canvas.save();
            canvas.rotate(-90, 0, 0);
            canvas.drawText("HELLOOOOOOOOOOOOOOOO", getHeight(), 10, pt);
            canvas.restore();
        }
        catch(Exception e)
        {}
    }

我希望两个“HELLOOOOOO”看起来彼此靠近。我不知道该怎么做。

I want to say that maybe (probably) the word 'layer' is not the correct one, but I believe it gives the correct idea of what I want to do.

I am using a SurfaceView which implements SurfaceHolder.Callback.

I am working on a canvas. I am drawing a quite complex set of points.
I have the canvas translated, rotated and scaled (translateX and translateY are variable that changes when the user interacts with the canvas):

canvas.translate(0, 0);
canvas.rotate(-90);
canvas.translate(translateX, translateY);
canvas.scale(scaleX, scaleY);

My next step is to add text and images on top of this canvas.
Both the text and the images should not be scaled nor rotated, only translated (they should follow the canvas).

For this reason I was thinking about having some sort of 'layer' or something similar transparent which only follows the canvas movements and does not change on zoom in or zoom out or on rotation [think them as some sort of UI which stay over the whole canvas].

EDIT:

Here is a snippet:

  @Override
    public void onDraw(Canvas canvas) {
        try{
            pt.setColor(Color.BLACK);
            canvas.drawColor(Color.WHITE);
            canvas.drawText("HELLOOOOOOOOOOOOOOOO", 100, 10, pt);
            pt.setAntiAlias(true);  
            canvas.save();
            canvas.rotate(-90, 0, 0);
            canvas.drawText("HELLOOOOOOOOOOOOOOOO", getHeight(), 10, pt);
            canvas.restore();
        }
        catch(Exception e)
        {}
    }

I want the two 'HELLOOOOOO' to appear close to each other. I can't figure out how to.

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

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

发布评论

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

评论(2

吾家有女初长成 2025-01-13 21:20:58

为什么不使用 save() 和 Restore() 以便您的画布再次“正常”。你可以轻松地在上面画画吗?

如果您听说过的话,保存和恢复就像场景图一样工作。

Why not use save() and restore() so that after all your canvas is "normal" again. Than you can draw on it easily?

Save and restore working like a SceneGraph, if you have heard of it.

季末如歌 2025-01-13 21:20:58

我设法解决了这个问题。我只是使用以下方法旋转画布:

rotate(+90, X, Y);

然后向后旋转

rotate(-90, X, Y);

这样做,(X,Y) 坐标保持不变。

I managed to fix this. I simply rotated the canvas using:

rotate(+90, X, Y);

and then rotated back

rotate(-90, X, Y);

Doing this, the (X,Y) coordinates remain the same.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文