Narzędzia dla deweloperów Blockly
to internetowe narzędzie dla deweloperów, które automatyzuje niektóre części procesu konfiguracji Blockly, w tym tworzenie bloków niestandardowych, tworzenie zestawu narzędzi i konfigurowanie obszaru roboczego Blockly.
Proces dla programistów w Blockly, który wykorzystuje to narzędzie, składa się z 3 części:
- Utwórz bloki niestandardowe za pomocą Block Factory i Block Exporter.
- Utwórz zestaw narzędzi i domyślny obszar roboczy za pomocą narzędzia Workspace Factory.
- Skonfiguruj swój obszar roboczy za pomocą Workspace Factory (obecnie funkcja dostępna tylko w przeglądarce).
Karta Block Factory
Karta Fabryka elementów składowych umożliwia tworzenie definicji elementów składowych i generowanie kodu elementów składowych. Na tej karcie możesz łatwo tworzyć, modyfikować i zapisywać bloki niestandardowe.
Definiowanie bloku
Ten film szczegółowo opisuje proces definiowania bloku. Interfejs jest nieaktualny, ale funkcje bloku, które są w nim opisane, są nadal aktualne.
Zarządzanie biblioteką
Odwołania do bloków są tworzone za pomocą ich nazwy, dlatego każdy blok, który chcesz utworzyć, musi mieć unikalną nazwę. Interfejs wymusza to i jasno określa, kiedy „zapisujesz” nowy blok, a kiedy „aktualizujesz” istniejący blok.
Możesz przełączać się między zapisanymi wcześniej blokami lub utworzyć nowy pusty blok, klikając przycisk Biblioteka. Zmiana nazwy istniejącego bloku to kolejny sposób na szybkie tworzenie wielu bloków o podobnych definicjach.
Eksportowanie i importowanie biblioteki
Bloki są zapisywane w pamięci lokalnej przeglądarki. Wyczyszczenie pamięci lokalnej przeglądarki spowoduje usunięcie blokad. Aby zapisać bloki na stałe, musisz pobrać bibliotekę. Blokada jest pobierana jako plik XML, który można zaimportować, aby przywrócić ją do stanu, w którym była w momencie pobrania pliku. Pamiętaj, że zaimportowanie biblioteki bloków spowoduje zastąpienie obecnej biblioteki, dlatego warto najpierw ją wyeksportować.
Funkcje importowania i eksportowania są też zalecanym sposobem utrzymywania i udostępniania różnych zestawów bloków niestandardowych.
Karta Block Exporter
Po zaprojektowaniu bloków musisz wyeksportować definicje bloków i zagnieżdżone generatory, aby móc ich używać w aplikacji. Robi się to na karcie Eksport bloków.
W selektorze bloków wyświetlane są wszystkie bloki zapisane w Twojej bibliotece bloków. Kliknij blok, aby go zaznaczyć lub odznaczyć przed eksportem. Jeśli chcesz zaznaczyć wszystkie bloki w bibliotece, kliknij „Wybierz” → „Wszystkie elementy zapisane w bibliotece bloków”. Jeśli utworzysz zestaw narzędzi lub skonfigurujesz workspace za pomocą karty Workspace Factory, możesz też wybrać wszystkie użyte bloki, klikając „Wybierz” → „Wszystkie użyte w Workspace Factory”.
Ustawienia eksportu umożliwiają wybranie języka generowania i określenie, czy chcesz wyeksportować definicje, szablony generatora czy oba te elementy w przypadku wybranych bloków. Po wybraniu kliknij „Eksportuj”, aby pobrać pliki.
Karta Workspace Factory
Workspace Factory ułatwia konfigurowanie zestawu narzędzi i domyślnego zestawu bloków w obszarze roboczym. Za pomocą przycisków „Zestaw narzędzi” i „Obszar roboczy” możesz przełączać się między edycją zestawu narzędzi a początkowym obszarem roboczym.
Tworzenie zestawu narzędzi
Ta karta pomaga tworzyć kod XML dla Toolboxa. Materiał zakłada, że znasz funkcje Toolboxa. Jeśli masz już plik XML narzędzia, który chcesz tu edytować, możesz go przesłać, klikając „Wczytaj do edycji”.
Zestaw narzędzi bez kategorii
Jeśli masz kilka bloków i chcesz wyświetlić je bez kategorii, po prostu przeciągnij je na obszar roboczy. Bloki pojawią się w skrzynce narzędzi w podglądzie.
Zestaw narzędzi z kategoriami
Jeśli chcesz wyświetlać bloki w kategoriach, kliknij przycisk „+” i wybierz nową kategorię w menu. Spowoduje to dodanie kategorii do listy kategorii, którą możesz wybrać i edytować. Wybierz „Standardowa kategoria”, aby dodać pojedynczą standardową kategorię Blockly (np. Logika, Powtórzenia), lub „Standardowy zestaw narzędzi”, aby dodać wszystkie standardowe kategorie Blockly. Aby zmienić kolejność kategorii, użyj przycisków strzałek.
Aby zmienić nazwę lub kolor wybranej kategorii, użyj menu „Edytuj kategorię”. Przeciągnięcie bloku na obszar roboczy spowoduje jego dodanie do wybranej kategorii.
Bloki zaawansowane
Domyślnie możesz dodać do narzędziownika dowolne standardowe bloki lub dowolne bloki z Twojej biblioteki. Jeśli masz bloki zdefiniowane w pliku JSON, których nie ma w bibliotece, możesz je zaimportować za pomocą przycisku „Importuj bloki niestandardowe”.
Niektóre bloki powinny być używane razem lub zawierać domyślne wartości. Służy do tego grupy i cienie. Wszystkie bloki połączone w edytorze zostaną dodane do panelu narzędzi jako grupa. Bloki połączone z innym blokiem można też przekształcić w bloki zduplikowane. Wystarczy, że wybierzesz blok podrzędny i klikniesz przycisk „Utwórz duplikat”. Uwaga: w bloki potomne można przekształcić tylko te bloki, które nie zawierają zmiennej.
Jeśli w swojej skrzynce narzędzi umieścisz blok zmiennej lub funkcji, dodaj do niej kategorię „Zmienna” lub „Funkcje”, aby umożliwić użytkownikom pełne wykorzystanie bloku. Dowiedz się więcej o kategoriach „Zmienna” i „Funkcja”.
Konfigurowanie obszaru roboczego
Aby skonfigurować różne części obszaru roboczego, kliknij kartę „Konfiguracja obszaru roboczego” i wybierz „Obszar roboczy”.
Wybieranie opcji Workspace
Ustaw różne wartości opcji konfiguracji i zobacz wynik w obszarze podglądu. Włączenie siatki lub powiększenia spowoduje wyświetlenie dodatkowych opcji konfiguracji. Przejście na korzystanie z kategorii wymaga zwykle bardziej złożonej przestrzeni roboczej. Po dodaniu pierwszej kategorii automatycznie dodawane są kosz i paski przewijania.
Dodawanie wstępnie załadowanych bloków do obszaru roboczego
Jest to opcjonalne, ale może być konieczne, jeśli chcesz wyświetlić zestaw bloków na obszarze roboczym:
- Gdy wczytuje się aplikacja.
- Gdy zostanie wywołane zdarzenie (np. przejście na wyższy poziom lub kliknięcie przycisku pomocy).
Przeciągnij bloki do obszaru edycji, aby zobaczyć je w obszarze roboczym w podglądzie. Możesz tworzyć grupy bloków, wyłączać bloki i uzyskiwać dostęp do bloków zduplikowanych.
Możesz eksportować te bloki jako plik XML (patrz poniżej). Dodaj je do obszaru roboczego za pomocą Blockly.Xml.domToWorkspace, zaraz po utworzeniu obszaru roboczego:
var xmlText = '<xml xmlns="https://developers.google.com/blockly/xml">' +
'<block type="math_number"></block></xml>';
Blockly.Xml.domToWorkspace(Blockly.utils.xml.textToDom(xmlText), workspace);
Ten przykładowy kod dodaje do obszaru roboczego pojedynczy blok math_number.
Eksportuję
Workspace Factory oferuje te opcje eksportowania:
- Kod startowy: generuje kod HTML i JavaScript, aby wstrzyknąć niestandardową wersję workspace w Blockly.
- Toolbox: generuje kod XML, aby określić zestaw narzędzi.
- Workspace Blocks: generuje plik XML, który można załadować do obszaru roboczego.