blockly > WorkspaceSvg

WorkspaceSvg sınıfı

Çalışma alanı için sınıf. Bu, isteğe bağlı çöp kutusu, kaydırma çubukları, baloncuklar ve sürükleme özelliklerinin bulunduğu bir ekran alanıdır.

İmza:

export declare class WorkspaceSvg extends Workspace implements IContextMenu, IFocusableNode, IFocusableTree 

Uzantı: Workspace

Uygulama: IContextMenu, IFocusableNode, IFocusableTree

Markalar

Marka Değiştiriciler Açıklama
(constructor)(options) WorkspaceSvg sınıfının yeni bir örneğini oluşturur.

Özellikler

Mülk Değiştiriciler Tür Açıklama
configureContextMenu ((menuOptions: ContextMenuOption[], e: Event) => void) | null Geliştiriciler, bu işlevi tanımlayarak çalışma alanının bağlam menüsüne özel menü seçenekleri ekleyebilir veya çalışma alanı tarafından oluşturulan menü seçenekleri grubunu düzenleyebilir.
keyboardAccessibilityMode boolean Klavye erişilebilirliği modu açıksa doğru, aksi takdirde yanlış.
keyboardMoveInProgress boolean Klavye ile başlatılan bir taşıma ("sürükleme") işlemi devam ediyorsa doğru (True) değerini döndürür.
rendered boolean SVG çalışma alanının oluşturma durumu. Başsız çalışma alanları için false, WorkspaceSvg örnekleri için ise doğru değerini döndürür.
scale sayı Mevcut ölçek.
scrollbar ScrollbarPair | null Bu çalışma alanının varsa kaydırma çubukları.
scrollX sayı

Çalışma alanı başlangıcına göre piksel birimlerindeki mevcut yatay kaydırma uzaklığı.

Bir görünüm ve bu görünümün altında hareket eden bir tuval olduğunu düşünmek faydalıdır. Tuval sağa doğru hareket ettikçe bu değer daha pozitif hale gelir ve görünüm artık tuvalin sol tarafını "görür". Tuval sola doğru hareket ettikçe bu değer daha negatif hale gelir ve görünüm artık tuvalin sağ tarafını "görür".

Bu değerle ilgili kafa karıştırıcı nokta, absoluteLeft uzaklığını içermemesi ve içermemesi gerektiğidir. Bunun nedeni, viewLeft değerini hesaplamak için kullanılmasıdır.

viewLeft, çalışma alanının başlangıç noktasına göre belirlenir (piksel birimlerinde olsa da). Çalışma alanı başlangıcı, çalışma alanının sol üst köşesidir (en azından etkinleştirildiğinde). Araç kutusunun altında kalmaması için blocklyDiv'in sol üstünden kaydırılır.

Çalışma alanı etkinleştirildiğinde viewLeft ve çalışma alanı kaynağı aynı X konumundadır. Tuval, görünümün altında sağa doğru kaydıkça bu değer (scrollX) daha pozitif hale gelir ve görünümün sol kısmı, çalışma alanı başlangıcına göre daha negatif hale gelir (çalışma alanı başlangıcını, tuval hareket ettikçe sağa kayan bir nokta olarak düşünün).

Bu nedenle, scrollX mutlak sol değeri içeriyorsa bu, çalışma alanı kaynağını bir şekilde "geri alır". Bu durumda viewLeft, çalışma alanının sol kenarını değil, blocklyDiv'in sol kenarını temsil eder.

scrollY sayı

Çalışma alanı başlangıcına göre piksel birimlerindeki mevcut dikey kaydırma uzaklığı.

Bir görünüm ve bu görünümün altında hareket eden bir tuval olduğunu düşünmek faydalıdır. Tuval aşağı doğru hareket ettikçe bu değer daha pozitif hale gelir ve görünüm artık tuvalin üst kısmını "görür". Tuval yukarı doğru hareket ettikçe bu değer daha negatif hale gelir ve görünüm, tuvalin alt kısmını "görür".

