๊ฐœ๋ฐœํ•˜๋Š” ํ›ˆ์ด 2021. 9. 3. 01:39

UIStackView

๐Ÿ’กA streamlined interface for laying out a collection of views in either a column or a row.

 

์Šคํƒ ๋ทฐ๋Š” ์Šคํƒ์ฒ˜๋Ÿผ ์„œ๋ธŒ ๋ทฐ๋“ค์„ ์Œ“์•„์„œ ๋™์ ์œผ๋กœ ๋‚ด๋ถ€ ํฌ๊ธฐ๋‚˜ ์œ„์น˜๋ฅผ ์กฐ์ ˆํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ด์ฃผ๋Š” UIView ์ž…๋‹ˆ๋‹ค. ๊ฐ€๋กœ ๋ฐฉํ–ฅ์ด๋‚˜ ์„ธ๋กœ ๋ฐฉํ–ฅ์„ ์„ค์ •ํ•  ์ˆ˜ ์žˆ๊ณ , ์Šคํƒ ๋ทฐ ๋‚ด๋ถ€์˜ ์š”์†Œ๋“ค์˜ ๊ฐ„๊ฒฉ์ด๋‚˜ ๋„ˆ๋น„/๋†’์ด๋„ ์ž๋™์œผ๋กœ ์กฐ์ ˆํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์›น์—์„œ ์‚ฌ์šฉํ•˜๋Š” Flex ์ปจํ…Œ์ด๋„ˆ์™€ ์œ ์‚ฌํ•ฉ๋‹ˆ๋‹ค. 

 

์Šคํƒ ๋ทฐ๋Š” arrangedSubView ๋ผ๋Š” UIView ๋ฐฐ์—ด์„ ์‚ฌ์šฉํ•˜๊ณ  ์ด๊ณณ์— ๋ทฐ๋“ค์„ ๋ชจ์•„ ์ˆœ์„œ๋Œ€๋กœ ๋ฐฐ์น˜ํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ์ด ์„œ๋ธŒ ๋ทฐ๋“ค์„ ์—ฌ๋Ÿฌ ์†์„ฑ์„ ํ†ตํ•ด ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ๋Š”๋ฐ, ๊ฐ€์žฅ ๊ธฐ๋ณธ์ ์ธ ์†์„ฑ์ด axis, distribution, alignment, spacing ์ž…๋‹ˆ๋‹ค.

Axis

๐Ÿ’กThe axis along which the arranged views are laid out.

 

axis ์†์„ฑ์€ ๋ ˆ์ด์•„์›ƒ์˜ ๋ฐฉํ–ฅ์„ ๊ฒฐ์ •ํ•ฉ๋‹ˆ๋‹ค. axis๋Š” horizontal ๊ณผ vertical ์„ ์„ค์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. 

Spacing

๐Ÿ’ก The distance in points between the adjacent edges of the stack view’s arranged views.

 

Spacing ์€ ์Šคํƒ ๋ทฐ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ์‚ฌ์ด ๊ฐ„๊ฒฉ์„ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค. ๊ฐ„๊ฒฉ์€ ์„ค์ •ํ•œ axis์— ๋”ฐ๋ผ ์ƒํ•˜ ํ˜น์€ ์ขŒ์šฐ์— ์ ์šฉ๋ฉ๋‹ˆ๋‹ค. ์œ„์—์„œ ์‚ฌ์šฉํ•œ ์˜ˆ์ œ์—์„œ๋Š” spacing ์ด 0์œผ๋กœ ์„ค์ •๋˜์–ด ์žˆ์ง€๋งŒ, 20์œผ๋กœ ์„ค์ •ํ•˜๋ฉด ๋‹ค์Œ๊ณผ ๊ฐ™์ด ๋ทฐ๋ฅผ ๋ฐฐ์น˜ํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

Alignment

๐Ÿ’ก The alignment of the arranged subviews perpendicular to the stack view’s axis.

 

