Yorumu geçersiz kıl simgesi

Yerleşik yorum simgesini geçersiz kılabilirsiniz. Örneğin, yorumun pop-up balonunun farklı görünmesini isteyebilirsiniz.

Yorum simgesinin vurgulandığı bir blok

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.