Araç kutusu, kullanıcıların blokları aldıkları yerdir. Genellikle çalışma alanının bir tarafında gösterilir. Bazen kategorileri vardır, bazen değildir.
Bu sayfa temel olarak araç kutunuzun yapısını nasıl belirteceğinize (ör. sahip olduğu kategorilere ve hangi blokları içerdiğine) odaklanmaktadır. Araç kutunuzun kullanıcı arayüzünü nasıl değiştireceğiniz hakkında daha fazla bilgi edinmek için Bloklu araç kutusu codelab'ini özelleştirme ve 2021 Toolbox API'leri konuşmasına göz atın.
Formatlar
Blockly, birkaç farklı biçimi kullanarak araç kutunuzun yapısını belirtmenize olanak tanır. Önerilen yeni biçim JSON, eski biçim ise XML kullanır.
Yukarıdaki araç kutusunu belirtebileceğiniz farklı yollar aşağıda verilmiştir:
JSON
Eylül 2020 sürümünden itibaren araç kutuları JSON kullanılarak tanımlanabilir.
var toolbox = {
"kind": "flyoutToolbox",
"contents": [
{
"kind": "block",
"type": "controls_if"
},
{
"kind": "block",
"type": "controls_whileUntil"
}
]
};
var workspace = Blockly.inject('blocklyDiv', {toolbox: toolbox});
XML
<xml id="toolbox" style="display: none">
<block type="controls_if"></block>
<block type="controls_whileUntil"></block>
</xml>
<script>
var workspace = Blockly.inject('blocklyDiv',
{toolbox: document.getElementById('toolbox')});
</script>
XML Dizesi
var toolbox = '<xml>' +
'<block type="controls_if"></block>' +
'<block type="controls_whileUntil"></block>' +
'</xml>';
var workspace = Blockly.inject('blocklyDiv', {toolbox: toolbox});
Kategoriler
Araç kutusundaki bloklar kategoriler halinde düzenlenebilir.
Her biri blokları içeren iki kategoriye ("Control" ve "Logic") sahip yukarıdaki araç kutusunu şu şekillerde tanımlayabilirsiniz:
JSON
{
"kind": "categoryToolbox",
"contents": [
{
"kind": "category",
"name": "Control",
"contents": [
{
"kind": "block",
"type": "controls_if"
},
]
},
{
"kind": "category",
"name": "Logic",
"contents": [
{
"kind": "block",
"type": "logic_compare"
},
{
"kind": "block",
"type": "logic_operation"
},
{
"kind": "block",
"type": "logic_boolean"
}
]
}
]
}
XML
<xml id="toolbox" style="display: none">
<category name="Control">
<block type="controls_if"></block>
<category name="Logic">
<block type="logic_compare"></block>
<block type="logic_operation"></block>
<block type="logic_boolean"></block>
</category>
</xml>
İç içe yerleştirilmiş kategoriler
Kategoriler, diğer kategorilerin içine yerleştirilebilir. Aşağıda, iki üst düzey kategori ("Temel" ve "Özel") verilmiştir. İkincisi, her biri bloklar içeren iki alt kategori içerir:
Bir kategorinin hem alt kategoriler hem de bloklar içerebileceğini unutmayın. Yukarıdaki örnekte "Özel", iki alt kategoriye ("Taşı" ve "Döndür") ve kendi bir bloğuna ("başlangıç") sahiptir.
JSON
{
"kind": "categoryToolbox",
"contents": [
{
"kind": "category",
"name": "Core",
"contents": [
{
"kind": "block",
"type": "controls_if"
},
{
"kind": "block",
"type": "logic_compare"
},
]
},
{
"kind": "category",
"name": "Custom",
"contents": [
{
"kind": "block",
"type": "start"
},
{
"kind": "category",
"name": "Move",
"contents": [
{
"kind": "block",
"type": "move_forward"
}
]
},
{
"kind": "category",
"name": "Turn",
"contents": [
{
"kind": "block",
"type": "turn_left"
}
]
}
]
}
]
}
XML
<xml id="toolbox" style="display: none">
<category name="Core">
<block type="controls_if"></block>
<block type="logic_compare"></block>
</category>
<category name="Custom">
<block type="start"></block>
<category name="Move">
<block type="move_forward"></block>
</category>
<category name="Turn">
<block type="turn_left"></block>
</category>
</category>
</xml>
Dinamik kategoriler
Dinamik kategoriler, her açıldıklarında bir işleve göre dinamik olarak yeniden doldurulan kategorilerdir.
Blockly, kayıtlı bir dize anahtarı aracılığıyla bir kategoriyi bir işlevle ilişkilendirmenize olanak tanıyarak bunu destekler. İşlev, bir kategorinin içeriğinin (bloklar, düğmeler, etiketler vb.) tanımını döndürmelidir. İçerik JSON veya XML olarak belirtilebilir ancak JSON önerilir.
Ayrıca, işleve, hedef çalışma alanı bir parametre olarak sağlanır. Böylece dinamik kategorinizdeki bloklar, çalışma alanının durumunu temel alabilir.
JSON
Eylül 2021 sürümü itibarıyla, 'blockxml'
kullanmadan engellemelerin durumunu belirtebilirsiniz.
// Returns an array of objects.
var coloursFlyoutCallback = function(workspace) {
// Returns an array of hex colours, e.g. ['#4286f4', '#ef0447']
var colourList = getPalette();
var blockList = [];
for (var i = 0; i < colourList.length; i++) {
blockList.push({
'kind': 'block',
'type': 'colour_picker',
'fields': {
'COLOUR': colourList[i]
}
});
}
return blockList;
};
// Associates the function with the string 'COLOUR_PALETTE'
myWorkspace.registerToolboxCategoryCallback(
'COLOUR_PALETTE', coloursFlyoutCallback);
Eski JSON
Eylül 2021 sürümünden önce, engellemelerin durumunu belirtmek için 'blockxml'
özelliğini kullanmanız gerekiyordu.
// Returns an array of objects.
var coloursFlyoutCallback = function(workspace) {
// Returns an array of hex colours, e.g. ['#4286f4', '#ef0447']
var colourList = getPalette();
var blockList = [];
for (var i = 0; i < colourList.length; i++) {
blockList.push({
'kind': 'block',
'type': 'colour_picker', // Type is optional if you provide blockxml
'blockxml': '<block type="colour_picker">' +
'<field name="COLOUR">' + colourList[i] + '</field>' +
'</block>'
});
}
return blockList;
};
// Associates the function with the string 'COLOUR_PALETTE'
myWorkspace.registerToolboxCategoryCallback(
'COLOUR_PALETTE', coloursFlyoutCallback);
XML
// Returns an arry of XML nodes.
var coloursFlyoutCallback = function(workspace) {
// Returns an array of hex colours, e.g. ['#4286f4', '#ef0447']
var colourList = getPalette();
var blockList = [];
for (var i = 0; i < colourList.length; i++) {
var block = document.createElement('block');
block.setAttribute('type', 'colour_picker');
var field = document.createElement('field');
field.setAttribute('name', 'COLOUR');
field.innerText = colourList[i];
block.appendChild(field);
blockList.push(block);
}
return blockList;
};
// Associates the function with the string 'COLOUR_PALETTE'
myWorkspace.registerToolboxCategoryCallback(
'COLOUR_PALETTE', coloursFlyoutCallback);
Dinamik kategori işlevleri bir dize anahtarıyla (kayıtlı olarak da bilinir) ilişkilendirildikten sonra, kategoriyi dinamik hale getirmek için bu dize anahtarını kategori tanımınızın custom
özelliğine atayabilirsiniz.
JSON
{
"kind": "category",
"name": "Colours",
"custom": "COLOUR_PALETTE"
}
XML
<category name="Colours" custom="COLOUR_PALETTE"></category>
Yerleşik dinamik kategoriler
Blockly, üç yerleşik dinamik kategori sağlar.
'VARIABLE'
, yazılmamış değişkenler için bir kategori oluşturur.'VARIABLE_DYNAMIC'
, türlü değişkenler için bir kategori oluşturur. Dizeler, sayılar ve renkler oluşturmak için düğmeler vardır.'PROCEDURE'
, fonksiyon blokları için bir kategori oluşturur.
JSON
{
"kind": "category",
"name": "Variables",
"custom": "VARIABLE"
},
{
"kind": "category",
"name": "Variables",
"custom": "VARIABLE_DYNAMIC"
},
{
"kind": "category",
"name": "Functions",
"custom": "PROCEDURE"
}
XML
<category name="Variables" custom="VARIABLE"></category>
<category name="Variables" custom="VARIABLE_DYNAMIC"></category>
<category name="Functions" custom="PROCEDURE"></category>
Not: "Prosedür" kelimesi Blockly kod tabanında kullanılıyor, ancak "function" kelimesinin öğrenciler tarafından daha anlaşılır olduğu ortaya çıktı. Bu uyumsuzluk için özür dileriz.
Devre dışı bırakılıyor
Devre dışı bırakılan bir kategori, kullanıcının kategoriyi açmasına izin vermez ve klavyeyle gezinirken atlanır.
var category = toolbox.getToolboxItems()[0];
category.setDisabled('true');
Bir kategori devre dışı bırakıldığında DOM öğesine 'disabled'
özelliği eklenir. Böylece, devre dışı bırakılan bir kategorinin görünümünü kontrol edebilirsiniz.
.blocklyToolboxCategory[disabled="true"] {
opacity: .5;
}
Gizleniyor
Gizlenmiş kategoriler araç kutusunun parçası olarak gösterilmez. Gizli kategoriler daha sonra JavaScript aracılığıyla gösterilebilir.
JSON
{
"kind": "category",
"name": "...",
"hidden": "true"
}
XML
<category name="..." hidden="true"></category>
JavaScript
var category = toolbox.getToolboxItems()[0];
category.hide();
// etc...
category.show();
Genişletildi
Bu yalnızca diğer iç içe yerleştirilmiş kategorileri içeren kategoriler için geçerlidir.
Genişletilmiş bir kategori size bu kategorinin alt kategorilerini gösterir. Varsayılan olarak, iç içe yerleştirilmiş kategoriler daraltılmıştır ve genişletilebilmeleri için tıklanmaları gerekir.
JSON
{
"kind": "category",
"name": "...",
"expanded": "true"
}
XML
<category name="..." expanded="true"></sep>
Stil
Blockly, varsayılan kategoriler için bir kullanıcı arayüzü ve stil için bazı temel seçenekler sunar. Kullanıcı arayüzü için daha gelişmiş stil veya yapılandırma işlemlerinin nasıl yapılacağı hakkında bilgi edinmek istiyorsanız Blockly toolbox codelab'ini özelleştirme ve 2021 Toolbox API'leri hakkındaki konuşmalara göz atın.
Temalar
Temalar, kategorilerimizin renkleri de dahil olmak üzere çalışma alanınızın tüm renklerini aynı anda belirtmenize olanak tanır.
Bunları kullanmak için kategorinizi belirli bir kategori stiliyle ilişkilendirmeniz gerekir:
JSON
{
"kind": "category",
"name": "Logic",
"categorystyle": "logic_category"
}
XML
<category name="Logic" categorystyle="logic_category"></category>
Renkler
Rengi doğrudan da belirtebilirsiniz, ancak bu önerilmez. Renk, tonu belirten dizeli bir sayıdır (0-360). İngilizce yazıya dikkat edin.
JSON
{
"contents": [
{
"kind": "category",
"name": "Logic",
"colour": "210"
},
{
"kind": "category",
"name": "Loops",
"colour": "120"
}
]
}
XML
<xml id="toolbox" style="display: none">
<category name="Logic" colour="210">...</category>
<category name="Loops" colour="120">...</category>
<category name="Math" colour="230">...</category>
<category name="Colour" colour="20">...</category>
<category name="Variables" colour="330" custom="VARIABLE"></category>
<category name="Functions" colour="290" custom="PROCEDURE"></category>
</xml>
Yerelleştirilebilir renk referanslarının kullanılmasını da desteklediğimizi unutmayın.
CSS kategorisi
Daha güçlü özelleştirme istiyorsanız Blockly, varsayılan kullanıcı arayüzünün farklı öğeleri için CSS sınıfları belirtmenize de olanak tanır. Ardından, bunların stilini CSS'yi kullanarak biçimlendirebilirsiniz.
Aşağıdaki öğe türlerine CSS sınıfları uygulanabilir:
- container - Kategorinin üst div öğesinin sınıfı. Varsayılan
blocklyToolboxCategory
. - row - Kategori etiketini ve simgesini içeren div için sınıf. Varsayılan
blocklyTreeRow
. - icon - Kategori simgesinin sınıfı. Varsayılan
blocklyTreeIcon
. - label - Kategori etiketinin sınıfı. Varsayılan
blocklyTreeLabel
. - selected - Seçildiğinde kategoriye eklenen sınıf. Varsayılan
blocklyTreeSelected
. - Openicon - Kategori, iç içe yerleştirilmiş kategoriler içerdiğinde ve açık olduğunda simgeye eklenen sınıf. Varsayılan
blocklyTreeIconOpen
. - officon - Kategori iç içe yerleştirilmiş kategoriler içerdiğinde ve kapatıldığında bir simgeye eklenen sınıf. Varsayılan
blocklyTreeIconClosed
.
Ayrıca, şu biçimlerden birini kullanarak sınıfları nasıl belirteceğiniz açıklanmaktadır:
JSON
cssConfig özelliğini kullanarak belirli bir öğe türünün CSS sınıfını ayarlayın.
{
"kind": "category",
"name": "...",
"cssConfig": {
"container": "yourClassName"
}
}
XML
Belirli bir öğe türünün CSS sınıfını, başına "css-" ekleyerek ayarlayın.
<category name="..." css-container="yourClassName"></category>
Erişim
Bir kategoriye programatik olarak erişmenin iki yolu vardır. Sayfaya dizinden erişebilirsiniz (burada 0 en üst kategoridir):
var category = toolbox.getToolboxItems()[0];
Veya kimliğe göre:
var category = toolbox.getToolboxItemById('categoryId');
Kimlik, araç kutusu tanımında belirtilir:
JSON
{
"kind": "category",
"name": "...",
"toolboxitemid": "categoryId"
}
XML
<category name="..." toolboxitemid="categoryId"></category>
Önceden Ayarlanmış Bloklar
Araç kutusu tanımı, alanları varsayılan değere ayarlanmış veya önceden birbirine bağlanmış olan bloklar içerebilir.
İşte dört blok:
- Önceden ayarlanmış değerleri olmayan basit bir
logic_boolean
bloğu:
- Varsayılan 0 yerine 42 sayısını gösterecek şekilde değiştirilmiş bir
math_number
bloğu:
- Kendisine bağlı üç
math_number
bloğu olan bircontrols_for
bloğu:
- Kendisine bağlı iki
math_number
gölge bloğu olan birmath_arithmetic
bloğu:
Aşağıda, bu dört bloğu içeren bir araç kutusu tanımı verilmiştir:
JSON
Eylül 2021 sürümünden itibaren, 'blockxml'
kullanarak blokların durumunu belirtebilirsiniz.
{
"kind": "flyoutToolbox",
"contents": [
{
"kind": "block",
"type": "logic_boolean"
},
{
"kind": "block",
"type": "math_number",
"fields": {
"NUM": 42
}
},
{
"kind": "block",
"type": "controls_for",
"inputs": {
"FROM": {
"block": {
"type": "math_number",
"fields": {
"NUM": 1
}
}
},
"TO": {
"block": {
"type": "math_number",
"fields": {
"NUM": 10
}
}
},
"BY": {
"block": {
"type": "math_number",
"fields": {
"NUM": 1
}
}
},
}
},
{
"kind": "block",
"type": "math_arithmetic",
"fields": {
"OP": "ADD"
},
"inputs": {
"A": {
"shadow": {
"type": "math_number",
"fields": {
"NUM": 1
}
}
},
"B": {
"shadow": {
"type": "math_number",
"fields": {
"NUM": 1
}
}
}
}
},
]
}
Eski JSON
Eylül 2021 sürümünden önce, engellemelerin durumunu belirtmek için 'blockxml'
özelliğini kullanmanız gerekiyordu.
{
"kind": "flyoutToolbox",
"contents": [
{
"kind": "block",
"type": "logic_boolean"
},
{
"kind": "block",
"blockxml":
'<block type="math_number">' +
'<field name="NUM">42</field>' +
'</block>'
},
{
"kind": "block",
"blockxml":
'<block type="controls_for">' +
'<value name="FROM">' +
'<block type="math_number">' +
'<field name="NUM">1</field>' +
'</block>' +
'</value>' +
'<value name="TO">' +
'<block type="math_number">' +
'<field name="NUM">10</field>' +
'</block>' +
'</value>' +
'<value name="BY">' +
'<block type="math_number">' +
'<field name="NUM">1</field>' +
'</block>' +
'</value>' +
'</block>'
},
{
"kind": "block",
"blockxml":
'<block type="math_arithmetic">' +
'<field name="OP">ADD</field>' +
'<value name="A">' +
'<shadow type="math_number">' +
'<field name="NUM">1</field>' +
'</shadow>' +
'</value>' +
'<value name="B">' +
'<shadow type="math_number">' +
'<field name="NUM">1</field>' +
'</shadow>' +
'</value>' +
'</block>'
},
]
}
XML
<xml id="toolbox" style="display: none">
<block type="logic_boolean"></block>
<block type="math_number">
<field name="NUM">42</field>
</block>
<block type="controls_for">
<value name="FROM">
<block type="math_number">
<field name="NUM">1</field>
</block>
</value>
<value name="TO">
<block type="math_number">
<field name="NUM">10</field>
</block>
</value>
<value name="BY">
<block type="math_number">
<field name="NUM">1</field>
</block>
</value>
</block>
<block type="math_arithmetic">
<field name="OP">ADD</field>
<value name="A">
<shadow type="math_number">
<field name="NUM">1</field>
</shadow>
</value>
<value name="B">
<shadow type="math_number">
<field name="NUM">1</field>
</shadow>
</value>
</block>
</xml>
Bu tanımları elle yazmak biraz can sıkıcı olabilir. Bunun yerine bloklarınızı bir çalışma alanına yükleyebilir ve ardından tanımları almak için aşağıdaki kodu çalıştırabilirsiniz. Araç kutusu, bloklar için serileştirme sistemiyle aynı biçimi kullandığından bu çağrılar işe yarar.
JSON
console.log(Blockly.serialization.workspaces.save(Blockly.getMainWorkspace()));
XML
console.log(Blockly.Xml.workspaceToDom(Blockly.getMainWorkspace()));
Ayrıca, araç kutusu tarafından yoksayıldıkları için x
, y
ve id
özelliklerini de kaldırabilirsiniz.
Gölge blokları
Gölge blokları, çeşitli işlevleri yerine getiren yer tutucu bloklardır:
- Üst blok için varsayılan değerleri belirtirler.
- Kullanıcıların sayı veya dize bloğu getirmelerine gerek kalmadan değerleri doğrudan yazmalarına olanak tanır.
- Normal blokların aksine kullanıcı bunların üzerine bir blok bırakırsa bloklar değiştirilir.
- Kullanıcıya beklenen değer türünü bildirir.
Devre dışı bloklar
Devre dışı bırakılan bloklar araç kutusundan sürüklenemez. Engellemeler, isteğe bağlı disabled
özelliği kullanılarak tek tek devre dışı bırakılabilir.
JSON
{
"kind": "flyoutToolbox",
"contents": [
{
"kind": "block",
"type":"math_number"
},
{
"kind": "block",
"type": "math_arithmetic"
},
{
"kind": "block",
"type": "math_single",
"disabled": "true"
}
]
}
XML
<xml id="toolbox" style="display: none">
<block type="math_number"></block>
<block type="math_arithmetic"></block>
<block type="math_single" disabled="true"></block>
</xml>
Ayrıca, setEnabled
kullanarak bir engellemeyi programatik olarak devre dışı bırakabilir veya etkinleştirebilirsiniz.
Değişken alanları
Araç kutusunda bulunan değişken alanlarının yalnızca seri hâle getirildiklerinde farklı şekilde belirtilmesi gerekebilir.
Özellikle, değişken alanları normalde JSON'a serileştirildiğinde yalnızca temsil ettikleri değişkenin kimliğini içerir. Bunun nedeni, değişkenin adı ve türü ayrı olarak serileştirilmesidir. Ancak araç kutuları bu bilgileri içermediğinden, bilgilerin doğrudan değişken alanına eklenmesi gerekir.
{
"kind": "flyoutToolbox",
"content": [
{
"type": "controls_for",
"fields": {
"VAR": {
"name": "index",
"type": "Number"
}
}
}
]
}
Ayırıcılar
Herhangi iki kategori arasına bir ayırıcı eklemek, iki kategori arasında bir çizgi ve fazladan boşluk oluşturur.
Ayırıcının sınıfını JSON veya XML araç kutusu tanımınızda değiştirebilirsiniz.
JSON
{
"kind": "sep",
"cssConfig": {
"container": "yourClassName"
}
}
XML
<sep css-container="yourClassName"></sep>
İki blok arasına bir ayırıcı eklemek, bloklar arasında bir boşluk oluşturur. Varsayılan olarak her blok, alt komşusundan 24 piksel ayrılır. Bu ayırma, varsayılan boşluğun yerini alacak olan "gap" özelliği kullanılarak değiştirilebilir.
Böylece araç kutusunda mantıksal blok grupları oluşturabilirsiniz.
JSON
{
"kind": "flyoutToolbox",
"contents": [
{
"kind": "block",
"type":"math_number"
},
{
"kind": "sep",
"gap": "32"
},
{
"kind": "block",
"blockxml": "<block type='math_arithmetic'><field name='OP'>ADD</field></block>"
},
{
"kind": "sep",
"gap": "8"
},
{
"kind": "block",
"blockxml": "<block type='math_arithmetic'><field name='OP'>MINUS</field></block>"
}
]
}
XML
<xml id="toolbox" style="display: none">
<block type="math_number"></block>
<sep gap="32"></sep>
<block type="math_arithmetic">
<field name="OP">ADD</field>
</block>
<sep gap="8"></sep>
<block type="math_arithmetic">
<field name="OP">MINUS</field>
</block>
</xml>
Düğmeler ve Etiketler
Alet kutusunda blok yerleştirebileceğiniz herhangi bir yere bir düğme veya etiket koyabilirsiniz.
JSON
{
"kind": "flyoutToolbox",
"contents": [
{
"kind": "block",
"type":"logic_operation"
},
{
"kind": "label",
"text": "A label",
"web-class": "myLabelStyle"
},
{
"kind": "label",
"text": "Another label"
},
{
"kind": "block",
"type": "logic_negate"
},
{
"kind": "button",
"text": "A button",
"callbackKey": "myFirstButtonPressed"
},
{
"kind": "block",
"type": "logic_boolean"
}
]
}
XML
<xml id="toolbox" style="display: none">
<block type="logic_operation"></block>
<label text="A label" web-class="myLabelStyle"></label>
<label text="Another label"></label>
<block type="logic_negate"></block>
<button text="A button" callbackKey="myFirstButtonPressed"></button>
<block type="logic_boolean"></block>
</xml>
<style>
.myLabelStyle>.blocklyFlyoutLabelText {
font-style: italic;
fill: green;
}
</style>
Düğmenize veya etiketinize uygulanacak bir CSS sınıf adı belirtebilirsiniz. Yukarıdaki örnekte, ilk etiket özel bir stil kullanırken ikinci etiket varsayılan stili kullanır.
Düğmelerde geri çağırma işlevleri olmalıdır, etiketler bulunmamalıdır. Belirli bir düğme tıklaması için geri çağırmayı ayarlamak üzere
yourWorkspace.registerButtonCallback(yourCallbackKey, yourFunction).
İşleviniz, tıklanan düğmeyi bağımsız değişken olarak kabul etmelidir. Değişken kategorisindeki "Değişken oluştur..." düğmesi, geri çağırma içeren düğmelere iyi bir örnektir.
Araç Kutusunu Değiştirme
Uygulama, tek bir fonksiyon çağrısıyla istediği zaman araç kutusunda bulunan blokları değiştirebilir:
workspace.updateToolbox(newTree);
İlk yapılandırma sırasında olduğu gibi, newTree
bir düğüm ağacı, dize gösterimi veya JSON nesnesi olabilir. Tek sınırlama, modun değiştirilememesidir. Yani, başlangıçta tanımlanan araç kutusunda kategoriler varsa yeni araç kutusunda da kategoriler olmalıdır (ancak kategoriler değişebilir). Benzer şekilde, başlangıçta tanımlanan araç kutusunda da kategori yoksa yeni araç kutusunda kategori olmayabilir.
Tek bir kategorinin içeriği şu şekilde güncellenebilir:
var category = workspace.getToolbox().getToolboxItems()[0];
category.updateFlyoutContents(flyoutContents);
flyoutContents; JSON, düğüm ağacı veya dize gösterimi kullanılarak tanımlanan blokların bir listesi olabilir.
Şu anda araç kutusunun güncellenmesinin kullanıcı arayüzünde bazı küçük sıfırlamalara neden olduğunu unutmayın:
- Kategorilerin yer almadığı bir araç kutusunda, kullanıcı tarafından değiştirilen tüm alanlar (ör. açılır liste) varsayılana geri döndürülür.
Kategorileri ve blok gruplarını içeren bir ağacın canlı demosunu burada bulabilirsiniz.