Alignment ์†์„ฑ์€ ์Šคํƒ ๋ทฐ์˜ axis์˜ ์ˆ˜์ง ๋ฐฉํ–ฅ์„ ๊ธฐ์ค€์œผ๋กœ ์š”์†Œ๋“ค์„ ์–ด๋–ป๊ฒŒ ์ •๋ ฌํ• ์ง€ ๊ฒฐ์ •ํ•˜๋Š” ์†์„ฑ์ž…๋‹ˆ๋‹ค. ์Šคํƒ๋ทฐ๋ฅผ ์ฒ˜์Œ ์ƒ์„ฑํ–ˆ์„ ๋•Œ๋Š” ๊ธฐ๋ณธ๊ฐ’์œผ๋กœ Fill์ด ์„ค์ •๋˜์–ด ์žˆ๊ณ , alignment ๋กœ ์„ค์ • ํ•  ์ˆ˜ ์žˆ๋Š” ์†์„ฑ๋“ค์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.

 

Horizontal ์ผ๋•Œ:

  1. Fill: ์Šคํƒ ๋ทฐ์˜ ๋†’์ด๋งŒํผ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋†’์ด๋ฅผ ๊ฒฐ์ •ํ•ด ์Šคํƒ๋ทฐ์˜ ๋†’์ด๋งŒํผ ์ฑ„์›๋‹ˆ๋‹ค.
  2. Top: ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋†’์ด๋ฅผ ์œ ์ง€ํ•˜๋ฉด์„œ ์Šคํƒ ๋ทฐ ์ƒ๋‹จ์— ๋ถ™์—ฌ์ค๋‹ˆ๋‹ค.
  3. Center: ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋†’์ด๋ฅผ ์œ ์ง€ํ•˜๋ฉด์„œ ์Šคํƒ ๋ทฐ ์ค‘์•™์— ์ •๋ ฌํ•ฉ๋‹ˆ๋‹ค.
  4. Botton: ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋†’์ด๋ฅผ ์œ ์ง€ํ•˜๋ฉด์„œ ์Šคํƒ ๋ทฐ ํ•˜๋‹จ์— ์ •๋ ฌํ•ฉ๋‹ˆ๋‹ค.

Vertical ์ผ ๋•Œ:

  1. Fill: ์Šคํƒ ๋ทฐ์˜ ๊ฐ€๋กœ ๊ธธ์ด๋งŒํผ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„๋ฅผ ๊ฒฐ์ •ํ•ด ์Šคํƒ ๋ทฐ์˜ ๊ฐ€๋กœ๋งŒํผ ์ฑ„์›๋‹ˆ๋‹ค.
  2. Leading: ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„๋ฅผ ์œ ์ง€ํ•˜๊ณ  ๊ธฐ์ค€ ์ง€์—ญ์— ๋”ฐ๋ผ ๊ธ€์ž๊ฐ€ ์‹œ์ž‘ํ•˜๋Š” ๋ฐฉํ–ฅ์œผ๋กœ ๋‹น๊ฒจ์„œ ์ฑ„์›๋‹ˆ๋‹ค. ์˜์–ด๋Š” ๋ฌธ์žฅ์„ ์™ผ์ชฝ์—์„œ ์˜ค๋ฅธ์ชฝ ๋ฐฉํ–ฅ์œผ๋กœ ์ฝ๊ธฐ ๋•Œ๋ฌธ์— ์™ผ์ชฝ์œผ๋กœ ๋‹น๊ฒจ์„œ ์ •๋ ฌ๋ฉ๋‹ˆ๋‹ค.
  3. Center: ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„๋ฅผ ์œ ์ง€ํ•˜๊ณ  ์ค‘์•™์— ์ •๋ ฌํ•ฉ๋‹ˆ๋‹ค.
  4. trailing: ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„๋ฅผ ์œ ์ง€ํ•˜๊ณ  ๊ธฐ์ค€ ์ง€์—ญ์— ๋”ฐ๋ผ ๊ธ€์ž๊ฐ€ ๋๋‚˜๋Š” ๋ฐฉํ–ฅ์œผ๋กœ ๋‹น๊ฒจ์„œ ์ฑ„์›๋‹ˆ๋‹ค. ์˜์–ด๋Š” ๋ฌธ์žฅ์„ ์™ผ์ชฝ์—์„œ ์˜ค๋ฅธ์ชฝ ๋ฐฉํ–ฅ์œผ๋กœ ์ฝ๊ธฐ ๋•Œ๋ฌธ์— ์˜ค๋ฅธ์ชฝ์œผ๋กœ ๋‹น๊ฒจ์„œ ์ •๋ ฌ๋ฉ๋‹ˆ๋‹ค.

