Blockly Geliştirici Araçları, özel bloklar oluşturmanıza ve bunları uygulamanıza eklemenize yardımcı olabilecek web tabanlı bir geliştirici aracıdır.
Blok tanımlayın
Block Factory çalışma alanı boş bir yapılandırma bloğuyla başlar. Araç kutusunda blokları ilgili kategorilerden sürükleyerek bloka girişler ve alanlar ekleyebilirsiniz. Ayrıca, yapılandırma bloğunu değiştirerek blok için ipucu metni, yardım URL'si, renk ve bağlantı kontrollerini de ayarlayabilirsiniz.
Block Factory bir tek seferde yalnızca bir blok türü oluşturabilir. Birbirine bağlı birkaç blok tasarlamak isterseniz blokları ayrı ayrı tasarlamanız ve araç kutusu tanımında bağlamanız gerekir. Buna ek olarak, bloklar mutatörler gibi gelişmiş özelliklere sahip olabilir ancak bu gelişmiş özellikler Fabrika'da oluşturulamaz. Blokun temel biçimini oluşturduktan sonra blok tanımını belgelere göre değiştirmeniz gerekir.
Çalışma alanında yapılandırma bloğunu değiştirdiğinizde, engellemenin önizlemesi otomatik olarak güncellenir. Uygulamanıza eklemeniz gereken kod da otomatik olarak güncellenir.
Çıkış yapılandırması
Blockly, farklı blokları tanımlamak ve Blockly'nin kendisini yüklemek için farklı yöntemlerin yanı sıra birden fazla yerleşik kod oluşturucu dili kullanımını destekler. Bloklarınızı ve blok kodu oluşturucularınızı tanımlama şekliniz bu faktörlere bağlıdır. Dolayısıyla, bunları Blok Fabrikası'nda ayarlayarak kod çıkışını değiştirebilirsiniz.
Engellenen olarak içe aktarma biçimi
Blockly'yi HTML'deki <script> etiketleri aracılığıyla veya uygulamanızla birlikte bir derleme aracı kullanıyorsanız import ifadeleri kullanarak yükleyebilirsiniz. Bu seçim, Blockly API'nin belirli bölümlerine nasıl referans verdiğinizi etkiler. Hangisini seçeceğinizle ilgili daha fazla bilgi için Blockly'yi yükleme ile ilgili belgelere bakın.
Hangi yöntemi kullanırsanız kullanın, uygulamanıza ekleyeceğiniz kodun uygulamanız için doğru olması amacıyla Engelle Fabrikası'nda ilgili seçeneği belirlediğinizden emin olun.
Blok tanım biçimi
Blockly, JSON veya JavaScript'te blok tanımlamayı destekler. JSON biçimi tercih edilir ancak mutatörler gibi gelişmiş özellikler ekleyecekseniz JavaScript biçimini kullanabilirsiniz.
Kod oluşturma dili
Blockly, birden fazla kod oluşturucu dili ile gönderilir. İlgili blok kodu oluşturucu saplamayı göstermek için uygulamanızın ihtiyaç duyduğu dilleri seçin. Özel dil oluşturma aracı kullanıyorsanız kodu uygulamanıza kopyaladıktan sonra özel CodeGenerator sınıfınızın adını değiştirebilirsiniz.
Kod çıkışı
Block Factory'nin sonraki bölümleri, oluşturduğunuz bloğu yüklemek için uygulamanıza kopyalamanız gereken kodu gösterir. Kodu kopyalayacağınız yer, uygulamanızı nasıl yapılandırdığınıza bağlıdır. Ancak genellikle bir çalışma alanı için kod oluşturmaya çalışmadan önce kod başlıklarını tanım ve blok kodu oluşturucudan, blok kodu oluşturma aracından ve blok kodu oluşturucudan önce çalıştırmanız gerekir. Her bir bölümde, ilgili bölümdeki kod bloğunun tamamını kopyalamak için kopyala düğmesini kullanabilirsiniz.
Kod çıkışının nasıl kullanılacağından hâlâ emin değilseniz özel blok ve blok kodu oluşturucu örneklerinin bulunduğu örnek uygulama ilginizi çekebilir.
Kod başlıkları
Kod Başlıkları bölümünde, temel Blockly kitaplığını ve seçtiğiniz dil oluşturucuyu yüklemek için ihtiyacınız olan kod gösterilir. Burada başka yapılandırmalar da olabilir. Örneğin, bir engellemeye dahil edebileceğiniz bazı alanlar Blockly eklentilerindendir. Bu eklentilerin kendi içe aktarma ifadeleri ve alanı başlatmak için çalıştırmanız gereken başka kodları da vardır. Bu kod, aşağıdaki kod bölümlerinin herhangi birinden önce eklenmelidir.
Tanımı engelle
Blok tanımı, Blockly'ye blokunuzun şeklini (hangi alanların ve girişlerin bulunduğu, rengi vb.) nasıl bildireceğinizi ifade eder. Bu kodu çalıştırdıktan sonra, Blockly yalnızca type değerine göre nasıl blok oluşturacağını bilecektir.
Örnek uygulamayı kullanıyorsanız bu kodu blocks/ dizinindeki bir dosyaya ekleyebilirsiniz. Kendi uygulama yapınız varsa araç kutusu tanımında olduğu gibi adla bloklara başvurmadan önce bu kodu eklemeyi unutmayın. Her iki durumda da, kod başlıklarının bu kodu eklediğiniz dosyada
bulunduğundan emin olun.
Jeneratör sapı
Blok kodu oluşturucu, bir blok için oluşturulması gereken kodu açıklama şeklinizdir. Blok Fabrikası tarafından oluşturulan jeneratör sapı, blokunuzdaki giriş ve alanların değerlerini almak için temel kodu sağlar. Bu değerleri, oluşturulacak son kodda birleştirmek size kalmıştır.
Örnek uygulamayı kullanıyorsanız bu kodu generators/ dizinindeki bir dosyaya ekleyebilirsiniz. Kendi uygulama yapınız varsa özel yapı taşlarınızı içeren bir çalışma alanı için kod oluşturmayı denemeden önce bu kodu eklemeyi unutmayın. Her iki durumda da, kod başlıklarının
bu kodu eklediğiniz dosyada bulunduğundan emin olun.
Adım adım açıklamalı video kılavuzu
Bu videoda, blok tanımlama adımları ayrıntılı olarak açıklanmaktadır. Kullanıcı arayüzü güncel değil, ancak vurguladığı engelleme özellikleri hâlâ daha fazla veya daha az doğru.
Kitaplığı engelle
Engellemede her değişiklik yaptığınızda, engellemeler tarayıcının yerel depolama alanına otomatik olarak kaydedilir. Üst araç çubuğunda yer alan ilgili düğmeleri tıklayarak yeni bir blok oluşturabilir veya yerel depolama alanınızdan mevcut bir blok yükleyebilirsiniz.
Eski Block Factory'den içe aktar
Eski Block Factory'yi kullandıysanız ve mevcut blok tanımlarınızı yeni araca taşımak istiyorsanız bunu aşağıdaki adımları uygulayarak yapabilirsiniz:
Eski Block Factory'de, araç çubuğundaki
Export Block Librarydüğmesini tıklayın. Bu işlem, tüm engelleme tanımlarınızı içeren bir dosya indirir.
Yeni Block Factory'de, araç çubuğundaki
Load blockdüğmesini tıklayın.Menüdeki "Block Factory'den İçe Aktar" seçeneğini belirleyin.
1. adımda indirdiğiniz dosyayı yükleyin.
Engelleme tanımlarınız otomatik olarak yeni biçime dönüştürülür. Bu bilgilere artık
Load blockmenüsünden erişebilirsiniz. Mevcut engellemelerle çakışma varsa engellemeler yeniden adlandırılmış olabilir.Bloklarınızdan herhangi biri ayrıştırılırsa bu hatalar yüklenemez. Engellenen örneklerle ilgili hata bildiriminde bulunarak ve ayrıştırılamayan dosyayı ekleyerek bize yardımcı olabilirsiniz.