Kopyala ve yapıştır

Blockly, bloklar, çalışma alanı yorumları ve balonlar gibi yerleşik bileşenlerinin birçoğunda kopyalama, kesme ve yapıştırma işlemlerini destekler.

Varsayılan pano davranışı

Blockly çekirdeğinde, blokları, çalışma alanı yorumlarını ve ICopyable, IDraggable ve IDeletable arayüzlerini uygulayan diğer tüm bileşenleri kesmek, kopyalamak veya yapıştırmak için kullanabileceğiniz klavye kısayolları bulunur. Ayrıca, bir bloğu çoğaltmak için bağlam menüsü seçeneği de bulunur. Bu varsayılan kısayolları ve menü öğelerini gerektiği gibi değiştirebilir veya kaldırabilirsiniz.

Varsayılan pano uygulamasında, kopyalanabilir nesneler yalnızca kopyalandıkları çalışma alanına veya bir açılır listeden kopyalandılarsa hedef çalışma alanına yapıştırılabilir. Bu nedenle, bir blok öğesini bir açılır listeden bu açılır listenin hedef çalışma alanına kopyalayabilirsiniz ancak bir blok öğesini bir ana çalışma alanından diğerine kopyalayamazsınız.

Çalışma alanları ve sekmeler arasında kopyalama ve yapıştırma

Kullanıcıların blokları bir çalışma alanından kopyalayıp başka bir çalışma alanına, hatta başka bir sekmede çalışan uygulamanızın bir kopyasındaki çalışma alanına yapıştırmasına izin vermek istiyorsanız @blockly/plugin-cross-tab-copy-paste eklentisini yükleyebilirsiniz.

Özel pano davranışı

Farklı bir davranış istiyorsanız Blockly ile birlikte gelen klavye kısayollarını kaldırıp farklı şekilde çalışan diğer kısayolları yükleyerek özel bir pano uygulayabilirsiniz. Bunu kolaylaştırmak için kopyalama, yapıştırma veya daha ayrıntılı kontrol (ör. bir nesnenin kopyalandığı çalışma alanını ayarlama) amacıyla Blockly.clipboard ad alanındaki yöntemleri kullanabilirsiniz.

Özel kopyalanabilir nesneler

Beş arayüz kullanarak rastgele öğeler kopyalama/yapıştırma sistemiyle uyumlu hale getirilebilir: Kopyalanabilen nesneleri temsil etmek için ICopyable, IDraggable ve IDeletable, kopyalanan nesneleri temsil etmek için ICopyData, kopyalama verilerini tekrar kopyalanabilir nesnelere dönüştürebilen nesneleri temsil etmek için IPaster. Her ICopyable türü için bu verileri yapıştırabilecek ilişkili bir IPaster gerekir.

ICopyable,IDraggable ve IDeletable'yi uygulayan ve karşılık gelen IPaster ve ICopyData'ye sahip olan tüm nesneler, varsayılan pano sistemiyle otomatik olarak çalışır.

Kopyalanabilir nesneler oluşturulduğu ve Blockly'ye yeni oluşturulmuş nesneler ekleyemediğiniz için özel bir kopyalanabilir veya özel bir yapıştırıcı (ör. çoklu seçim eklentisi) uygulamak isteyeceğiniz çok az durum vardır. Çalışma alanında yalnızca bloklar, balonlar ve çalışma alanı yorumları oluşturulabilir.

Kopyalanabilir öğe uygulama

Kopyalanabilir bir nesne oluşturmak için ICopyable, IDraggable ve IDeletable arayüzlerini uygulamanız gerekir. Yapıştırılan bir nesnenin işlenebilmesi ve silinebilmesi için son iki arayüz gereklidir.

Seçilebilir

ICopyable arayüzü, ISelectable arayüzünü genişletir. Bu nedenle, bu yöntemleri ve özellikleri de uygulamanız gerekir.

Klavye kısayolları, neyin kopyalanacağını belirlemek için seçili nesneye baktığından seçilebilir olması gerekir.

class MyCopyable implements ISelectable {
  constructor(workspace) {
    this.id = Blockly.utils.idGenerator.genUid();
    this.workspace = workspace;
  }

  select() {
    // Visually indicate this draggable is selected.
  }

  unselect() {
    // Visually indicate this draggable is not selected.
  }
}

Kopyalanabilir

ICopyable arayüzünün kendisinde yalnızca bir zorunlu yöntem vardır: toCopyData. Bu yöntem, kopyalanabilir nesnenin durumunun JSON olarak seri hale getirilebilen bir gösterimini döndürür. Bu gösterim, kopyalanabilir nesneyi yeniden oluşturmak için kullanılabilir.

Kopyalama verileri, bu kopyalama verilerini yapıştırması gereken yapıştırıcıyla ilişkili kayıtlı dize adını tutan bir paster özelliği de içermelidir. Paster'lar hakkında daha fazla bilgi için Paster uygulama başlıklı makaleyi inceleyin.

class MyCopyable implements ICopyable {
  constructor(workspace, state) {
    this.workspace = workspace;
    this.myState = state;
  }

  toCopyData() {
    return {
      // This string matches the string used to register the paster.
      paster: 'MY_PASTER',
      state: this.myState,
    };
  }
}

ICopyable, bir nesnenin şu anda kopyalanabilir olup olmadığını döndüren isteğe bağlı bir yönteme (isCopyable) de sahiptir.

Sürüklenebilir ve silinebilir

IDraggable ve IDeletable öğelerini uygulama hakkında bilgi için Özel sürüklenebilir öğeler başlıklı makaleyi inceleyin.

Paster'ı uygulama

Paster oluşturmak için IPaster arayüzünü uygulamanız gerekir. Yalnızca bir yöntemi paste vardır. Bu yöntem, yapıştırdığı öğenin kopyalama verilerini, öğenin yapıştırılacağı çalışma alanını ve isteğe bağlı bir koordinatı (öğenin yapıştırılacağı konum) alır.

class MyPaster implements IPaster {
  paste(copyData, workspace, coordinate) {
    return new MyCopyable(workspace, copyData.state);
    // Optionally position the copyable at the passed coordinate.
    // Optionally select the copyable after it is pasted.
  }
}

Kayıt

Bir yapıştırıcı uyguladıktan sonra, belirli bir kopyalama verileriyle ilişkili yapıştırıcıyı paster mülkünden bulabilmek için yapıştırıcıyı kaydetmeniz gerekir.

// This string matches the string assigned to the 'paster' property.
Blockly.clipboard.registry.register('MY_PASTER', new MyPaster());