Distribution

๐Ÿ’ก The distribution of the arranged views along the stack view’s axis.

 

Distribution์€ ์Šคํƒ๋ทฐ์˜ axis์˜ ์ˆ˜ํ‰๋ฐฉํ–ฅ์„ ๊ธฐ์ค€์œผ๋กœ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์„ ์–ด๋–ป๊ฒŒ ๋ฐฐ์น˜ํ• ์ง€ ๊ฒฐ์ •ํ•˜๋Š” ์†์„ฑ์ž…๋‹ˆ๋‹ค. Distribution์€ 5๊ฐ€์ง€ ์†์„ฑ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฐ ์†์„ฑ๋“ค์€ Horizontal์„ ๊ธฐ์ค€์œผ๋กœ ์„ค๋ช…ํ•˜๋„๋ก ํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค.

 

Fill

๐Ÿ’ก A layout where the stack view resizes its arranged views so that they fill the available space along the stack view’s axis. When the arranged views do not fit within the stack view, it shrinks the views according to their compression resistance priority. If the arranged views do not fill the stack view, it stretches the views according to their hugging priority. If there is any ambiguity, the stack view resizes the arranged views based on their index in the arrangedSubviews array.

 

Fill ์†์„ฑ์€ ํ˜„์žฌ ๊ธฐ์ค€ ๋ฐฉํ–ฅ์œผ๋กœ ์š”์†Œ๋“ค์„ ์ฑ„์šฐ๊ธฐ ์œ„ํ•œ ์†์„ฑ์ž…๋‹ˆ๋‹ค. ๋งŒ์•ฝ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„์˜ ํ•ฉ์ด ์Šคํƒ ๋ทฐ์˜ ๋„ˆ๋น„๋ณด๋‹ค ํฌ๋‹ค๋ฉด compression resistance priority ์— ๋”ฐ๋ผ ์„œ๋ธŒ ๋ทฐ๋“ค์˜ ํฌ๊ธฐ๋ฅผ ์ค„์ด๊ณ , ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„์˜ ํ•ฉ์ด ์Šคํƒ ๋ทฐ์˜ ๋„ˆ๋น„๋ณด๋‹ค ์ž‘์œผ๋ฉด hugging priority์— ๋”ฐ๋ผ ๋ทฐ๋“ค์˜ ๋„ˆ๋น„๋ฅผ ํ™•์žฅ์‹œํ‚ต๋‹ˆ๋‹ค.

  • compression resistance priority: ์ตœ์†Œ ํฌ๊ธฐ์— ๋Œ€ํ•œ ์ œํ•œ ์šฐ์„ ์ˆœ์œ„
  • hugging prioity: ์ตœ๋Œ€ ํฌ๊ธฐ์— ๋Œ€ํ•œ ์ œํ•œ ์šฐ์„ ์ˆœ์œ„

