Blockly Developer Tools to internetowe narzędzie dla programistów, które ułatwia tworzenie blokad niestandardowych i umieszczanie ich w aplikacji.
Zdefiniuj blok
Obszar roboczy Block Factory zacznie od pustego bloku konfiguracji. Możesz dodawać do bloku wejściowe i pola, przeciągając bloki z odpowiednich kategorii w Przyborniku. Możesz też ustawić tekst etykietki, URL pomocy, kolor i kontrole połączenia dla tego bloku, modyfikując blok konfiguracji.
Fabryka bloków może tworzyć tylko jeden typ bloków naraz. Jeśli chcesz zaprojektować kilka połączonych ze sobą bloków, musisz je osobno zaprojektować i połączyć w definicji zestawu narzędzi. Poza tym bloki mogą mieć zaawansowane funkcje, takie jak mutatory, ale tych zaawansowanych funkcji nie można tworzyć w fabryce. Po utworzeniu podstawowej postaci bryły musisz zmienić definicję bloku zgodnie z dokumentacją.
Gdy zmodyfikujesz blok konfiguracji w obszarze roboczym, podgląd bloku będzie aktualizowany automatycznie. Kod, który należy dodać do aplikacji, zostanie zaktualizowany automatycznie.
Konfiguracja rozdzielczości nagrania
Blockly obsługuje różne metody definiowania bloków i wczytywania samego Blockly, a także posiada wiele wbudowanych języków generatorów kodu. Sposób definiowania bloków i generatorów kodu blokowego zależy od tych czynników, więc można je ustawić w fabryce bloków, aby zmienić dane wyjściowe kodu.
Format importu Blockly
Blockly można ładować za pomocą tagów <script> w kodzie HTML lub za pomocą instrukcji import, jeśli w swojej aplikacji używasz narzędzia do kompilacji. Ten wybór wpływa na sposób odwoływania się do określonych części interfejsu Blockly API. Więcej informacji o tym, który typ wybrać, znajdziesz w dokumentacji dotyczącej ładowania Blockly.
Bez względu na to, jakiej metody użyjesz, wybierz odpowiednią opcję w fabryce blokowej, aby kod, który dodasz do aplikacji, działał poprawnie.
Format definicji bloku
Blockly obsługuje bloki zdefiniowane w JSON i JavaScript. Preferowany jest format JSON, ale jeśli chcesz dodać funkcje zaawansowane, takie jak mutatory, możesz użyć formatu JavaScript.
Język generatora kodu
Blockly jest dostarczany z wieloma językami generatorów kodów. Wybierz języki, których potrzebuje Twoja aplikacja, aby wyświetlić odpowiedni atrament generatora kodu blokowego. Jeśli używasz generatora niestandardowego języka, po skopiowaniu kodu do aplikacji możesz zmienić nazwę niestandardowej klasy CodeGenerator.
Wynik działania kodu
W następnych sekcjach Fabryki Bloków znajdziesz kod, który musisz skopiować do aplikacji, aby wczytać utworzony blok. Miejsce kopiowania kodu zależy od struktury aplikacji, ale zazwyczaj musisz uruchomić nagłówki kodu przed definicją i generator kodu blokowego, definicje bloków przed użyciem ich w zestawie narzędzi oraz generatory kodu blokowego przed wygenerowaniem kodu dla obszaru roboczego. Możesz użyć przycisku kopiowania, aby skopiować cały blok kodu z każdej sekcji.
Jeśli nadal nie masz pewności, jak korzystać z wyników kodu, może zainteresuje Cię przykładowa aplikacja, która zawiera przykłady niestandardowych bloków i generatorów kodu blokowego.
Nagłówki kodu
Sekcja Nagłówki kodu zawiera kod potrzebny do wczytania podstawowej biblioteki Blockly i wybranego generatora języka. W tym miejscu może być też inna konfiguracja, np. pola z blokady pochodzą z wtyczek Blockly. Wtyczki te będą miały własne instrukcje importowania i ewentualnie inny kod, który musisz uruchomić, aby zainicjować to pole. Kod ten należy umieścić przed dowolnymi z poniższych sekcji kodu.
Definicja blokowania
Definicja bloku określa, w jaki sposób określasz kształt bloku, na przykład jakie ma on pola i dane wejściowe, kolor i inne. Gdy uruchomisz ten kod, Blockly będzie wiedzieć, jak utworzyć blok na podstawie type.
Jeśli używasz przykładowej aplikacji, możesz umieścić ten kod w pliku w katalogu blocks/. Jeśli masz własną strukturę aplikacji, pamiętaj o uwzględnieniu tego kodu, zanim spróbujesz odwoływać się do bloku według nazwy, np. w definicji zestawu narzędzi. W obu przypadkach upewnij się, że plik, w którym umieszczasz ten kod, zawiera nagłówki.
Krótkoterminowy generator prądu
Generator kodu blokowego służy do opisania kodu, który należy wygenerować dla bloku. Krótkoterminowy kod generatora utworzony przez fabrykę bloków udostępnia podstawowy kod do pobierania wartości wejściowych i pól znajdujących się w bloku. Od Ciebie zależy, czy połączysz te wartości w ostateczny kod, który zostanie wygenerowany.
Jeśli używasz przykładowej aplikacji, możesz umieścić ten kod w pliku w katalogu generators/. Jeśli masz własną strukturę aplikacji, pamiętaj o umieszczeniu tego kodu przed wygenerowaniem kodu dla obszaru roboczego zawierającego niestandardowe bloki. W obu przypadkach upewnij się, że plik, w którym umieszczasz ten kod,
zawiera nagłówki.
Przewodnik wideo
Ten film szczegółowo omawia etapy definiowania bryły. Interfejs jest nieaktualny, ale wyróżnione przez niego funkcje blokowe są nadal mniej lub bardziej dokładne.
Zablokuj bibliotekę
Blokady są automatycznie zapisywane w lokalnej pamięci przeglądarki za każdym razem, gdy wprowadzasz zmiany w blokadzie. Możesz utworzyć nowy blok lub wczytać istniejący blok z pamięci lokalnej, klikając odpowiednie przyciski na górnym pasku narzędzi.
Importuj ze starszej wersji Block Factory
Jeśli korzystasz ze starszej wersji fabryki bloków i chcesz przenieść istniejące definicje blokad do nowego narzędzia, wykonaj te czynności:
W starszej wersji Block Factory kliknij przycisk
Export Block Libraryna pasku narzędzi. Spowoduje to pobranie pliku ze wszystkimi definicjami blokad.
W nowej fabryce bloków kliknij przycisk
Load blockna pasku narzędzi.W menu wybierz opcję „Importuj z fabryki bloku blokowego”.
Prześlij plik pobrany w kroku 1.
Definicje blokad powinny zostać automatycznie przekonwertowane na nowy format i od teraz będą dostępne w menu
Load block. W razie wystąpienia konfliktów z istniejącymi blokami mogły zostać zmienione nazwy.Jeśli podczas analizowania bloków wystąpiły błędy, nie uda się nam ich wczytać. Możesz nam pomóc, zgłaszając błąd w przypadku blokowych próbek i dołączając plik, którego nie można przeanalizować.