Oyun düzenleyici Construct 3, kullanıcıların oyunlarını kaydetmesine olanak tanımak için File System Access API'yi nasıl kullanıyor?

File System Access API okuma, yazma ve dosya yönetimi özelliklerini kapsar. Construct 3'ün bu API'den nasıl yararlandığını öğrenin.

Ashley Gullen
Ashley Gullen

Giriş

(Bu makale video biçiminde de mevcuttur.)

Construct 3, Thomas ve Ashley Gullen kardeşler tarafından geliştirilen bir oyun editörü. Daha önce Windows ve NW.js için geliştirdikten sonra oyun editörlerinin şu anki üçüncü iterasyonunda ise tamamen "tarayıcıda [bet] yeni işletim sistemi olarak kullanılmaktadır". Editörün vitrin üzerinden veya rehberli tura katılarak editörle geliştirilmiş bazı oyunlar hakkında fikir edinebilirsiniz. Web'in süper güçleri sayesinde, "İlham alın" örneklerinden herhangi birini tıklayıp hemen düzenlemeye başlayabilirsiniz.

Kullanıcının başlangıç projelerinden birini düzenlediğini gösteren Construct 3 uygulaması.

Yapı 3'teki File System Access API

Construct, File System Access API ile yerel dosyalara kaydetme, buluta kaydetme (Google Drive, OneDrive, Dropbox) ve proje dosyasının bir kopyasını indirme seçeneği sunar. Construct geliştiricilerinin topladığı istatistikler, kaydedilenlerin% 65'inin File System Access API ile yapıldığını gösteriyor. Böylece, çoğu müşteri bunu kullanmak istiyor.

Kaydetmek amacıyla aşağıdaki snippet, showSaveFilePicker() yönteminden bir FileSystemFileHandle almak için orijinal üretim kodunu gösterir. Bu kod daha sonra gerçek verilerin kaydedilmesi için sunulur. Oluşturma, id seçenek parametresinden yararlanır. Dosya seçicinin açılacağı dizini önermek için id alanı belirtilebilir. Bir id belirterek tarayıcı, farklı kimlikler için farklı dizinleri hatırlayabilir. Bu, iletişimin kimliğe bağlı olarak aynı dizinde tutarlı bir şekilde başlatılmasını sağlar. Örneğin, düzey dosyaları Documents/levels/ içinde, doku dosyaları Images/textures/ içinde açılabilir. types parametresi, desteklenen bir dosya türleri dizisidir. Bu dizide yerelleştirilmiş kullanıcı tarafından görselleştirilmiş description öğesi ve işletim sistemine başlangıçta yalnızca application/x-construct3-project MIME türüne sahip .c3p dosyalarını kabul etmesini bildiren bir accept nesnesi bulunur.

let fileHandle = null;
try {
  fileHandle = await window["showSaveFilePicker"]({
    id: "save-project-file",
    types: [
      {
        description: lang("ui.project-file-picker.c3-single-file-project"),
        accept: {
          "application/x-construct3-project": [".c3p"],
        },
      },
    ],
  });
} catch (err) {
  // Assume user cancelled, or permission otherwise denied.
  return;
}

Construct ekibi, kullanıcının dosya sistemindeki dosyalar üzerinde çalışmanın çok kolay olduğunu gördü. Geleneksel masaüstü uygulamalarına benzer şekilde çalışır ve diğer yazılımlarla kolayca entegre olur. Örneğin, kullanıcıların dosyalarının yedeklerini oluşturabilen veya çalışmaları başka yerlere kolayca göndermek ya da dosyaları harici araçlar kullanarak düzenlemek için kullanılan yedekleme yazılımları. Ayrıca, bir yedek klasör seçme veya animasyonlar gibi öğeleri içe aktarma gibi diğer çeşitli kullanım durumları için de File System Access API'yi kullanırlar.

Büyük dosyalar ve klasörlerle çalışma