์œ„์™€ ๊ฐ™์ด Fill๋กœ ๊ฐ€๋“ ์ฑ„์šฐ๋ฉด, First ๋ผ๋ฒจ๋งŒ ํฌ๊ธฐ๊ฐ€ ๋Š˜์–ด๋‚˜์„œ ์Šคํƒ ๋ทฐ์˜ ๊ฐ€๋กœ ๋„ˆ๋น„๋ฅผ ์š”์†Œ๋“ค๋กœ ์ฑ„์šฐ๊ฒŒ ๋˜๊ณ  ๋‹ค๋ฅธ ์š”์†Œ๋“ค์˜ ํฌ๊ธฐ๋Š” ๋ฐ”๋€Œ์ง€ ์•Š์€ ๊ฒƒ์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์™œ๋ƒํ•˜๋ฉด First ๋ผ๋ฒจ์ด ๋‹ค๋ฅธ ๋ผ๋ฒจ๋ณด๋‹ค ๋” ๋‚ฎ์€ hugging priority ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. ์šฐ์„ ์ˆœ์œ„๊ฐ€ ๋‚ฎ๊ธฐ ๋•Œ๋ฌธ์— ๊ฐ€์žฅ ๋จผ์ € ์ตœ๋Œ€ ํฌ๊ธฐ๋ฅผ ๋ณ€๊ฒฝํ•˜๊ฒŒ ๋˜๊ณ , ์Šคํƒ ๋ทฐ์˜ ๊ฐ€๋กœ ํฌ๊ธฐ๋ฅผ ๊ฐ€๋“์ฑ„์šฐ๊ธฐ ์œ„ํ•ด First๋ผ๋ฒจ์˜ ๊ฐ€๋กœ ๋„ˆ๋น„๋ฅผ ๋Š˜๋ฆฌ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ๋งŒ์•ฝ ๋‚ด๋ถ€์š”์†Œ์˜ ์šฐ์„ ์ˆœ์œ„๊ฐ€ ๋ชจ๋‘ ๊ฐ™๋‹ค๋ฉด, ์ธ๋ฑ์Šค ์ˆœ์œผ๋กœ ํฌ๊ธฐ๋ฅผ ์กฐ์ ˆํ•ฉ๋‹ˆ๋‹ค.

 

ํ˜„์žฌ First๋Š” 250์˜ hugging priority๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ๊ณ , ๋‚˜๋จธ์ง€ ๋ผ๋ฒจ๋“ค์€ 251์˜ hugging priority๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ๊ทธ๋Ÿผ ๋งŒ์•ฝ First๋ผ๋ฒจ์˜ ์šฐ์„ ์ˆœ์œ„๋ฅผ ๋†’์—ฌ์ฃผ๋ฉด ์–ด๋–ป๊ฒŒ ๋ ๊นŒ์š”?

 

First์˜ ์šฐ์„ ์ˆœ์œ„๋ฅผ ๋†’์ด๋ฉด Second, Third, Fourth ๋ผ๋ฒจ์˜ ์šฐ์„ ์ˆœ์œ„๊ฐ€ ๋™์ผํ•œ ๊ฐ’์œผ๋กœ ๊ฐ€์žฅ ๋‚ฎ์€ ์šฐ์„ ์ˆœ์œ„๊ฐ€ ๋˜๊ณ , ์ด ์ค‘ ๊ฐ€์žฅ ์•ž์„  ์ธ๋ฑ์Šค์— ์žˆ๋Š” Second ์˜ ๋„ˆ๋น„๊ฐ€ ๋Š˜์–ด๋‚ฉ๋‹ˆ๋‹ค.

 

Fill Equally

๐Ÿ’ก A layout where the stack view resizes its arranged views so that they fill the available space along the stack view’s axis. The views are resized so that they are all the same size along the stack view’s axis.

 

