[SwiftUI] Shapes

Shapes가 UIKit에도 비슷한 개념이 있었는지 모르겠다.

요즘 SwiftUI 코드만 보다보니 UIKit 코드가 점점 잊혀지는거 같은데....

잊기전에 다시 한 번 봐야겠다.

 

Shapes

Rectangle, RoundedRectangle, Circle, Ellipse, Capsule 이 기본 Shape이고,

ScaledShape, RotatedShape, OffsetShape, TransformedShape은 기본 Shape을 변형시켜 사용하는 것이다.

Rectangle()
    .fill(.red)
    .frame(width: 300, height: 40)
RoundedRectangle(cornerRadius: 15, style: .circular)
    .fill(.orange)
    .frame(width: 290, height: 40)
RoundedRectangle(cornerRadius: 20, style: .continuous)
    .fill(.yellow)
    .frame(width: 280, height: 40)
Circle()
    .fill(.green)
    .frame(width: 270, height: 30)
Ellipse()
    .fill(.blue)
    .frame(width: 260, height: 40)
Capsule(style: .circular)
    .fill(.indigo)
    .frame(width: 250, height: 40)
Capsule(style: .continuous)
    .fill(.purple)
    .frame(width: 240, height: 40)

ScaledShape(shape: Rectangle(),
            scale: CGSize(width: 10, height: 4))
.fill(.pink)
.frame(width: 23, height: 10)
.padding()
RotatedShape(shape: Capsule(style: .continuous),
             angle: .radians(0.4))
.fill(.mint)
.frame(width: 220, height: 40)
OffsetShape(shape: Ellipse(),
            offset: CGSize(width: 50, height: 10))
.fill(.cyan)
.frame(width: 210, height: 40)
TransformedShape(shape: RoundedRectangle(cornerRadius: 15, style: .circular),
                 transform: CGAffineTransform(a: -0.2, b: -0.3, c: 6, d: 1, tx: 0, ty: 0))
.fill(.teal)
.frame(width: 200, height: 40)

다른 건 코드를 천천히 읽다보면 다 이해가 되는데 TransformedShape의 CGAffineTransform은 정말 1도 이해를 못했다.

공식 페이지에서도 일반적으로 이동, 크기 변환, 회전 등의 작업을 한다면 굳이 CGAffineTransform를 직접 생성할 필요가 없다고 한다.

 

그래도 도대체 AffineTransform이 뭔가 이해해보려다가 행렬벡터에 대한 지식이 부족해서 포기했다.

Scaled, Rotated, Offset만 잘 써도 반이상은 갈거 같다.