인프런 커뮤니티 질문&답변
작성한 질문수
6-7) 이미지 사이즈 지정 위치 질문드립니다.
해결된 질문
작성
·
47
1
안녕하세요 애구마님!
6-7) 7:50 쯤에 이미지의 사이즈를 지정해주기 위해 frame() 작성하시는 부분에 질문이 있습니다.
bigBanner의 이미지 사이즈 지정 시
AsyncImage(url:URL(string:bigBanner)) { image in image
.resizable()
.cornerRadius(10)
.aspectRatio(contentMode: .fit)
// 여기서 사이즈 지정
.frame(width: 300, height: 525)
}poster의 이미지 사이즈 지정 시
AsyncImage(url: url) { image in
image
.resizable()
} placeholder: {
ProgressView()
.tint(Color.white)
}
// 여기서 사이즈 지정
.frame(width: 100, height: 175)첫 번째 AsyncImage를 작성하셨을 때 이미지 사이즈는 image에서 직접적으로 작성하셨는데 두번째 포스터들의 이미지 사이즈를 작성하실 때는 placeholder 아래쪽에 작성하신 이유가 궁금합니다.
답변 부탁드립니다.
감사합니다 :)
답변 1
0
애구마(agmma)
지식공유자
drfranken님 안녕하세요!
먼저 강의 수강해주셔서 감사드립니다
날카로운 질문인데요 ㅎㅎ
저도 왜 그랬을가 고민해봤는데, 큰 뜻이 없었던것 같습니다.
다만 코드 설명을 살짝 드리자면, 아래 두 코드는 같은 코드입니다.
.frame을 바깥에 두면 image의 크기와 placeholder내부의 뷰 크기를 둘다 제어해주고요.
만약 개별적으로 사이즈를 다르게 하고 싶다면, 내부에 각각 써주면 됩니다.
강의에서는 image크기와 placeHolder의 크기가 같기 때문에, 밖에 적으나 안에 적으나 상관이 없을거 같아요.
그래서, 두 코드를 다르게 작성했던거 같습니다.
감사합니다!
AsyncImage(url: url) { image in
image
.resizable()
.cornerRadius(10)
.aspectRatio(contentMode: .fit)
.frame(width: 300, height: 525)
} placeholder: {
RoundedRectangle(cornerRadius: 10)
.fill(Color.gray)
.opacity(0.4)
.overlay(
ProgressView()
.tint(Color.white)
)
.frame(width: 300, height: 525)
}
AsyncImage(url: url) { image in
image
.resizable()
.cornerRadius(10)
.aspectRatio(contentMode: .fit)
} placeholder: {
RoundedRectangle(cornerRadius: 10)
.fill(Color.gray)
.opacity(0.4)
.overlay(
ProgressView()
.tint(Color.white)
)
}
.frame(width: 300, height: 525)