Interfejs File System Access API umożliwia odczyt i zapis oraz zarządzanie plikami. Dowiedz się, jak Construct 3 wykorzystuje ten interfejs API.
Wstęp
(Ten artykuł jest również dostępny w formie filmu).
Construct 3 to edytor gier stworzony przez braci Thomas i Ashley Gullen. W obecnej trzeciej odsłonie edytora gier 2 w pełni „[bet] w przeglądarce to nowy system operacyjny” po skompilowaniu kodu dla systemu Windows i NW.js. Aby dowiedzieć się, jak działają niektóre gry stworzone we współpracy z edytorem, możesz przejrzeć ich prezentację lub skorzystać z prezentacji funkcji. Dzięki potęgom internetu możesz po prostu kliknąć dowolny z przykładów inspiracji i natychmiast rozpocząć edycję.
Interfejs File System Access API w Construct 3
Construct umożliwia zapisywanie plików w plikach lokalnych za pomocą interfejsu File System Access API, a także funkcję zapisywania w chmurze (Dysk Google, OneDrive, Dropbox) i pobranie kopii pliku projektu. Ze statystyk zebranych przez programistów Construct wynika, że 65% zapisów jest zapisywanych za pomocą interfejsu File System Access API, co pokazuje, że większość klientów tego używa.
Na potrzeby zapisania ten fragment przedstawia oryginalny kod produkcyjny uzyskanie parametru FileSystemFileHandle
z metody showSaveFilePicker()
, który służy później do zapisywania rzeczywistych danych. Konstrukcja korzysta z parametru opcji id
. Pole id
można określić w sposób sugerujący katalog, w którym otworzy się selektor plików. Dzięki określeniu id
przeglądarka może zapamiętać różne katalogi dla różnych identyfikatorów, co powoduje spójne rozpoczęcie okna w tym samym katalogu w zależności od identyfikatora. Na przykład pliki poziomów mogą otwierać się w programie Documents/levels/
, a pliki tekstur – w Images/textures/
. Parametr types
to tablica obsługiwanych typów plików ze zlokalizowanym tagiem user-Visual description
oraz obiektem accept
, który informuje system operacyjny, aby początkowo akceptował tylko pliki .c3p
z typem 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;
}
Zdaniem zespołu Construct praca z plikami w systemie plików użytkownika jest bardzo intuicyjna. Działa podobnie do tradycyjnych aplikacji komputerowych i wygodnie integruje się z innym oprogramowaniem. Może to być na przykład oprogramowanie do tworzenia kopii zapasowych plików użytkowników, łatwego wysyłania danych do innych miejsc lub edytowania plików przy użyciu narzędzi zewnętrznych. Korzystają one też z interfejsu File System Access API do różnych innych zastosowań, takich jak wybór folderu kopii zapasowej lub importowanie zasobów, takich jak animacje.
Praca z dużymi plikami i folderami
Niektórzy z klientów firmy Construct zajmują się bardzo dużymi projektami, których rozmiar mierzą setki megabajtów. Zapisywanie tak dużej ilości pracy w jednym pliku jest niewygodnie powolne, zwłaszcza że przesyłanie go do usługi w chmurze. Interfejs File System Access API pozwala doświadczonym użytkownikom korzystać z lokalnego folderu, w którym wszystkie zasoby znajdują się w oddzielnych plikach. Umożliwia to bardzo szybkie zapisywanie, ponieważ tylko zmienione pliki muszą zostać zaktualizowane.
Kontynuuj od miejsca, w którym przerwiesz
Zarówno uchwyty pliku, jak i katalogu mogą być zserializowane w IndexedDB, co pozwala aplikacji Construct udostępniać listę ostatnich projektów, która jest trwała w wielu sesjach, dzięki czemu użytkownicy mogą ponownie korzystać z tego samego pliku lub folderu, co jest bardzo wygodne dla użytkownika. Około 30% projektów otwieranych w Construct jest otwieranych w ten sposób. Poniższy zrzut ekranu przedstawia 2 ostatnie projekty, tetris.c3p
i columns.c3p
, a w oknie Narzędzi deweloperskich odpowiednie obiekty FileSystemFileHandle
zserializowane w tabeli IndexedDB.
Integracja metodą „przeciągnij i upuść”
Interfejs File System Access API jest też integrowany z interfejsem API przeciągania i upuszczania, dzięki czemu użytkownik może przeciągać i upuszczać pliki .c3p
do aplikacji. Konstrukcja może następnie za pomocą metody getAsFileSystemHandle()
w obiekcie DataTransferItem
uzyskać FileSystemFileHandle
, co oznacza, że otwarte w ten sposób pliki można od razu edytować i zapisać bez konieczności używania osobnego okna dialogowego zapisywania plików.
Wycofana kompilacja NW.js
Wcześniej zespół miał kompilację NW.js obiektu Construct, która wymagała osobnego zarządzania i aktualizacji, aby uzyskać 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 mogli wycofać kompilację NW.js i korzystać z przeglądarki wyłącznie na wszystkich platformach. Upraszcza to programowanie i unikniesz konieczności łączenia silnika przeglądarki z aplikacją.
Podsumowanie
Construct intensywnie korzysta z 3 metod selektora showOpenFilePicker()
, showSaveFilePicker()
i showOpenDirectoryPicker()
, aby zapewnić korzyści użytkownikom, którzy nauczyli się korzystać z tego sposobu pracy z Construct. Dodatkową zaletą Construct jest korzystanie z File handling API, który pozwala Construct 3 zarejestrować się jako (domyślny) moduł obsługi plików .c3p
. Oznacza to, że użytkownik może kliknąć dwukrotnie plik gry lub kliknąć go prawym przyciskiem myszy i otworzyć w Construct 3 bezpośrednio z poziomu eksploratora plików systemu operacyjnego. Construct wykorzystuje wiele nowoczesnych interfejsów API przeglądarek, takich jak WebGL, Web Audio, Web Workers, WebAssembly, WebRTC do gier wieloosobowych, Local Font Access, WebCodecs w swoim nowym produkcie do animacji i jeszcze więcej. Celem firmy zawsze było pełne wykorzystanie platformy internetowej i pokazanie, jak można na niej stworzyć świetne produkty. Dlatego zachęcamy do wypróbowania funkcji przewodnika i tworzenia własnych gier.