Flutter uygulaman iPhone Duo'ya hazır mı?

Apple’ın ilk katlanabilir iPhone’u iPhone Duo, 23 Ekim’de satışa çıktı. Bununla birlikte uygulama geliştiricileri için pek çok soru ortaya çıkıyor: geliştirme açısından ne anlama gelecek? Uygulamalarımızı bu yeni katlanabilir formata uyarlamak zorunda kalacak mıyız? Öyleyse bunun ne gibi zorlukları olacak? Uyarlamazsak ne olur? Cihaz katlıyken ve açıldığında uygulamalar nasıl görünecek? Flutter, arayüzü uyarlamak için hangi araçları sunuyor?

Bu yazıda, iOS için uygulama dağıtıyorsan seni nelerin beklediğini net biçimde anlayabilmen için tüm bu soruları hızlıca yanıtlamaya çalışacağım. Ayrıca sonunda, uygulamanın arayüzünü çok az çabayla yeni iPhone Duo’da iyi görünecek şekilde uyarlamanın çok basit bir yolunu göstereceğim.

iPhone Duo uygulamanın görüntülenme şeklini değiştiriyor

iPhone Duo’da bir uygulama çalıştırdığımızda ne olduğunu iyi anlamak için son derece basit bir örnek uygulama hazırladım. Yalnızca bir not listesi gösteriyor ve notlardan birine dokunduğumuzda içeriğini görebileceğimiz bir ekrana geçiyoruz:

Şimdi aynı uygulamayı iPhone Duo’da çalıştırdığımda ne olduğuna bakalım. Önce iOS 27.1 SDK ile derlenmiş, ancak arayüzde başka hiçbir ayarlama yapılmamış hâlini göstereceğim:

Gördüğün gibi uygulama, kullanılabilir alanın tamamını dolduracak şekilde yeniden boyutlandırılıyor. Cihaz katlıyken dış ekranın boyutları ve en-boy oranı geleneksel bir iPhone’a nispeten benzediği için bu büyük bir sorun oluşturmuyor. Ancak kullanıcı cihazı açtığında, dar bir akıllı telefon penceresi için tasarlanmış arayüz iç ekranın tüm genişliğine yayılıyor. Çalışıyor, ama en iyi deneyimi sunmuyor.

Flutter’ı iPhone Duo’ya uyarlamak

Neyse ki Flutter, arayüzü yalnızca iPhone Duo’ya değil, her pencere boyutuna uyarlamak için çok sayıda widget ve araç sunuyor. Bence doğru bakış açısı “Flutter uygulamamı iPhone Duo’ya uyarlayacağım” değil, “Flutter uygulamamı yeni boyutlara uyarlayacağım” olmalı. Buradaki fikir fiziksel cihazdan bağımsız düşünmek ve kullanılabilir alana dinamik olarak tepki veren responsive bir arayüz oluşturmak.

Örneğin çok az ayarlamayla şöyle bir uyarlama yapabiliriz:

Gördüğün gibi Duo katlıyken önceki yerleşimi koruyorum. Açıldığında ise iç ekranın ek genişliğinden yararlanarak not listesini solda, seçili notun ayrıntılarını sağda gösteriyorum.

Bu etkiyi, üst widget’ından aldığı boyut kısıtlamalarını bize sağlayan LayoutBuilder ile kolayca elde edebiliriz. Cihazın yönü değiştiğinde veya iPhone Duo katlanıp açıldığında olduğu gibi bu kısıtlamalar değiştiğinde Flutter, builder‘ını yeniden çalıştırıyor. Böylece kullanılabilir alana göre uygun arayüzü seçebiliyoruz:

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: const Text('Notes')),
    body: SafeArea(
      top: false,
      child: LayoutBuilder(
        builder: (context, constraints) {
          if (constraints.maxWidth >= _wideLayoutWidth) {
            return _WideNotesLayout(
              notes: _notes,
              selectedIndex: _selectedNoteIndex,
              onSelected: _selectNote,
            );
          }

          return _NotesList(notes: _notes, onSelected: _openNote);
        },
      ),
    ),
  );
}

Bu örnekte LayoutBuilder‘a ek olarak içeriği sistem arayüzünün, kameranın ve yuvarlatılmış köşelerin kapladığı alanlardan uzak tutmak için SafeArea kullanıyorum. Flutter, uyarlanabilir arayüzler oluşturmak için başka pek çok araç sunuyor: MediaQuery.sizeOf() uygulama penceresinin mevcut boyutunu öğrenmeyi sağlıyor; Expanded ve Flexible satırlar ve sütunlar içindeki alanı dağıtıyor; ConstrainedBox ise içeriğin fazla genişlemesini önlemek için minimum veya maksimum sınırlar belirlemeyi sağlıyor. Bunlar yalnızca birkaç örnek. Flutter, arayüzü kullanılabilir alana uyarlamak için çok daha fazla araç sunuyor.

Uygulamamı iPhone Duo’ya uyarlamak zorunda mıyım? Buna değer mi?

Uygulamanı iPhone Duo’ya uyarlamaya değip değmeyeceğine veya ne kadar gelişmiş bir uyarlama yapman gerektiğine geçmeden önce, Apple’ın duyurduğu ve bilmen gereken gereksinime bakalım:

Bu gereksinimler seni açıkça iPhone Duo’ya özel bir arayüz oluşturmaya zorlamıyor. Ancak Apple’ın cihaza özel ekran görüntüleri istemesi, uygulamalarımızın cihazda nasıl davrandığını kontrol etmemizi ve en azından en belirgin uyarlama sorunlarını düzeltmemizi beklediğini gösteriyor gibi görünüyor.

Peki bu uyarlama için ne kadar çaba harcamaya değer? Yanıt büyük ölçüde uygulamanın türüne ve kullanıcılarının beklentilerine bağlı. Benim uygulamalarım çoğunlukla akıllı telefonlarda kullanılıyor ve tabletler kullanıcılarımın çok küçük bir bölümünü oluşturuyor. iPhone Duo kullanan çok fazla kullanıcım olmayacağını varsaymak da mantıklı. Bu nedenle muhtemelen uygulamalarımın Duo’da düzgün çalışması ve cihaza özel ekran görüntüsü gereksinimini karşılaması için gereken asgari uyarlamayı yapacağım.

Yine de çabayı yalnızca kaç kullanıcının iPhone Duo sahibi olacağına göre değerlendirmezdim. Uygulaman zaten esnek bir arayüze sahipse makul bir sonuç elde etmek çok az değişiklik gerektirebilir. Aksi hâlde uygulamayı Duo’ya uyarlamak, tabletlerde, yeniden boyutlandırılabilir pencerelerde veya gelecekteki form faktörlerinde de ortaya çıkacak sorunları bulmana yardımcı olabilir. Bu açıdan çalışma, bu cihazın ötesinde de değer taşıyabilir.

Sonuç

iPhone Duo, Apple’ın yeni oyuncağı ve uygulamalarımız çok daha fazla alana sahip olduğunda nasıl davrandıklarını yeniden incelemek için bize bir neden daha veriyor. Daha önce de söylediğim gibi buna “uygulamamı iPhone Duo’ya uyarlıyorum” diye değil, “uygulamamı farklı pencere boyutlarına uyarlıyorum” diye yaklaşmanı öneriyorum. Böylece çalışma yalnızca bu cihaza değil, tabletlere ve mevcut ya da gelecekteki diğer form faktörlerine de fayda sağlar.

Bir dahaki sefere görüşmek üzere!