[SwiftUI] Overlay

뷰 위에 새로운 뷰를 추가할 때 쓴다.

struct Overlay: View {
	var body: some View {
    	EmojiView(emoji: " ")
        	.overlay(.blue)
    }
}

만약 모양대로 맞추고 싶다면 in 파라미터를 사용하면 된다.

struct Overlay: View {
	var body: some View {
    	EmojiView(emoji: " ")
        	.overlay(.blue, in: Circle())
    }
}

blur 효과

struct Overlay: View {
	var body: some View {
    	EmojiView(emoji: " ")
        	.overlay(.ultraThinMaterial, in: Circle())
    }
}

추가적으로 이미지를 오버레이하거나 다른 뷰를 오버레이 하는것도 가능하다.

이미지 오버레이

struct Overlay: View {
	var body: some View {
    	EmojiView(emoji: " ")
        	.overlay {
            	Image("big-photo")
                	.resizable()
            }
    }
}

위치 조정

선택 상태를 구현하고 싶을 때 overlay를 쓸 수 있다.

struct Overlay: View {
	@State var selected = false
    
	var body: some View {
    	EmojiView(emoji: " ")
        	.overlay(alignment: .bottomTrailing) {
            	if selected {
            		Image(systemName: "checkmark.circle.fill")
                		.foregroundColor(.blue)
                    	.font(.largeTitle)
                }
            }
            .onTapGesture {
            	selected.toggle()
            }
    }
}