Construct'ın müşterilerinden bazıları yüzlerce megabayt boyutundaki çok büyük projelerle çalışıyor. Tek bir dosyaya bu kadar büyük miktarda iş tasarrufu yapmak, dosyayı bulut hizmetine yüklemek şöyle dursun, son derece yavaştır. File System Access API, deneyimli kullanıcıların tüm öğelerinin ayrı dosyalarda olduğu yerel bir klasörle çalışmasına olanak tanır. Yalnızca değiştirilen dosyaların güncellenmesi gerektiğinden bu işlem çok hızlı kaydetme olanağı sağlar.

Kaldığınız yerden devam edin

Hem dosya hem de dizin tanıtıcıları IndexedDB'ye dönüştürülebilir. Böylece, Construct'ın oturumlar arasında kalıcı olan yakın tarihli bir proje listesi sunmasına olanak tanır. Böylece, kullanıcılar aynı dosyaya veya klasöre tekrar erişebilir. Bu da kullanıcıya büyük kolaylık sağlar. Öyle ki, Construct'ta açılan projelerin yaklaşık% 30'u bu şekilde açılıyor. Aşağıdaki ekran görüntüsünde son iki proje (tetris.c3p ve columns.c3p) ve DevTools penceresindeki bir IndexedDB tablosunda serileştirilmiş karşılık gelen FileSystemFileHandle nesneleri gösterilmektedir.

tetris.c3p vecolumn.c3p olmak üzere son iki projeyi içeren Construct 3 başlangıç sayfası. Geliştirici Araçları'nda, IndexedDB'ye serilenmiş ilgili iki FileSystemFileHandle nesnesini gösterir.

Sürükleyip bırakma entegrasyonu

File System Access API, Sürükle ve Bırak API'sı ile de entegre olarak kullanıcının .c3p dosyalarını uygulamaya sürükleyip bırakmasını sağlar. Oluşturma işlemi daha sonra DataTransferItem nesnesindeki getAsFileSystemHandle() yöntemini kullanarak bir FileSystemFileHandle alabilir. Böylece, bu şekilde açılan dosyalar, ayrı bir dosya kaydetme iletişim kutusuna gerek kalmadan hemen düzenlenebilir ve kaydedilebilir.

Kullanımdan kaldırılan NW.js derlemesi

Daha önce ekibin, yerel dosyalara erişmek için ayrı olarak bakımını ve güncellenmesini gerektiren bir NW.js Construct yapısı vardı. Chromium, sürüm 84'te File System Access API için destek ekledikten sonra, Construct geliştiricileri 2020'de API'yi uyguladı ve yan ürün olarak NW.js derlemesini kullanımdan kaldırarak tarayıcıyı tüm platformlarda kullanmaya başladılar. Bu, geliştirme sürecini basitleştirir ve tarayıcı motorunu uygulamayla paket haline getirme ihtiyacını ortadan kaldırır.

Sonuçlar

Construct, sırasıyla showOpenFilePicker(), showSaveFilePicker() ve showOpenDirectoryPicker() adlı üç seçici yöntemini yoğun bir şekilde kullanarak, Construct ile bu şekilde çalışma yöntemlerini kullanmayı öğrenen kullanıcılarının yararına çalışır. Ek bir avantaj olarak Construct, Construct 3'ün kendisini .c3p dosyalarının (varsayılan) dosya işleyicisi olarak kaydetmesine olanak tanıyan File handling API'sini de kullanır. Bu, kullanıcının oyun dosyalarını doğrudan işletim sisteminin dosya gezgininden çift tıklayarak veya sağ tıklayıp Construct 3 ile açabileceği anlamına gelir. Tamamen web üzerinde çalışan Construct, birçok modern tarayıcı API'sini (ör. WebGL, Web Audio, Web Çalışanları, WebAssembly, çok oyunculu oyunlar için WebRTC, Yerel Yazı Tipi Erişimi, yeni animasyon ürünleri için WebCodecs ve daha fazlası) kullanır. Hedefleri her zaman web platformundan en iyi şekilde yararlanmak ve bunun üzerine nasıl harika ürünlerin geliştirilebileceğini göstermek oldu. Bu nedenle, rehberli tura katılmayı ve kendi oyunlarınızı oluşturmayı unutmayın.