frame(width:height:alignment:) 을 이용해 view의 frame 을 설정할 때 세번째 인자로 alignment 를 볼 수 있슴다
사용할 수 있는 값으로 어떤 것들이 있는지 확인하기 위해 . 을 눌러보면 꽤 많이 뜨는걸 볼 수 있는디요
이름만 보면 대충 어떻게 정렬되겠다~ 감이 오긴하져?
Alignment 문서에도 바로 이렇게 나와있네요!
그래도.. 직접 확인해보는게 가장 잘 기억에 남긴 하니까 아래 이미지로 한번 확인해보져!
대부분의 alignment 값은 view 와 frame 의 크기가 일치하는 경우 딱히 유의미한 효과가 없기 때문에 width 와 height 값도 같이 줄게요!
그럼 고고링~
defualt (center)
Image("rainbow")
.frame(width: 400, height: 200)frame(width:height:alignment:) 에서 alignment 의 기본 값은 center 입니다
상하좌우 기준으로 모두 가운데 정렬됩니다
topLeading
위/좌측 정렬 됩니다
top
위로 정렬되고, 좌우 기준으로는 중앙 정렬됩니다.
아까 center 과 비교하면 y 축만 달라진 것을 확인할 수 있져?
topTrailing
위/우측 정렬 됩니다
leading
좌측 정렬되고, 위아래 기준으로는 중앙 정렬됩니다.
center
상하좌우 기준으로 모두 중앙 정렬됩니다. 위에서 언급했듯 default 값입니다.
trailing
우측 정렬되고, 위아래 기준으로는 중앙 정렬됩니다.
bottomLeading
아래/좌측 정렬 됩니다
bottom
아래로 정렬되고, 좌우 기준으로는 중앙 정렬됩니다.
bottomTrailing
아래/우측 정렬 됩니다
마무리
이름대로 명확한 결과였네여
다만 top, leading, bottom, trailing 은 topLeading 이나 bottomTrailing 등과 다르게 상하 / 좌우를 모두 판단할 수 있는 정보가 담겨있지 않아 헷갈릴 수도 있는데요!
이럴땐 판단 할 수 없는 나머지 정보는 가운데 정렬이다라고 생각하면 될 것 같습니다
예를 들어
top -> 우선 위아래 기준으로 위네? 나머지 좌우 기준은 가운데겠다!
leading -> 우선 좌우 기준으로 좌네? 나머지 위아래 기준은 가운데겠다!
이렇게 말이져