Bu değerle ilgili kafa karıştırıcı nokta, absoluteTop uzaklığını içermemesi ve içermemesi gerektiğidir. Bunun nedeni, viewTop değerini hesaplamak için kullanılmasıdır.

viewTop, çalışma alanının başlangıç noktasına göre belirlenir (piksel birimlerinde olsa da). Çalışma alanı başlangıcı, çalışma alanının sol üst köşesidir (en azından etkinleştirildiğinde). Araç kutusunun altında kalmaması için blocklyDiv'in sol üstünden kaydırılır.

Çalışma alanı etkinleştirildiğinde viewTop ve çalışma alanı kaynağı aynı Y konumundadır. Tuval aşağı doğru kaydıkça bu değer (scrollY) daha pozitif hale gelir ve viewTop, çalışma alanı başlangıcına göre daha negatif hale gelir (çalışma alanı başlangıcındaki resim, tuval hareket ettikçe aşağı doğru kayan tuval üzerinde bir nokta olarak).

Bu nedenle, scrollY mutlak üst kısmı içeriyorsa çalışma alanı kaynağı bir şekilde "unshift" olur. Bu durumda viewTop, çalışma alanının üst kenarını değil, blocklyDiv'in üst kenarını temsil eder.

startScrollX sayı Kaydırma piksel birimlerinde başladığında yatay kaydırma değeri.
startScrollY sayı Kaydırma piksel birimlerinde başladığında dikey kaydırma değeri.
svgBackground_ SVGElement
svgBlockCanvas_ SVGElement
svgBubbleCanvas_ SVGElement
svgGroup_ SVGElement
themeManager_ protected ThemeManager
trashcan Trashcan | null Çalışma alanının çöp kutusu (varsa).
zoomControls_ ZoomControls | null

Yöntemler

Yöntem Değiştiriciler Açıklama
addClass(className) Çalışma alanına bir CSS sınıfı ekler.
addTopBlock(block) En çok kullanılan bloklar listesine bir blok ekler.
addTopBoundedElement(element) Sınırlı öğeler listesine sınırlı bir öğe ekler.
addTopComment(comment) En iyi yorumlar listesine yorum ekler.
canBeFocused() IFocusableNode.canBeFocused'a bakın.
centerOnBlock(id, blockOnly) Çalışma alanını, belirtilen bloğu ortalayacak şekilde kaydırın. Blokun altında başka bloklar varsa blockOnly doğru olmadığı sürece çalışma alanı, yığın üzerinde ortalanır.
cleanUp() Tüm blokları bir sütunda çakışmayacak şekilde sıralayarak çalışma alanını temizleyin.
clear() Yeniden boyutlandırmayı önlemek için optimizasyonla birlikte çalışma alanındaki tüm blokları kaldırır.
copyOptionsForFlyout() Bu çalışma alanının seçeneklerinden, yalnızca bir açılır menüyle alakalı değerleri içeren yeni bir seçenek grubu oluşturur.
createDom(opt_backgroundClass, injectionDiv) Çalışma alanı DOM öğelerini oluşturun.
dispose() Bu çalışma alanını silin. Bellek sızıntılarını önlemek için tüm DOM öğelerinin bağlantısını kaldırın.
getAbsoluteScale()

Çalışma alanının mutlak ölçeğini döndürür.

Workspace ölçeklendirmesi çarpımsaldır. Ölçeği Y olan bir Workspace B (ör. mutasyon düzenleyici), ölçeği X olan bir kök Workspace A'nın içine yerleştirilmişse Workspace B'nin etkin ölçeği X * Y olur. Bunun nedeni, A'nın alt öğesi olarak A'nın ölçeklendirme faktörüyle zaten dönüştürülmüş olması ve ardından kendi ölçeklendirme faktörüyle daha da dönüştürülmesidir. Normalde bu işlem sorunsuz çalışır ancak belirli bir çalışma alanıyla görsel olarak ilişkilendirilmiş ancak ilişkili çalışma alanının alt öğesi olmak yerine DOM'un en üst düzeyinde bulunan genel öğeler (ör. alan düzenleyiciler) için uygun şekilde oluşturmak üzere mutlak/etkili ölçek gerekebilir.

