$30 off During Our Annual Pro Sale. View Details »

iOS16で変わった画面の向きを操作する方法 - iOSDC Japan 2023

ras0q
September 03, 2023

iOS16で変わった画面の向きを操作する方法 - iOSDC Japan 2023

ras0q

September 03, 2023
Tweet

More Decks by ras0q

Other Decks in Technology

Transcript

  1. iOSDC 2023 Japan
    iOS16で変わった


    画面の向きを操作する方法
    2023/09/02 17:20〜 Track B ルーキーズLT
    Ras

    View Slide

  2. 自己紹介
    Ras (@ras0q) / Kira Kawai


    • 東京工業大学 (2020/04 ~)


    • 情報通信工学専攻


    • デジタル創作同好会 traP


    • 株式会社ピクシブ (2022/04 ~)


    • iOSエンジニアアルバイトとして参加


    • iOSDC Japan (2022 ~)


    • 参加2回目


    • 初登壇 🎉 🎉 🎉

    View Slide

  3. iOS16から


    画面の向き操作APIが


    (正式に)追加されました

    View Slide

  4. 画面の向き(orientation)を回転させるアプリ


    • 通常時は縦向きのみを許可


    • orientation = .portrait


    • 回転

    タンを押すことで強制的に横向きにする


    • orientation = .landscape


    • toggleOrientations(後述)が発火される


    GitHub: ras0q/iosdc2023-interface-orientation
    題材

    View Slide

  5. class ViewController: UIViewController {


    override var supportedInterfaceOrientations {


    return currentOrientation


    }
    実装方針 (共通)
    supportedInterfaceOrientations Ͱ޲͖Λ੍ޚ͢Δ


    ViewControllerごとに特定の向きのみを許可することができる


    固定値であればInfo.plistに書いて制御することもできる

    View Slide

  6. func toggleOrientations() {


    // ޲͖ͷঢ়ଶΛtoggle͢Δ


    currentOrientation = ...


    // ࣮ࡍʹ޲͖Λมߋ͢Δ


    changeOrientation(to: currentOrientation)


    }
    実装方針 (共通)
    toggleOrientations Ͱ޲͖Λมߋ͢Δ


    ճసϘλϯ͕ԡ͞Εͨͱ͖ʹൃՐ͢Δ

    View Slide

  7. これまで

    View Slide

  8. class ViewController: UIViewController {


    override var shouldAutorotate: Bool {


    // ճసϘλϯΛԡ͢௚લ͚ͩtrueʹ͢Δ


    return canRotate


    }
    iOS15以前の向き操作 - 制御

    shouldAutorotate をoverrideする


    端末を傾けたときの自動回転を制御する真偽値


    今回の題材では基本縦向きのみなのでfalseʹ͓ͯ͘͠


    回転時のみ一時的にtrueにして回転を許容する 🤔

    View Slide

  9. // ճస࣌ͷΈshouldAutorotateΛڐ༰͢Δඞཁ͕͋Δ


    canRotate = true


    UIDevice.current.setValue(


    orientation.rawValue,


    forKey: "orientation"


    )


    canRotate = false
    iOS15以前の向き操作 - 操作

    UIDevice.current.setValue で向きを変更する


    なんでもセットメソッド 🤔


    あまりにもHACK


    排他制御しなくて大丈夫?

    View Slide

  10. currentOrientation: .portrait


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: false

    View Slide

  11. 👆


    push!
    currentOrientation: .portrait


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: false

    View Slide

  12. currentOrientation: .portrait


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: false
    toggleOrientations()
    👆


    push!

    View Slide

  13. currentOrientation: .landspace


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: false
    toggleOrientations()
    ココはまだ読み込まれていない
    ので変わっていない
    状態を変更


    (プロパティを書き換えただけ)
    👆


    push!

    View Slide

  14. currentOrientation: .landspace


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: true
    toggleOrientations()
    一時的に回転を許可 ココはまだ読み込まれていない
    ので変わっていない
    👆


    push!

    View Slide

  15. currentOrientation: .landspace


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: true
    toggleOrientations()
    ココはまだ読み込まれていない
    ので変わっていない
    UIDevice.current.setValue()
    👆


    push!

    View Slide

  16. currentOrientation: .landspace


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: true
    toggleOrientations()
    読み込まれた
    UIDevice.current.setValue()
    変更後の向きが




    ートされているか確認
    👆


    push!

    View Slide

  17. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace


    shouldAutorotate: true
    toggleOrientations()
    UIDevice.current.setValue()
    変更後の向きが




    ートされているか確認
    参照
    👆


    push!

    View Slide

  18. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace


    shouldAutorotate: true
    toggleOrientations()
    UIDevice.current.setValue()
    変更後の向きが




    ートされているか確認
    OK!
    👆


    push!

    View Slide

  19. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace


    shouldAutorotate: true
    toggleOrientations()
    回転できるか確認
    UIDevice.current.setValue()
    👆


    push!

    View Slide

  20. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace


    shouldAutorotate: true
    toggleOrientations()
    回転できるか確認
    OK!
    UIDevice.current.setValue()
    👆


    push!

    View Slide

  21. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace


    shouldAutorotate: true
    toggleOrientations()
    回転しろ!


    命令だ!!😡
    UIDevice.current.setValue()
    👆


    push!

    View Slide

  22. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace


    shouldAutorotate: true
    🎉

    View Slide

  23. ※ެࣜͰαϙʔτ͞Εͨํ๏Ͱ͸͋Γ·ͤΜ
    そして......

    View Slide

  24. iOS16登場

    View Slide

  25. iOS16から


    画面の向き操作APIが


    (正式に)追加されました

    View Slide

  26. shouldAutorotate setNeedsUpdateOfSupportedInterfaceOrientations
    UIDevice.current.setValue requestGeometryUpdate
    deprecated 😵
    unavailable 🤯
    ~iOS15 iOS16
    ~

    View Slide

  27. iOS16以降の向き操作 - 制御

    setNeedsUpdateOfSupportedInterfaceOrientations を呼ぶ


    回転できる向きが変更されたことを明示的にViewControllerに知らせるメソッド


    supportedInterfaceOrientationsが再度読まれる
    // ޲͖ͷঢ়ଶΛมߋ͢Δ (·ͩViewControllerʹ͸มߋ͕఻Θ͍ͬͯͳ͍)


    currentOrientation = ...


    // ໌ࣔతʹsupportedInterfaceOrientationsΛ࠶౓ಡΈࠐΈมߋΛ఻͑Δ


    setNeedsUpdateOfSupportedInterfaceOrientations()

    View Slide

  28. // ޲͖ͷঢ়ଶΛมߋ͢Δ (·ͩViewControllerʹ͸มߋ͕఻Θ͍ͬͯͳ͍)


    currentOrientation = ...


    // ໌ࣔతʹsupportedInterfaceOrientationsΛ࠶౓ಡΈࠐΈมߋΛ఻͑Δ


    setNeedsUpdateOfSupportedInterfaceOrientations()


    // ޲͖ͷมߋΛཁٻ͢Δ


    windowScene.requestGeometryUpdate(.iOS(interfaceOrientations: ...))
    iOS16以降の向き操作 - 操作

    requestGeometryUpdate で向きを変更する


    指定した向きへの回転を要求するメソッド


    許可されていない場合は設定したerrorHandler͕ݺ͹ΕΔ (optional)

    View Slide

  29. currentOrientation: .portrait


    supportedInterfaceOrientations: .portrait


    shouldAutorotate: false
    deprecated

    View Slide

  30. currentOrientation: .portrait


    supportedInterfaceOrientations: .portrait
    👆


    push!

    View Slide

  31. currentOrientation: .portrait


    supportedInterfaceOrientations: .portrait
    toggleOrientations()
    👆


    push!

    View Slide

  32. currentOrientation: .landspace


    supportedInterfaceOrientations: .portrait
    toggleOrientations()
    ココはまだ読み込まれていない
    ので変わっていない
    状態を変更


    (プロパティを書き換えただけ)
    👆


    push!

    View Slide

  33. currentOrientation: .landspace


    supportedInterfaceOrientations: .portrait
    toggleOrientations()


    ートの変更を明示的に通知
    ココはまだ読み込まれていない
    ので変わっていない
    setNeedsUpdateOfSupportedInterfaceOrientations()
    👆


    push!

    View Slide

  34. currentOrientation: .landspace


    supportedInterfaceOrientations: .portrait
    toggleOrientations()


    ートの変更を明示的に通知
    setNeedsUpdateOfSupportedInterfaceOrientations()
    読み込まれた
    リロード
    👆


    push!

    View Slide

  35. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace
    toggleOrientations()


    ートの変更を明示的に通知
    setNeedsUpdateOfSupportedInterfaceOrientations()
    リロード
    参照
    👆


    push!

    View Slide

  36. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace
    toggleOrientations()
    setNeedsUpdateOfSupportedInterfaceOrientations()
    requestGeometryUpdate()
    👆


    push!

    View Slide

  37. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace
    toggleOrientations()
    setNeedsUpdateOfSupportedInterfaceOrientations()
    requestGeometryUpdate()
    変更してください🙇
    👆


    push!

    View Slide

  38. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace
    toggleOrientations()
    setNeedsUpdateOfSupportedInterfaceOrientations()
    requestGeometryUpdate()
    変更後の向きが




    ートされているか確認
    👆


    push!

    View Slide

  39. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace
    toggleOrientations()
    setNeedsUpdateOfSupportedInterfaceOrientations()
    requestGeometryUpdate()
    変更後の向きが




    ートされているか確認
    OK!
    👆


    push!

    View Slide

  40. currentOrientation: .landspace


    supportedInterfaceOrientations: .landspace
    🎉

    View Slide

  41. iOS16以降のAPIで


    安全に回転しよう🫨

    View Slide

  42. ご清聴ありがとうご

    いました!


    フィードバックお待ちしています

    View Slide

  43. • setNeedsUpdateOfSupportedInterfaceOrientations() | Apple Developer Documentation


    • requestGeometryUpdate(_:errorHandler:) | Apple Developer Documentation


    • Swiftのorientation操作 (zenn.dev)


    • iOS15以前の話です


    • iOS16をサ

    ートしよう! - bravesoft blog


    • ほとんどこれ
    参考記事など

    View Slide