반응형

 

Hacking with Swift 사이트의 강좌 번역본입니다.

 

[원문 : https://www.hackingwithswift.com/quick-start/swiftui/how-to-clip-a-view-so-only-part-is-visible]

 

How to clip a view so only part is visible

 

SwiftUI는 clipShape() modifier를 사용해서, 도형을 제어하기 위해서 clip합니다.

 

예를들어 다음은 시스템 이미지 bolt.fill을 사용해 버튼을 만들고(채워진 번개 모양), 패딩과 배경색을 주고, 원(circle)를 사용해서 clips 하므로, 원(circle) 버튼이 됩니다.

Button(action: {
    print("Button tapped")
}) {
    Image(systemName: "bolt.fill")
        .foregroundColor(.white)
        .padding()
        .background(Color.green)
        .clipShape(Circle())
}

 

Circle는 clip 도형은 넓이와 높이가 다른 경우에도 항상 뷰에서 원을 만듭니다 - 작은 값에 맞춰서 큰 값을 잘라(crop)냅니다.

 

Circle 뿐만아니라 Capsule도 있으며, 마름모꼴(lozenge) 도형에서 둥근 모서리르 갖도록 뷰를 자릅(crop)니다.

Button(action: {
    print("Button tapped")
}) {
    Image(systemName: "bolt.fill")
        .foregroundColor(.white)
        .padding(EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 20))
        .background(Color.green)
        .clipShape(Capsule())
}

 

반응형
Posted by 까칠코더
,