Interfejs File System Access API umożliwia odczyt, zapis i zarządzanie plikami. Dowiedz się, jak Construct 3 korzysta z tego interfejsu API.
Wprowadzenie
(Ten artykuł jest też dostępny w formie filmu).
Construct 3 to edytor gier stworzony przez braci Thomasa i Ashley Gullenów. W obecnej trzeciej wersji edytora gier twórcy „[stawiają] na przeglądarkę jako nowy system operacyjny”, ponieważ wcześniej tworzyli aplikacje na Windowsa i NW.js. Możesz zapoznać się z niektórymi grami stworzonymi za pomocą edytora, przeglądając prezentację lub korzystając z oprowadzania. Dzięki supermocom internetu możesz też kliknąć dowolny z przykładów z sekcji „Zainspiruj się” i od razu rozpocząć edycję.
Interfejs File System Access API w Construct 3
Construct umożliwia zapisywanie plików lokalnych za pomocą interfejsu File System Access API, a także zapisywanie w chmurze (Dysk Google, OneDrive, Dropbox) i pobieranie kopii pliku projektu. Z danych zebranych przez deweloperów Construct wynika, że 65% zapisów jest wykonywanych za pomocą interfejsu File System Access API, co pokazuje, że jest to preferowana metoda zapisywania przez większość klientów.
W celu zapisywania danych fragment kodu poniżej zawiera oryginalny kod produkcyjny służący do uzyskiwania wartości FileSystemFileHandle z metody showSaveFilePicker(), która służy do zapisywania rzeczywistych danych. Konstrukcja korzysta z parametru opcji id. Pole id może zawierać sugestię katalogu, w którym ma się otworzyć selektor plików. Dzięki temu przeglądarka może zapamiętać różne katalogi dla różnych identyfikatorów, co pozwala otwierać okno dialogowe w tym samym katalogu w zależności od identyfikatora.id Przykładowo pliki poziomów mogą otwierać się w programie Documents/levels/, a pliki tekstur w programie Images/textures/. Parametr types to tablica obsługiwanych typów plików z lokalizowanymi elementami wizualnymi dla użytkownika description oraz obiektem accept, który informuje system operacyjny, aby początkowo akceptował tylko pliki .c3p o typie MIME application/x-construct3-project.
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;
}
Zespół Construct stwierdził, że praca z plikami w systemie plików użytkownika jest bardzo intuicyjna. Działa ona podobnie jak tradycyjne aplikacje komputerowe i łatwo integruje się z innym oprogramowaniem. Może to być na przykład oprogramowanie do tworzenia kopii zapasowych, które umożliwia tworzenie kopii zapasowych plików użytkowników, łatwe wysyłanie pracy do innych miejsc lub edytowanie plików za pomocą zewnętrznych narzędzi. Interfejs File System Access API jest też używany do różnych innych zastosowań, takich jak wybór folderu kopii zapasowej czy importowanie zasobów, np. animacji.
Praca z dużymi plikami i folderami
Niektórzy klienci Construct pracują nad bardzo dużymi projektami o wielkości setek megabajtów. Zapisywanie tak dużej ilości pracy w jednym pliku jest okropnie powolne, nie mówiąc już o przesłaniu go do usługi w chmurze. Interfejs API dostępu do systemu plików umożliwia zaawansowanym użytkownikom pracę z folderem lokalnym, w którym znajdują się wszystkie zasoby w osobnych plikach. Umożliwia to bardzo szybkie zapisywanie, ponieważ trzeba zaktualizować tylko zmienione pliki.
Kontynuuj od miejsca, w którym przerwiesz
Zarówno uchwyty plików, jak i katalogów mogą być serializowane do IndexedDB, co pozwala Construct udostępniać listę ostatnich projektów, która jest przechowywana w całości sesji, dzięki czemu użytkownicy mogą ponownie uzyskać dostęp do tego samego pliku lub folderu. Jest to bardzo wygodne. W istocie około 30% wszystkich projektów otwieranych w Construct jest otwieranych w ten sposób. Na tym zrzucie ekranu widać 2 ostatnie projekty (tetris.c3p i columns.c3p), a w oknie Narzędzia dla programistów – odpowiadające im obiekty FileSystemFileHandle zaserializowane w tabeli IndexedDB.
Integracja polegająca na przeciąganiu i upuszczaniu
Interfejs File System Access API jest też zintegrowany z interfejsem Drag and Drop API, dzięki czemu użytkownik może przeciągać i upuszczać pliki .c3p do aplikacji. Konstrukcja może następnie za pomocą metody getAsFileSystemHandle() obiektu DataTransferItem uzyskać FileSystemFileHandle, co oznacza, że pliki otwarte w ten sposób można edytować i zapisywać od razu, bez konieczności otwierania osobnego okna dialogowego zapisu pliku.
Wycofany kompilowany kod NW.js
Wcześniej zespół korzystał z wersji NW.js przeglądarki Construct, która wymagała osobnego utrzymywania i aktualizowania, aby mieć dostęp do plików lokalnych. Po dodaniu w Chromium obsługi interfejsu File System Access API w wersji 84 deweloperzy Construct wprowadzili ten interfejs w 2020 roku. Jako produkt uboczny udało się wycofać kompilację NW.js i korzystać z przeglądarki wyłącznie na wszystkich platformach. Upraszcza to proces tworzenia i eliminuje konieczność dołączania silnika przeglądarki do aplikacji.
Podsumowanie
Construct intensywnie korzysta z 3 metod selektora: showOpenFilePicker(), showSaveFilePicker() i showOpenDirectoryPicker(), co jest korzystne dla użytkowników, którzy przyzwyczaili się do tego sposobu pracy z Construct. Dodatkowo Construct używa też interfejsu File Handling API, który pozwala mu zarejestrować się jako (domyślny) moduł obsługi plików .c3p. Oznacza to, że użytkownik może kliknąć dwukrotnie lub kliknąć prawym przyciskiem myszy i otworzyć plik gry Construct 3 bezpośrednio z eksploratora plików systemu operacyjnego. Konstrukcja jest w pełni oparta na internecie i korzysta z wielu innych nowoczesnych interfejsów API przeglądarki, takich jak WebGL, Web Audio, Web Workers, WebAssembly, WebRTC do gier wieloosobowych, Local Font Access, WebCodecs do nowego produktu do tworzenia animacji i wielu innych. Ich celem zawsze było pełne wykorzystanie możliwości platformy internetowej i pokazywanie, jak można tworzyć na niej świetne produkty. Dlatego wypróbuj ich oprowadzoną wycieczkę i twórz własne gry.