Fill Equally๋Š” ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์„ ์Šคํƒ ๋ทฐ์˜ ๋„ˆ๋น„์— ๋งž๊ฒŒ ์ฑ„์šฐ๊ธฐ ์œ„ํ•ด ๊ฐ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„๋ฅผ ๋™์ผํ•˜๊ฒŒ ๋งž์ถฐ์ค๋‹ˆ๋‹ค. ์ฆ‰, ๋„ˆ๋น„๊ฐ€ ๊ธด ๋ทฐ๋Š” ๋„ˆ๋น„๋ฅผ ๊ฐ์†Œ์‹œํ‚ค๊ณ , ๋„ˆ๋น„๊ฐ€ ์ž‘์€ ๋ทฐ๋Š” ๋„ˆ๋น„๋ฅผ ์ฆ๊ฐ€์‹œํ‚ต๋‹ˆ๋‹ค.

 

 

์œ„์ฒ˜๋Ÿผ ์Šคํƒ ๋ทฐ๋ฅผ ์ฑ„์šฐ๊ธฐ ์œ„ํ•ด ๋ชจ๋“  ๋ผ๋ฒจ๋“ค์˜ ๋„ˆ๋น„๊ฐ€ ๋™์ผํ•ด์กŒ์Œ์„ ์•Œ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

 

Fill Proportionally

๐Ÿ’ก A layout where the stack view resizes its arranged views so that they fill the available space along the stack view’s axis. Views are resized proportionally based on their intrinsic content size along the stack view’s axis.

 

Fill Proportionally ๋Š” ์Šคํƒ ๋ทฐ๋ฅผ ์ฑ„์šฐ๊ธฐ ์œ„ํ•ด Intrinsic content size๋ฅผ ๊ธฐ์ค€์œผ๋กœ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„๋ฅผ ๋ณ€๊ฒฝํ•ฉ๋‹ˆ๋‹ค. ์ด๋•Œ Intrinsic content size ๋Š” ๋ทฐ๊ฐ€ ๊ฐ€์ง€๋Š” ์ปจํ…์ธ ๋ฅผ ๊ธฐ์ค€์œผ๋กœ ๊ณ„์‚ฐ๋˜๋Š” ํฌ๊ธฐ๋ฅผ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค. Intrinsic content size๋Š” ์–ด๋–ค ๋ทฐ๋ฅผ ์‚ฌ์šฉํ•˜๋Š”์ง€์— ๋”ฐ๋ผ ๋‹ค๋ฅด๊ฒŒ ๊ณ„์‚ฐ๋ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, UILabel์€ ๋‚ด๋ถ€์— ์ ์šฉ๋˜๋Š” ํ…์ŠคํŠธ์˜ ํฐํŠธ ํฌ๊ธฐ์— ๋”ฐ๋ผ ๋†’์ด์™€ ๋„ˆ๋น„๊ฐ€ ๊ฒฐ์ •๋˜๊ธฐ ๋•Œ๋ฌธ์— Intrinsic content size์—๋Š” width ์™€ height ๊ฐ€ ํฌํ•จ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

 

์œ„ ์˜ˆ์ œ์—์„œ Fill Proportionally๋ฅผ ์ ์šฉํ•˜๋ฉด ๊ฐ ๋ผ๋ฒจ์˜ ๋‚ด๋ถ€ ํ…์ŠคํŠธ์— ๋”ฐ๋ผ ๊ฒฐ์ •๋œ Intrinsic content size๋ฅผ ํ•ด์น˜์ง€ ์•Š๋Š” ์„ ์—์„œ ๋ผ๋ฒจ์˜ ํฌ๊ธฐ๋ฅผ ์กฐ์ •ํ•˜๊ฒŒ ๋˜๊ณ  ๊ทธ ๊ฒฐ๊ณผ๋กœ ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์ ์šฉ๋ฉ๋‹ˆ๋‹ค.

 

Equal Spacing

๐Ÿ’ก A layout where the stack view positions its arranged views so that they fill the available space along the stack view’s axis. When the arranged views do not fill the stack view, it pads the spacing between the views evenly. If the arranged views do not fit within the stack view, it shrinks the views according to their compression resistance priority. If there is any ambiguity, the stack view shrinks the views based on their index in the 
arrangedSubviews array.

 

