SwiftUI Listでつまずいたポイント

YUMEMI.grow Mobile #26 で発表した内容です。
https://yumemi.connpass.com/event/380643/

Transcript

1. ࠤ౻ॣ
    4XJGU6*
   
   -JTUͰͭ·͍ͣͨϙΠϯτ :6.&.*HSPX
   .PCJMF
   
2. ࣗݾ঺հ w ࠤ౻ॣ TBUUPO αοτϯ
   w NJOOF (.0ϖύϘ ͷJ04Τϯδ χΞ
   w झຯ͸໺ٿͱΫϥϑτϏʔϧ
   w !TIVOTBU
3. αϯϓϧ struct ContentView: View { @State private var deliveryArea = "" @State private var shippingFee = "" var body: some View { List { Button { } label: { HStack { Text("഑ૹํ๏") Spacer() Image(systemName: "chevron.right") .foregroundStyle(.secondary) } } .foregroundStyle(.primary) HStack { Text("഑ૹΤϦΞ") TextField("શࠃ", text: $deliveryArea) .multilineTextAlignment(.trailing) } HStack { Text("ૹྉ") TextField("", text: $shippingFee) .multilineTextAlignment(.trailing) .keyboardType(.numberPad) Text("ԁ") } } .listStyle(.insetGrouped) } }
4. ͜͜Λௐ੔͍ͨ͠
5. ࣮ݱ͔ͨͬͨ͜͠ͱ
   WT
   ݱ࣮ w ཧ૝ͷܗ
   w JOTFU(SPVQFEελΠϧͰηύϨʔλΛ -JTUͷ಺ଆ͍ͬͺ͍·Ͱ৳͹͍ͨ͠ w ໰୊
   w σϑΥϧτͰࠨӈʹڧ੍తͳ༨ന͕͋Δ
   w MJTU3PX4FQBSBUPSͰ͸Ґஔ·Ͱ͸੍ޚͰ͖ͳ͍
6. BMJHONFOU(VJEF͚ͩͰ͸ෆे෼ w JOTFU(SPVQFEελΠϧͰ͸ɺ-JTUͷߦશ ମʹࠨӈͷ༨ന͕ద༻͞ΕΔ
   w BMJHONFOU(VJEFͰௐ੔͠Α͏ͱͯ͠ ΋ɺίϯςϯπͷࠨ୺͕ج४ʹͳΓɺ -JTUͷ୺ʹ͸ಧ͔ͳ͍
   w MJTU3PX*OTFUT &HF*OTFUT ༨നΛ࡟আ͠ ͯɺॳΊͯηύϨʔλΛ྆୺·Ͱ৳͹ͤ Δ
7. मਖ਼ͨ͠ίʔυ HStack { ɾɾɾ } // ߦͷσϑΥϧτΠϯηοτʢ༨നʣΛ࡟আ .listRowInsets(EdgeInsets()) // ίϯςϯπࣗମʹύσΟϯάΛ௥Ճʢݟͨ໨Λҡ࣋͢ΔͨΊʣ .padding(.horizontal, 20) // ηύϨʔλͷ։࢝ҐஔΛࠨ୺ʹઃఆ .alignmentGuide(.listRowSeparatorLeading) { d in d[.leading] } // ηύϨʔλͷऴྃҐஔΛӈ୺ʹઃఆ .alignmentGuide(.listRowSeparatorTrailing) { d in d[.trailing] } ˞
   MJTU3PX4FQBSBUPS-FBEJOH
   
   MJTU3PX4FQBSBUPS5SBJMJOH
   ͸
   J04
   
   Ҏ߱Ͱར༻Մೳ
8. ղܾࡦ MJTU3PX*OTFUT &EHF*OTFUT Ͱ༨നΛͳ͘͢
   ߦͷσϑΥϧτͷ༨നΛ࡟আ͠ɺϏϡʔશମΛج४఺ʹ͢Δ
   QBEEJOH IPSJ[POUBM
    Ͱݟͨ໨Λ໭͢
   ༨ന͕ແ͘ͳͬͨ෼ɺQBEEJOHΛ௥Ճͯ͠ݟͨ໨Λमਖ਼
   BMJHONFOU(VJEFͰ୺͔Β୺·ͰηύϨʔλΛ޿͛Δ
   ༨ന͕ແ͘ͳͬͨྖҬʹରͯ͠ɺࠨ୺͔Βӈ୺͍ͬͺ͍·ͰηύϨʔλΛҾ͘
9. ࢀߟ w IUUQTEFWFMPQFSBQQMFDPNEPDVNFOUBUJPOTXJGUVJWJFXMJTUSPXJOTFUT @
   w IUUQTEFWFMPQFSBQQMFDPNEPDVNFOUBUJPOTXJGUVJIPSJ[POUBMBMJHONFOU MJTUSPXTFQBSBUPSMFBEJOH
   w IUUQTEFWFMPQFSBQQMFDPNEPDVNFOUBUJPOTXJGUVJIPSJ[POUBMBMJHONFOU MJTUSPXTFQBSBUPSUSBJMJOH
   w IUUQTXXXIBDLJOHXJUITXJGUDPNCPPLTJPTTXJGUVJBMJHONFOUBOEBMJHONFOUHVJEFT
10. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠🍵