在 cocos2d 中使用 opengl-es 进行圆形裁剪

Posted 2023-03-23

【中文标题】在 cocos2d 中使用 opengl-es 进行圆形裁剪

【英文标题】：Circle shape clipping with opengl-es in cocos2d

【发布时间】：2011-10-18 08:17:54

【问题描述】：

我正在尝试在 cocos2d 中的 CCSprite 上制作圆形剪裁，经过大量搜索后，我尝试了 open gl glScissor 方法，我在我的 sprite 上实现了平方剪裁。但是，我需要把它做成一个圆圈，而且用 glScissor 似乎是不可能的。 我一直在尝试，我发现了一些关于 gl 模板的东西，但是我还没有找到关于这个的方法，而且我不熟悉 opengl。

我还听说过多次调用 glScissor wo 可以实现自定义形状，但我没有找到任何东西。

提前致谢，欢迎任何回答。

这是我实际的访问方式：

-(void) visit

    glPushMatrix();
    glEnable(GL_SCISSOR_TEST);

    glScissor(clippingRegion.origin.x , clippingRegion.origin.y ,
            clippingRegion.size.width, clippingRegion.size.height);

    [super visit];

    glDisable(GL_SCISSOR_TEST);
    glPopMatrix();

【问题讨论】：

你解决了吗？我尝试了类似的方法，但它看起来很糟糕并且使用了大量资源。

实际上我使用了一个 CCMask 类解决了我想要的任何形状，我会给你在 cocos2d 论坛中讨论过的 url：cocos2d-iphone.org/forum/topic/15890/page/2#post-109368

【参考方案1】：

glScissor 不会做你想做的事。这是我不久前写的一些代码的一部分。它画 一个带有光栅纹理的矩形，并使用模板缓冲区只有一个磁盘可见。

这是我当时使用的链接： http://www.swiftless.com/tutorials/opengl/basic_reflection.html

(let ((cnt 0d0))
  (defmethod display ((w window))
    ;; the complex number z represents amplitude and direction
    ;; of the grating constant
    ;; r and psi addresses different points in the back focal plane
    ;; r=0 will result in z=w0. the system is aligned to illuminate
    ;; the center of the back focal plane for z=w0.
    (let* ((w0 (* 540d0 (exp (complex 0d0 (/ pi 4d0)))))
           (r 260d0)
           (psi 270d0)
           (w (* r (exp (complex 0d0 (* psi (/ pi 180d0))))))
           (z (+ w w0)))
      (clear-stencil 0)
      (clear :color-buffer-bit :stencil-buffer-bit)
      (load-identity)
      ;; http://www.swiftless.com/tutorials/
      ;;    opengl/basic_reflection.html
      ;; use stencil buffer to cut a disk out of the grating
      (color-mask :false :false :false :false)
      (depth-mask :false)
      (enable :stencil-test)
      (stencil-func :always 1 #xffffff)
      (stencil-op :replace :replace :replace)

      (draw-disk 100d0 (* .5d0 1920) (*  .5d0 1080))
      ;; center on camera 549,365
      ;; 400 pixels on lcos = 276 pixels on camera (with binning 2)
      (color-mask :true :true :true :true)
      (depth-mask :false)
      (stencil-func :equal 1 #xffffff)
      (stencil-op :keep :keep :keep)

      ;; draw the grating
      (disable :depth-test)
      (with-pushed-matrix 
          (translate (* .5 1920) (*  .5 1080) 0)
        (rotate (* (phase z) 180d0 (/ pi)) 0 0 1)
        (translate (* -.5 1920) (* -.5 1080) 0)
        (draw *bild*))
      (disable :stencil-test)
      (enable :depth-test)

      (fill-grating *grating* (abs z))
      (format t "~a~%" cnt)
      (if (< cnt 360d0)
          (incf cnt 30d0)
          (setf cnt 0d0))
      (update *bild*)
      (swap-buffers)
      (sleep (/ 1d0)) ;; 1 frame per second
      (post-redisplay))))

【参考方案2】：

您可能需要创建一个 for 循环，定义一些角度和偏移量，然后在 sprite 周围执行剪刀剪切以获得圆形剪切场。但前提是您无法从一开始就创建圆形 - 在 opengl-es 中会更快。

编辑： 假设您有一个以 0,0 为中心的正方形 1x1。这意味着正方形的坐标是 (-.5,-.5) 到 (.5, .5)。我们想用剪裁把它变成一个圆圈。单个 gl scissor 调用只会从一侧切断一个盒子形状，因此我们将使用 scissor 命令循环来执行此操作。 （同样，如果您可以创建一个圆形多边形，那会更快）。

做圆形切割的伪代码：

polyX = 0;
polyY = 0;
polyWidth = 1;
rad = pi/180

for (int i = 0; i <360; i++)

    x = Math.cos(i*rad)*polyWidth + polyX;
    y = Math.sin(i*rad)*polyWidth + polyY;
    glScissor(x,y,((polyWidth/2)-polyX)-x,.05); 

【讨论】：

我没有真正理解你所说的，抱歉，你能帮我写一些代码吗？你想从创建一个圆形开始说什么？我现在将我的代码添加到主要问题中

再次感谢您的回答，我会看看并尝试两个答案，看看哪个脚更好

第 200 页定义了剪刀测试：opengl.org/documentation/specs/version2.0/glspec20.pdf。只有一个剪刀盒。你不能组合很多盒子。实际上，您可以将每个像素绘制到累积缓冲区中，但这会非常慢。