Equal Spacing์€ ์Šคํƒ ๋ทฐ ๋‚ด๋ถ€์˜ ๋ทฐ๋“ค์˜ ํฌ๊ธฐ๋ฅผ ์กฐ์ ˆํ•˜์ง€ ์•Š๊ณ  ๋‚ด๋ถ€ ๋ทฐ๋“ค ์‚ฌ์ด์˜ ๊ฐ„๊ฒฉ์„ ์ผ์ •ํ•˜๊ฒŒ ์ฆ๊ฐ€์‹œํ‚ค๊ฑฐ๋‚˜ ๊ฐ์†Œ์‹œ์ผœ ์Šคํƒ ๋ทฐ๋ฅผ ๊ฐ€๋“ ์ฑ„์›๋‹ˆ๋‹ค. ๋‚ด๋ถ€ ๋ทฐ๋“ค์˜ ๋„ˆ๋น„๊ฐ€ ์Šคํƒ ๋ทฐ์˜ ๋„ˆ๋น„๋ณด๋‹ค ์ปค์„œ ๊ฐ์†Œ์‹œ์ผœ์•ผํ•  ๋•Œ๋Š” compression resistance priority๋ฅผ ๊ธฐ์ค€์œผ๋กœ ์š”์†Œ๋ฅผ ์„ ํƒํ•˜์—ฌ ๊ฐ์†Œ์‹œํ‚ค๊ณ , ์šฐ์„ ์ˆœ์œ„๊ฐ€ ๋ชจ๋‘ ๊ฐ™์€ ๋•Œ๋Š” ์ธ๋ฑ์Šค๊ฐ€ ์•ž์„  ์š”์†Œ์˜ ํฌ๊ธฐ๋ฅผ ๋ณ€๊ฒฝ์‹œํ‚ต๋‹ˆ๋‹ค. 

 

Equal Centering

๐Ÿ’ก A layout that attempts to position the arranged views so that they have an equal center-to-center spacing along the stack view’s axis, while maintaining the spacing property’s distance between views. If the arranged views do not fit within the stack view, it shrinks the spacing until it reaches the minimum spacing defined by its 
spacing property. If the views still do not fit, the stack view shrinks the arranged views according to their compression resistance priority. If there is any ambiguity, the stack view shrinks the views based on their index in the arrangedSubviews array.

 

Equal Centering ์€ ์Šคํƒ ๋ทฐ์˜ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„์˜ ์ค‘๊ฐ„์ง€์ ์„ ๊ตฌํ•ด ๊ฐ ์š”์†Œ๋“ค์˜ ์ค‘๊ฐ„ ์ง€์  ์‚ฌ์ด์˜ ๊ฑฐ๋ฆฌ๊ฐ€ ๋™์ผํ•˜๋„๋ก Spacing์„ ์กฐ์ •ํ•ฉ๋‹ˆ๋‹ค. ๋งŒ์•ฝ ์ •๋ ฌํ•œ ์ดํ›„์˜ ์ „์ฒด ๋„ˆ๋น„๊ฐ€ ์Šคํƒ ๋ทฐ์˜ ๋„ˆ๋น„๋ณด๋‹ค ํฌ๋‹ค๋ฉด, spacing์„ ๊ณ„์†ํ•ด์„œ ์ค„์—ฌ์ฃผ๊ณ , ์ตœ์†Œ spacing ์†์„ฑ๋ณด๋‹ค ์ž‘์•„์ง„๋‹ค๋ฉด ๊ฐ ๋‚ด๋ถ€ ์š”์†Œ๋“ค์˜ ๋„ˆ๋น„๋ฅผ compression resistance priority์— ๋”ฐ๋ผ ์ค„์—ฌ์ค๋‹ˆ๋‹ค.