Yerleşik yorum simgesini geçersiz kılabilirsiniz. Örneğin, yorumun pop-up balonunun farklı görünmesini isteyebilirsiniz.
Yorum simgesini geçersiz kılmak için CommentIcon
simgesini genişletin, ICommentIcon
bölümünde seçili yöntemleri geçersiz kılın ve yeni simgenizi kaydedin.
Extend CommentIcon
CommentIcon
tarihini uzatarak başlayın.
class MyCommentIcon extends Blockly.icons.CommentIcon {
constructor(sourceBlock) {
super(sourceBlock);
}
}
ICommentIcon ve Icon'daki geçersiz kılma yöntemleri
Simgenizi özelleştirmek için ICommentIcon
(aşağıdaki bölümlerde açıklanmıştır) ve Blockly.icons.Icon
(Özel simgeler oluşturma bölümünde açıklanmıştır) yöntemlerini geçersiz kılabilirsiniz.
Blockly.icons.IconType.COMMENT
döndürmesi gereken getType
'yı geçersiz kılmayın.
Metin
ICommentIcon
arayüzü, yorumun metin içermesini gerektirir.
getText
yöntemi, yorumun metnini döndürmelidir. setText
yöntemi, yorumun metnini ayarlamalı ve görselleri güncellemelidir.
getText() {
return this.text;
}
setText(text) {
this.text = text;
this.myRenderMethod();
}
Baloncuk
Özel yorum simgeniz, serileştirmeyi desteklemek için IHasBubble
arayüzünü uygulamalıdır. Simgenizde teknik olarak balon olmasa bile, kaydedilen durumun korunması için görünürlük bilgilerini sınıfınızda saklamanız gerekir. Aksi takdirde, yorumun açık olup olmadığını içeren bir kaydı yüklerseniz kullanıcıdan gelen bilgileri kaybedersiniz.
bubbleIsVisible() {
return this.bubbleVisible;
}
setBubbleVisible(visible: boolean) {
this.bubbleVisible = visible;
}
Sohbet balonları hakkında daha fazla bilgi için Pop-up sohbet balonlarını kullanma başlıklı makaleyi inceleyin.
ICommentIcon
arayüzü, boyut döndüren bir getBubbleSize
yöntemi ve bunu ayarlayan bir setBubbleSize
gerektirir. Simgenizde teknik olarak bildirim balonu olmasa bile durumu kaydetme konusundaki önceki gerekçe burada da geçerlidir.
getBubbleSize() {
return this.bubbleSize;
}
setBubbleSize(size) {
this.bubbleSize = size;
this.myRenderMethod();
}
ICommentIcon
ayrıca çalışma alanındaki balonun konumunu alan ve ayarlayan getBubbleLocation
ve setBubbleLocation
yöntemlerini de gerektirir.
setBubbleLocation(location) {
this.bubbleLocation = location;
}
getBubbleLocation() {
return this.bubbleLocation;
}
Kaydet ve yükle
Özel yorum simgeniz ISerializable
arayüzünü uygulamalıdır. Durum, CommentState
arayüzüne uygun olmalıdır.
saveState() {
return {
text: this.text,
pinned: this.bubbleVisible,
height: this.bubbleSize.height,
width: this.bubbleSize.width,
x: this.bubbleLocation.x,
y: this.bubbleLocation.y,
}
}
loadState(state) {
this.setText(state.text);
this.setBubbleVisible(state.pinned);
this.setBubbleSize(new Blockly.utils.Size(state.width, state.height));
this.setBubbleLocation(new Blockly.utils.Coordinate(state.x, state.y));
}
Simge serileştirme hakkında daha fazla bilgi için Simge kaydetme ve yükleme başlıklı makaleyi inceleyin.
Simgenizi kaydettirme
Son olarak, mevcut yorum simgesinin kaydını silin ve Blockly'nin örneğini oluşturabilmesi için yorum simgenizi kaydedin. Kaydı silmek için 'comment'
, kaydetmek için IconTypes.COMMENT
dizesini kullanın.
Blockly.icons.registry.unregister('comment');
Blockly.icons.registry.register(Blockly.icons.IconType.COMMENT, myCommentIcon);
Simgenizi kaydettikten sonra Blockly, yerleşik yorum simgesi yerine bu simgeyi kullanır. Örneğin, kullanıcı bağlam menüsünde "Yorum Ekle"yi tıkladığında veya myBlock.setCommentText()
işlevini çağırdığınızda bu simge kullanılır.