getAllBlocks(ordered) Çalışma alanındaki tüm blokları bulur. Bloklar isteğe bağlı olarak konumlarına göre sıralanır (soldan sağa veya sağdan sola doğru hafif bir eğilimle).
getAudioManager() Bu çalışma alanının ses yöneticisini edinin.
getBlockById(id) Bu çalışma alanında belirtilen kimliğe sahip bloğu bulur.
getBlocksBoundingBox() Çalışma alanındaki blokların sınırlayıcı kutusunu hesaplayın. Koordinat sistemi: çalışma alanı koordinatları.
getBubbleCanvas() Balon yüzeyini oluşturan SVG öğesini alın.
getButtonCallback(key) Flyout'taki düğmelerin ve etiketlerin tıklanması için belirli bir anahtarla ilişkili geri çağırma işlevini alın.
getCanvas() Çizim yüzeyini oluşturan SVG öğesini alın.
getCommentById(id) Belirtilen kimliğe sahip çalışma alanı yorumunu (varsa) döndürür.
getComponentManager() Bu çalışma alanının bileşen yöneticisini alır.
getCursor() Bu çalışma alanının imleci.
getDragTarget(e) İşaretçi etkinliğinin üzerinde olduğu sürükleme hedefini döndürür.
getFlyout(opt_own) Bu çalışma alanıyla ilişkili açılır pencere için alıcı. Bu açılır pencere, araç kutusu yapılandırmasına bağlı olarak araç kutusuna veya çalışma alanına ait olabilir. Flyout yoksa değer null olur.
getFocusableElement() IFocusableNode.getFocusableElement'e bakın.
getFocusableTree() IFocusableNode.getFocusableTree'ye bakın.
getGrid() Bu çalışma alanının ızgara nesnesini veya yoksa null değerini alır.
getInverseScreenCTM() Ters çevrilmiş ekran CTM'si için alıcı.
getMarkerManager() Bu çalışma alanının işaretçi yöneticisini alır.
getMetricsManager() Bu çalışma alanının metrik yöneticisini alır.
getNavigator() Klavye ile gezinme komutlarına yanıt olarak bu çalışma alanındaki öğeler arasında odağın hareketini koordine etmekten sorumlu bir nesne döndürür.
getNestedTrees() IFocusableTree.getNestedTrees'e bakın.
getParentSvg() Bu çalışma alanını içeren SVG öğesini alın. Not: Bu işlevin yalnızca çalışma alanı DOM'ye yerleştirildikten sonra çağrıldığını varsayıyoruz.
getRenderer() Bu çalışma alanına eklenen blok oluşturucuyu alır.
getRestoredFocusableNode(previousNode) IFocusableTree.getRestoredFocusableNode'a bakın.
getRootFocusableNode() IFocusableTree.getRootFocusableNode sayfasına bakın.
getRootWorkspace()
getScale() Çalışma alanının yakınlaştırma faktörünü alır.
getSvgGroup() Çalışma alanının SVG grubunu döndürür.
getTheme() Çalışma alanı teması nesnesini alın.
getToolbox() Varsa bu çalışma alanıyla ilişkili araç kutusu için alıcı.
getToolboxCategoryCallback(key) Bu çalışma alanında özel araç kutusu kategorilerini doldurmak için belirli bir anahtarla ilişkili geri çağırma işlevini alın.
getTopBlocks(ordered) Üst düzey blokları bulur ve döndürür. Bloklar isteğe bağlı olarak konumlarına göre sıralanır (soldan sağa veya sağdan sola doğru hafif bir eğilimle).
getTopBoundedElements(ordered) Sınırlanmış üst düzey öğeleri bulur ve döndürür.
getTopComments(ordered) Bu çalışma alanındaki yorumların listesini döndürür.
getWidth() Çalışma alanının yatay uzaklığını döndürür. XML'de soldan sağa/sağdan sola uyumluluk için tasarlanmıştır.
hideChaff(onlyClosePopups) İpuçlarını, bağlam menülerini, açılır liste seçimlerini vb. kapatma
hideComponents(onlyClosePopups) Otomatik olarak gizlenebilen tüm bileşenleri (ör. açılır menü, çöp kutusu ve kullanıcı tarafından kaydedilen tüm bileşenler) gizleyin.
highlightBlock(id, opt_state) Çalışma alanında bir bloğu vurgulama veya vurguyu kaldırma Blok vurgulama, şu anda yürütülen blokları görsel olarak işaretlemek için sıklıkla kullanılır.
isDraggable() Bu çalışma alanı sürüklenebilir mi?
isDragging()

