Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ロック画面Widgetをサクッと実装してみた話

aoi
February 21, 2023

 ロック画面Widgetをサクッと実装してみた話

aoi

February 21, 2023
Tweet

More Decks by aoi

Other Decks in Programming

Transcript

  1. ϩοΫը໘ Widget ΛαΫοͱ࣮૷ͯ͠Έͨ࿩
    Aoi Okawa (@aomathwift) 2023/02/21 potatotips #81

    View Slide

  2. ϩοΫը໘ Widgetʁ

    View Slide

  3. ϩοΫը໘ Widget ͱ͸
    ● iOS 16 ͔Β࢖͑ΔϩοΫը໘
    ΧελϚΠζػೳͷҰ෦
    ● AppleWatch ͷίϯϓϦέʔ
    γϣϯͷΑ͏ͳ Widget

    View Slide

  4. ৽͍͠ WidgetFamily
    accessory


    Circular
    accessory


    Rectangular
    accessory


    Inline

    View Slide

  5. ࣮૷ํ๏
    @main


    struct CookpadMartWidget: Widget {


    var body: some WidgetConfiguration {


    StaticConfiguration(


    kind: "DefaultWidget",


    provider: Provider()


    ) { entry in


    EntryView(entry: entry)


    }


    .supportedFamilies([.systemSmall, .accessoryCircular])


    // ...


    }


    }

    View Slide

  6. ࣮૷ํ๏
    struct EntryView : View {


    @Environment(\.widgetFamily) var family


    var entry: Provider.Entry


    var body: some View {


    switch family {


    case .systemSmall:


    SmallView(entry: entry)


    case .accessoryCircular:


    CircularView(entry: entry)


    // ...


    @unknown default:


    Text("default")


    }


    }


    }

    View Slide

  7. Cookpad Mart ͷ Widget ػೳ طʹಋೖࡁΈ🎉

    View Slide

  8. ϩοΫը໘ Widget ΋
    αΫοͱಋೖͰ͖ͦ͏💡

    View Slide

  9. ● accessoryRectangular
    ͱ accessoryCircular
    ͷ 2αΠζΛαϙʔτ
    ● iOS Ͱͷར༻ͷΈΛ૝ఆ
    ࣮૷ͯ͠Έͨ

    View Slide

  10. ಋೖͯ͠Έͨॴײ

    View Slide

  11. ● දࣔͰ͖Δ৘ใྔ͕ϗʔϜը
    ໘ Widget ʹൺ΂ͯগͳ͍
    ● ΞϓϦΛىಈ͢Δಈઢͱͯ͠
    ͷ׆༻ʹৼΓ੾Δͷ΋༗Γ
    දࣔίϯςϯπͷ೉͠͞

    View Slide

  12. Inline ͸ෆ࠾༻
    ● Rectangular Ҏ্ʹڝ૪཰͕ߴ͍ʢ࿮1ͷΈʣ
    ● ೔෇ͷྡʹઃஔ͞ΕΔͷͰ਺஋৘ใ͕ຒ΋Ε΍͍͢
    ϚʔτΞϓϦͰ͸ड͚औΓ༧ఆ೔Λදࣔ
    ͠Α͏ͱ͕ͨ͠ɺ࣌ࠁͷ্ʹ೔෇͕ೋͭ
    ฒͿͱ͍͏ݟͨ໨͕ෆࣗવա͗ͯ຅🥲

    View Slide

  13. ར༻͞ΕͯΔʁ
    accessoryRectangular Λઃஔ͍ͯ͠ΔϢʔβʔͷׂ߹ 0.018%
    accessoryCircular Λઃஔ͍ͯ͠ΔϢʔβʔͷׂ߹ 0.10%
    (ࢀߟ) systemMedium Λઃஔͯ͠ΔϢʔβʔͷׂ߹ 0.045%
    (ࢀߟ) systemSmall Λઃஔ͍ͯ͠ΔϢʔβʔͷׂ߹ 0.098%

    View Slide

  14. ࢖ͬͯ΋Β͏ͷ͕೉͍͠
    ● ػೳͷଘࡏࣗମ͕ೝ஌͞Εʹ͍͘
    ● ࿮ͷڝ૪཰͕ߴ͗͢Δ
    ● શ෦ͷαΠζ߹Θͤͯ࠷େͰ̑࿮
    ● ݱঢ়࿮ͷ਺͕ଟ͍ํ͕࢖ͬͯ΋Β͑ͯΔ

    View Slide

  15. Widget ར༻ͷϩάͷऔΓํ
    ● WidgetCenter.getCurrentConfigurations


    ● ઃஔ͞ΕͯΔ WidgetFamily ͕഑ྻͰฦΔ
    ● ΞϓϦ͕ΞΫςΟϒʹͳΔ౓ʹ࠷৽஋Λૹ৴

    View Slide

  16. ࠓޙͷ՝୊
    ● ػೳͷଘࡏͷೝ஌Λ্͛Δ
    ● ίϯςϯπͷϒϥογϡΞοϓ
    ● LiveActivity ౳΋ಋೖͯ͠ϩοΫը໘Ͱͷଘࡏײ ⬆

    View Slide