일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
Tags
- 백준
- RxSwift
- raywenderlich
- swift
- 패스트캠퍼스
- Swfit
- rxcocoa
- tableView
- TCA
- node.js
- SwiftUI
- Xcode
- 프로그래머스
- CollectionView
- Lv2
- Flutter
- BFS
- BOJ
- combine
- realm
- arkit
- UIKit
- visionOS
- ios
- reactorkit
- XCTest
- MVVM
- Kuring
- designpattern
- SnapKit
Archives
- Today
- Total
lgvv98
[SwiftUI] How to set Image in SwiftUI 본문
How to set Image in SwiftUI
✅ SwiftUI에서 Image를 세팅하는 방법에 대해 알아봅니다.
✅ CircleImageView.swift
import SwiftUI
struct CircleImageView : View {
var body: some View {
//Image(systemName: "bolt.circle")
// .font(.system(size: 200)) // 시스템 이미지는 font로 크기를 조절함.
// .foregroundColor(.yellow)
// .shadow(color: .gray, radius: 2, x: 2, y: 10)
Image("myImage")
.resizable() // 이미지의 크기를 조정해주기 위해서
.scaledToFill() // 이미지 화면에 맞는 옵션
.frame(width: 300, height: 300) // Image 크기 지정
.clipShape(Circle()) // 모양을 원으로 지정
.shadow(color: .gray, radius: 10, x: 0, y: 10) // 이미지 그림자 설정
// overlay를 통해서 겹치게 하는 기술!
.overlay(
Circle()
.foregroundColor(.black)
.opacity(0.7) // 이미지 자체를 어둡게 하기 위한 스킬!
)
// 아래 이미지에 줄 테두리
.overlay(
// lineWidth는 쉽게 말해서 선의 굵기
Circle().stroke(Color.red, lineWidth: 10)
.padding() // 패딩으로 오버레이된 이미지에 위치 조정
)
.overlay(
Circle().stroke(Color.yellow, lineWidth: 10)
.padding(30)
)
.overlay(
Circle().stroke(Color.blue, lineWidth: 10)
)
// 텍스트도 넣을 수 있다!
.overlay(
Text("호호")
.foregroundColor(.white)
.font(.system(size: 50))
.fontWeight(.bold)
)
// .aspectRatio(contentMode: .fill)
// .clipped()
// .edgesIgnoringSafeArea(.all)
}
}
'apple > 🚁 SwiftUI & Combine' 카테고리의 다른 글
[SwiftUI] NavigationView (0) | 2022.05.18 |
---|---|
[SwiftUI] List (tableView in UIKit) (0) | 2022.05.18 |
[SwiftUI] Alert (0) | 2022.05.18 |
[SwiftUI] VStack, HStack, ZStack (0) | 2022.05.18 |
[SwiftUI] Info.plist가 없을 때🤔 (0) | 2022.02.23 |
Comments