×
Copy
Open
Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
Auto Layout Tips USAMI Kosuke Fenrir Inc.
Slide 2
Slide 2 text
Auto Layout → iOS / OS X ͰͷϏϡʔͷϨΠΞτख๏ → ੍Λఆٛ͢Δ͜ͱͰαΠζҐஔΛࣗಈܭࢉ → ैདྷͷϑϨʔϜϕʔεϨΠΞτͱൃ͕ҟͳΔ
Slide 3
Slide 3 text
No content
Slide 4
Slide 4 text
UIKit σβΠϯύλʔϯͱ Auto Layout → UIScrollView ͱ Auto Layout → UITableView ͱ Auto Layout → UICollectionView ͱ Auto Layout → ͜ΕΒͷΈ߹ΘͤҊ֎͍ͨΜ
Slide 5
Slide 5 text
UIScrollView & Auto Layout
Slide 6
Slide 6 text
͏·͍͔͘ͳ͍ύλʔϯ → UIScrollView ͷதͷ View ͷαΠζ͕ Auto Layout Ͱܾ·Βͳ͍ → contentSize ΛίʔυͰઃఆ͢Δඞཁ͕ग़ͯ͘Δ → దͳ contentSize ΛͲ͏༩͑Δ͔͘͠ͳΔ
Slide 7
Slide 7 text
Content View → ·ͣ UIScrollView ͷଆʹ Content View Λ࡞Δ → UIScrollView ͱ Content View ͱͷ্Լࠨӈͷ֤ล ʹ੍Λఆٛ͢Δ → ͜ΕͰ contentSize = Content View ͷαΠζͱͳ Δ
Slide 8
Slide 8 text
͏·͍͘͘ύλʔϯ → Content View ͷαΠζΛ UIScrollView ͷ ֎ଆ ʹ ͋Δཁૉ͔Βܾ·ΔΑ͏ʹ͢Δ → ྫ͑࣍ͷΑ͏ͳ֊ͷͱ͖ → (1) UIView - (2) UIScrollView - (3) Content View → (3) ͷαΠζ͕ (1) ͔Βܾ·ΔΑ͏ʹ͢Δ → ʢྫ͑ɺ෯͕͍͠ͱ͔ʣ
Slide 9
Slide 9 text
UIScrollView & Auto Layout → ͜ΕͰ Auto Layout ͚ͩͰ݁͢Δ → contentSize ΛίʔυͰઃఆ͢Δඞཁ͕ͳ͘ͳΔ
Slide 10
Slide 10 text
UITableView & Auto Layout
Slide 11
Slide 11 text
UITableView → UITableViewDelegate / UITableViewDataSource → Cell ͷੜͷલʹɺCell ͷߴ͞Λฦ͢ඞཁ͕͋Δ → Cell ͷߴ͕͞ݻఆͰ͋Εޮ͕ྑ͍ઃܭ
Slide 12
Slide 12 text
ߴ͕͞ݻఆͰͳ͍ͱ͖ → Cell ͷߴ͕͞ݻఆͰͳ͍ͱ͖͋·Γྑ͘ͳ͍ → ߴ͞ΛΔͨΊʹԾʹ Cell Λੜ͢Δʁ → ಛʹ Auto Layout ͱ૬ੑ͕ѱ͍
Slide 13
Slide 13 text
Self Sizing Cell (iOS 8) → tableView:estimatedHeightForRowAtIndexPath: Ͱ Ծͷߴ͞Λฦ͢ → tableView:heightForRowAtIndexPath: Ͱ UITableViewAutomaticDimension Λฦ͢ → ͜ΕͰ Auto Layout Ͱܾ·Δߴ͕͞ Cell ͷߴ͞ʹ
Slide 14
Slide 14 text
UITableView & Auto Layout → ͜ΕͰ Auto Layout ͚ͩͰ݁͢Δ → Ծͷ Cell ͱ͔࡞Βͳ͍͍ͯ͘
Slide 15
Slide 15 text
ҙ : Storyboard ্ͷઃఆ → Storyboard ্Ͱ UITableViewCell ͷߴ͞ೖྗཁ → Cell ͷߴ͞ͱ Content View ͷߴ͞Λ߹ͤ͞Δ → Content View ͷϨΠΞτΛΈͳ͕ΒɺͦΕʹ ͋Θͤͯ Cell ͷߴ͞Λௐɾɾɾʢਖ਼ͩΔ͍ʣ
Slide 16
Slide 16 text
UICollectionVi ew & Auto Layout
Slide 17
Slide 17 text
UICollectionView → ઃܭ UITableView Λ౿ऻ → UICollectionViewLayout Ͱ༷ʑͳϨΠΞτ → ͜͜Ͱ UICollectionViewFlowLayout Λѻ͏
Slide 18
Slide 18 text
αΠζ͕ݻఆͰͳ͍ͱ͖ → Γઌʹ Cell ͷαΠζΛฦ͢ඞཁ͕͋Δ → Auto Layout ͱ૬ੑ͕ѱ͍
Slide 19
Slide 19 text
Self Sizing Cell (iOS 8) → estimatedItemSize ʹԾͷαΠζΛฦ͢ ʢUISizeZero Ҏ֎ʣ → itemSize ઃఆ͠ͳͯ͘ྑ͍ → ͜ΕͰ Auto Layout ͷαΠζ͕ Cell αΠζʹ
Slide 20
Slide 20 text
UICollectionView & Auto Layout → ͜ΕͰ Auto Layout ͚ͩͰ݁͢Δ → Ծͷ Cell ͱ͔࡞Βͳ͍͍ͯ͘
Slide 21
Slide 21 text
Auto Layout ্खʹ͓͏