Kullanıcı şu anda sürükleme hareketi yapıyorsa veya klavyeyle başlatılan bir taşıma işlemi devam ediyorsa true değerini döndürür.

Sürükleme hareketleri genellikle çalışma alanında bir bloğu veya başka bir öğeyi taşımayı ya da açılır pencereyi/çalışma alanını kaydırmayı içerir.

Klavye ile başlatılan hareketler, sürükleme altyapısı kullanılarak uygulanır ve sürükleme hareketlerinin (bir alt kümesi) taklit edilmesi amaçlanır. Bu nedenle, genellikle harekete dayalı bir sürükleme işlemiymiş gibi ele alınmalıdır.

isMovable()

Bu çalışma alanı taşınabilir mi?

Bu, kullanıcının giriş yaparak çalışma alanının X ve Y koordinatlarını yeniden konumlandırabileceği anlamına gelir. Bu işlem, kaydırma çubukları, kaydırma tekerleği, sürükleme veya kaydırma tekerleği ya da parmakla yakınlaştırma (yakınlaştırma işlemi fare konumuna göre ortalanır) ile yapılabilir. X ve Y koordinatları programatik olarak belirlendiğinden, yakınlaştırma kontrolleriyle yapılan yakınlaştırma bu kapsamda değildir.

isMovableHorizontally() Bu çalışma alanı yatay olarak taşınabilir mi?
isMovableVertically() Bu çalışma alanı dikey olarak taşınabilir mi?
isVisible() isVisible için alıcı
lookUpFocusableNode(id) IFocusableTree.lookUpFocusableNode bölümünü inceleyin.
markFocused() Bu çalışma alanını şu anda odaklanılan ana çalışma alanı olarak işaretleyin.
moveDrag(e) Bu çalışma alanında bir nesnenin sürüklenmesini izler.
newBlock(prototypeName, opt_id) Yeni oluşturulan bir bloğu alın.
newComment(id) Yeni oluşturulan bir yorumu alma
onNodeBlur() IFocusableNode.onNodeBlur'a bakın.
onNodeFocus() IFocusableNode.onNodeFocus'a bakın.
onTreeBlur(nextTree) IFocusableTree.onTreeBlur'a bakın.
onTreeFocus(_node, _previousTree) IFocusableTree.onTreeFocus'a bakın.
recordDragTargets() Bu çalışma alanındaki tüm silme alanlarının listesini oluşturun.
refreshTheme() Tema güncellemesinden sonra çalışma alanındaki tüm blokları yenileyin.
registerButtonCallback(key, func) Açılır penceredeki düğmelerin ve etiketlerin tıklanması için belirli bir anahtarla ilişkilendirilmiş bir geri çağırma işlevi kaydedin. Örneğin, XML'siyle belirtilen bir düğme, registerButtonCallback("CREATE_VARIABLE", yourCallbackFunction) çağrısıyla eşleştirilmelidir.
registerToolboxCategoryCallback(key, func) Bu çalışma alanında özel araç kutusu kategorilerini doldurmak için belirli bir anahtarla ilişkili bir geri çağırma işlevi kaydedin. Örnek olarak değişken ve prosedür kategorilerine bakın.
removeButtonCallback(key) Flyout'taki bir düğme tıklaması için geri aramayı kaldırın.
removeClass(className) Çalışma alanından bir CSS sınıfını kaldırır.
removeToolboxCategoryCallback(key) Araç kutusunda özel bir kategorinin adının tıklanması için geri aramayı kaldırın.
removeTopBlock(block) En çok engellenenler listesinden bir engellemeyi kaldırır.
removeTopBoundedElement(element) Sınırlanmış bir öğeyi, en iyi sınırlanmış öğeler listesinden kaldırır.
removeTopComment(comment) Bir yorumu, en iyi yorumlar listesinden kaldırır.
render() Çalışma alanındaki tüm blokları oluşturur.
resize() Çalışma alanı kromunun (araç kutusu, çöp kutusu, kaydırma çubukları vb.) tümünü yeniden boyutlandırma ve yeniden konumlandırma Bu yöntem, çöp kutusu, yakınlaştırma, araç kutusu vb. öğelerin boyutlarının ve konumlarının yeniden hesaplanmasını gerektiren bir değişiklik olduğunda (ör. pencere yeniden boyutlandırıldığında) çağrılmalıdır.
scroll(x, y) Çalışma alanını, çalışma alanı sınırları içinde kalacak şekilde belirli bir uzaklığa (piksel cinsinden) kaydırır. Bu değerlerin anlamı hakkında daha fazla bilgi için workspaceSvg.scrollX ile ilgili yoruma bakın.
scrollCenter() Çalışma alanını ortalayın.
setIsReadOnly(readOnly)
setNavigator(newNavigator) Bu çalışma alanı tarafından kullanılan Navigator örneğini ayarlar.
setResizeHandlerWrapper(handler) Yeniden boyutlandırma işleyici verilerini kaydedin. Böylece, daha sonra bunları yok etme işleminde silebiliriz.
setResizesEnabled(enabled) Bu çalışma alanında yeniden boyutlandırmanın etkin olup olmadığını güncelleyin. Etkinleştirilirse çalışma alanı uygun olduğunda yeniden boyutlandırılır. Devre dışı bırakılırsa çalışma alanı yeniden etkinleştirilene kadar yeniden boyutlandırılmaz. Performans için toplu işlem sırasında yeniden boyutlandırmayı önlemek üzere kullanılır.
setScale(newScale) Çalışma alanının yakınlaştırma faktörünü ayarlayın.
setTheme(theme) Çalışma alanı teması nesnesini ayarlayın. Tema iletilmezse varsayılan olarak Classic teması kullanılır.
setVisible(isVisible) Çalışma alanının görünürlüğünü açar veya kapatır. Şu anda yalnızca ana çalışma alanı için tasarlanmıştır.
startDrag(e, xy) Bu çalışma alanında bir nesnenin sürüklenmesini izlemeye başlar.
translate(x, y) Bu çalışma alanını yeni koordinatlara çevirin.
updateInverseScreenCTM() Ters ekran CTM'sini kirli olarak işaretleyin.
updateToolbox(toolboxDef) Mevcut araç kutusundaki blok ağacını değiştirin.
zoom(x, y, amount) Çalışma alanını, verilen (x, y) koordinatına göre veya bu koordinat merkezde olacak şekilde yakınlaştırır ya da uzaklaştırır.
zoomCenter(type) Görünümün ortasında ortalanmış blokları yakınlaştırıp uzaklaştırarak yakınlaştırma.
zoomToFit() Mümkünse blokları çalışma alanına sığacak şekilde yakınlaştırın.