ProCat Solutions
Ma érkezik az iPhone Duo, és a Flutter-appok egy része csíkkal körbevéve indul el rajta
A hajtogatható iPhone a régi appokat kis ablakban futtatja. Mit kell átállítani egy Flutter-appban, mit ad és mit nem ad a keretrendszer, és mire kell figyelni.
Aki ma kinyitja az új iPhone Duót, és elindít egy tavaly frissített appot, egy kisebb ablakot lát fekete sávokkal a 7,6 hüvelykes belső kijelző közepén. Az Apple ezt szándékosan csinálja: a hajtogatható telefonon csak az iOS 27.1 SDK-val fordított appok töltik ki a teljes belső kijelzőt. Minden más úgy fut, mintha egy kisebb iPhone-on lenne.
Az Apple szeptember 9-én mutatta be az iPhone Duót, az előrendelés október 16-án indult, a szállítási idők a MacRumors szerint perceken belül 2027 elejére csúsztak. A készülék zárva 5,4, nyitva 7,6 hüvelykes, az ára 1999 dollártól indul. 2027 áprilisától minden App Store-ba beküldött appnak iPhone Duo-képernyőképekkel is rendelkeznie kell.

Mit kapnak ingyen a natív appok
Az Apple szerint a szabványos SwiftUI- és UIKit-elemekből épült appok maguktól alkalmazkodnak: a vezérlők a kéz ügyébe, oldalra kerülnek, a belső kijelzőn több oszlopra bomlanak, félig hajtott állásban pedig a gombok elhúzódnak a hajtásvonaltól. Az iOS 27.1 SDK-ban új API-k jöttek a tartalom két félre osztásához és a lefoglalt területek kezeléséhez, egy zsanér-API pedig megmondja, milyen szögben áll a kijelző. Az Xcode 27.1 új Device Hubjában a szimulált Duót ki lehet nyitni, össze lehet csukni és félbe lehet hajtani.
A Flutter hátránya
A Flutter nem a rendszer vezérlőit használja, hanem maga rajzolja ki a felületet, ezért ebből az automatikus alkalmazkodásból semmit nem kap. A keretrendszer a hajtásról szóló adatot egy erre kitalált helyen adná át, a MediaQuery.displayFeatures mezőben, a dart:ui dokumentációja szerint azonban ez a mező csak Androidon töltődik fel. iOS-en üres marad.
A hiány pótlására már a Flutter GitHub-oldalán is van javaslat (#192515), és megjelentek közösségi csomagok is, például a duo_display és a duo_flex. Ezek a natív UIKit-adatokból olvassák ki a zsanér helyét, a hajtás állását (csukott, félig nyitott, teljesen nyitott) és a kamera kivágását, és oda teszik, ahol a Flutter-kód már keresi őket. A csomagok újak, ezért éles appban érdemes ezt a réteget saját kódként kezelni, amit érteni és javítani tudunk, ha a következő iOS-frissítés megváltoztat valamit.

Mellette és ellene
Ami a Flutter mellett szól:
- Egy kódbázisból készül az Android-foldable, a hagyományos iPhone és az iPhone Duo változat. Az Android-hajtogathatókhoz a
displayFeaturesmár ma is működik. - A
LayoutBuilderés a reszponzív elrendezések ugyanúgy működnek a belső kijelzőn, a kétoszlopos nézet logikája egyszer készül el. - A felület pixelre azonos minden platformon, ami márkaérzékeny appoknál számít.
Ami ellene szól:
- A natív appok automatikus alkalmazkodását kézzel kell megírni: vezérlők áthelyezése, hajtásvonal kerülése, oszlopokra bontás.
- A zsanér és a hajtás adataihoz ma közösségi csomag vagy saját natív híd kell.
- Az új iOS-funkciók rendszerint késve jelennek meg a Flutterben; aki elsőként akar egy Duo-specifikus funkciót, natívan gyorsabb.
Mire kell figyelni
- Újrafordítás az iOS 27.1 SDK-val. Enélkül az app a belső kijelzőn kis ablakban fut. Ez a legolcsóbb és legfontosabb lépés.
- Ne csak a szélességből döntsünk. Az iPhone Duón a szélesség önmagában nem mondja meg a méretosztályt; a natív méretosztályt is érdemes átvenni.
- A hajtásvonal. Gomb, szövegmező vagy fontos szöveg ne kerüljön a gyűrődés fölé félig hajtott állásban.
- Folytonosság. Kinyitáskor és összecsukáskor az app ne indítson újra képernyőt, és ne vesszen el a beírt adat vagy a görgetési pozíció.
- Tesztelés minden állásban. Csukva, nyitva, félbe hajtva, elforgatva, a Device Hubban és ha lehet, valódi készüléken.
- Képernyőképek áprilisra. Az App Store-beküldéshez Duo-képernyőképek kellenek, ezt érdemes a következő kiadásba betervezni.

Ahol segíteni tudunk
Flutterben és natívan is fejlesztünk mobilappokat. Egy meglévő Flutter-app Duo-átállása nálunk három lépésből áll: újrafordítás az iOS 27.1 SDK-val és a letterbox megszüntetése, egy kis natív híd a zsanér- és hajtásadatokhoz, végül a kétoszlopos elrendezés és a hajtásvonal kezelése a fontos képernyőkön. Ha az app mögött SaaS-backend is fut, azt is visszük: mobil- és SaaS-fejlesztés.
Források
- Apple Announces Foldable iPhone Duo (MacRumors)
- iPhone Duo release date (Forbes)
- Developers bring new app experiences to iPhone Duo (Apple Newsroom)
- How iPhone Duo treats apps not optimized for the foldable display (9to5Mac)
- Flutter issue #192515: displayFeatures on iOS for iPhone Duo
- duo_display (GitHub), duo_flex (GitHub)
- Ship your iOS app for iPhone Duo before April 2027 (HackerNoon)