Assets.xcassets에 큰 이미지가 있습니다. SwiftUI로이 이미지의 크기를 조정하여 작게 만드는 방법은 무엇입니까?
프레임을 설정하려고했지만 작동하지 않습니다.
Image(room.thumbnailImage)
.frame(width: 32.0, height: 32.0)
답변
에 .resizable()
크기 수정을 적용하기 전에을 사용해야 합니다 Image
.
Image(room.thumbnailImage)
.resizable()
.frame(width: 32.0, height: 32.0)
답변
이것은 어떤가요:
struct ResizedImage: View {
var body: some View {
Image("myImage")
.resizable()
.scaledToFit()
.frame(width: 200.0,height:200)
}
}
이미지보기는 200×200이지만 이미지는 원래 종횡비를 유지합니다 (해당 프레임 내에서 크기 조정).
답변
@rraphael의 답변과 의견을 확장합니다.
Xcode 11 베타 2부터는 이미지를 다른 요소로 래핑하여 원래 종횡비를 유지하면서 이미지를 임의의 크기로 조정할 수 있습니다.
예 :
struct FittedImage: View
{
let imageName: String
let width: CGFloat
let height: CGFloat
var body: some View {
VStack {
Image(systemName: imageName)
.resizable()
.aspectRatio(1, contentMode: .fit)
}
.frame(width: width, height: height)
}
}
struct FittedImagesView: View
{
private let _name = "checkmark"
var body: some View {
VStack {
FittedImage(imageName: _name, width: 50, height: 50)
.background(Color.yellow)
FittedImage(imageName: _name, width: 100, height: 50)
.background(Color.yellow)
FittedImage(imageName: _name, width: 50, height: 100)
.background(Color.yellow)
FittedImage(imageName: _name, width: 100, height: 100)
.background(Color.yellow)
}
}
}
결과
(어떤 이유로 이미지가 약간 흐릿하게 표시됩니다. 실제 출력은 선명하므로 안심하십시오.)
답변
SwiftUI에서 .resizable()
메서드를 사용하여 이미지 크기를 조정합니다. 를 사용 .aspectRatio()
하고 지정하여 ContentMode
적절하게 이미지를 “맞춤”또는 “채우기”할 수 있습니다.
예를 들어, 다음은 피팅하여 이미지 크기를 조정하는 코드입니다.
Image("example-image")
.resizable()
.aspectRatio(contentMode: .fit)
답변
글쎄, 그것은 SwiftUI 에서 매우 쉬운 것 같습니다 / 그들이 제공 한 데모에 따라 : https://developer.apple.com/videos/play/wwdc2019/204
struct RoomDetail: View {
let room: Room
var body: some View {
Image(room.imageName)
.resizable()
.aspectRatio(contentMode: .fit)
}
도움이 되었기를 바랍니다.
답변
struct AvatarImage: View {
var body: some View {
Image("myImage")
.resizable()
.scaledToFill() // <=== Saves aspect ratio
.frame(width: 60.0, height:60)
.clipShape(Circle())
}
}
답변
참고 : 내 이미지 이름은 다음
img_Logo
과 같이 이미지 속성을 정의하여 이미지 이름을 변경할 수 있습니다.
VStack(alignment: .leading, spacing: 1) {
//Image Logo Start
Image("img_Logo")
.resizable()
.padding(.all, 10.0)
.frame(width: UIScreen.main.bounds.width * 0.4, height: UIScreen.main.bounds.height * 0.2)
//Image Logo Done
}