DragonRuby: 직사각형 회전

DragonRuby 에서 드로잉 프리미티브 중 하나는 "솔리드"(실제로 직사각형)입니다.

사각형은 오른쪽 아래 모서리의 원점( x , y )과 높이/너비 크기( h , w )로 정의됩니다.

예를 들어, 이 코드는 대략 화면 중앙에 검정색 사각형을 그립니다.

def tick(args)
  args.outputs.solids << {
    x: 490,
    y: 310,
    w: 300,
    h: 100,
  }
end

사각형은 간단하고 (아마도) 빠릅니다. 하지만 직사각형을 비스듬히 배치하려면 어떻게 해야 할까요? 아니면 빙글빙글 돌려?

스프라이트의 경우 angle 속성이 있습니다. 직사각형에도 적용되나요? 불행하게도.

직사각형 이미지를 만들어 스프라이트에서 사용할 수 있지만 낭비인 것 같습니다. 스프라이트의 크기를 조정하는 것이 리소스를 많이 사용하는지 모르겠지만 간단한 사각형의 크기를 변경하는 것보다 더 많은 주기가 필요합니다.

다행히도 중간 방법이 있습니다.

2.26 릴리즈 노트에서

** [API] Pre-defined ~:pixel~ render target now available.
Before ~(boot|tick)~ are invoked, a white solid with a size of 1280x1280
is added as a render target. You can use this predefined render target to
create solids and get ~args.outputs.sprites~ related capabilities.

즉, 다음과 같이 위와 동일한 사각형을 만들 수 있습니다.

def tick(args)
  args.outputs.sprites << {
    x: 490,
    y: 310,
    w: 300,
    h: 100,
    r: 0,
    g: 0,
    b: 0,
    path: :pixel,
  }
end

핵심 조각은 path: :pixel이며 솔리드 대신 스프라이트를 생성합니다.

위에서 언급했듯이 :pixel는 흰색이므로 색상을 검정색으로 설정하기 전과 정확히 동일한 결과를 얻습니다. r g b 값이 지정되지 않은 경우 흰색 사각형이 됩니다.

이제 이 사각형을 회전시킬 수 있습니까?

확신하는!

def tick(args)
  args.outputs.sprites << {
    x: 490,
    y: 310,
    w: 300,
    h: 100,
    r: 0,
    g: 0,
    b: 0,
    path: :pixel,
    angle: 45,
  }
end

(그런데 DragonRuby의 각도는 도 단위입니다.)

빙글빙글 빙글빙글

다음은 사각형을 회전시키는 예입니다.

def tick(args)
    args.outputs.sprites << {
      x: 490,
      y: 310,
      w: 300,
      h: 100,
      r: 0,
      g: 0,
      b: 0,
      path: :pixel,
      angle: args.tick_count % 360,
    }
end

이것은 훌륭하고 모든 것입니다. 하지만 차라리 이렇게 회전하게 하려면 어떻게 해야 합니까?



약간의 조사를 통해 angle_anchor_x 및 angle_anchor_y 속성을 찾을 수 있습니다. 그리고 그것들이 좌표 격자의 점을 참조한다고 생각하면 용서받을 것입니다. 하지만 그렇지 않습니다!

대신 angle_anchor_x 및 angle_anchor_y는 스프라이트 자체에 대한 백분율입니다.

즉, 두 앵커가 모두 0.5(기본값)로 설정된 경우 회전 중심은 스프라이트의 중앙(너비의 절반과 높이의 절반)이 됩니다.
0 , 0는 위에 표시된 것처럼 스프라이트의 왼쪽 하단 모서리입니다.

def tick(args)
    args.outputs.sprites << {
      x: 490,
      y: 310,
      w: 300,
      h: 100,
      r: 0,
      g: 0,
      b: 0,
      path: :pixel,
      angle: args.tick_count % 360,
      angle_anchor_x: 0,
      angle_anchor_y: 0,
    }
end

0와 1 사이의 앵커 값은 스프라이트 내부에 있습니다. 그러나 1보다 크거나 0보다 작은 값은 스프라이트 외부에 있습니다.

다음은 약간의 참조입니다.



행복한 직사각형 회전!