Uaktualnianie pola niestandardowego

W lipcu 2019 r. (wersja 2.20190722) dodaliśmy bardziej skodowany interfejs API pól. Ma ona za zadanie jak najbardziej zgodne wstecznie. Oznacza to, że jeśli masz utworzoną przed lipcem 2019 r., prawdopodobnie będzie nadal działać. Zanim zdecydujesz, czy pole trzeba uaktualnić, zapoznaj się z w sekcji Obszary zagrożenia, i dokładnie przetestuj swoje pole.

Ze względu na brak standaryzacji pól przed lipcem 2019 roku trudno uwzględnić wszystkie zmiany, które deweloper musi wprowadzić. W tym dokumencie stara się uwzględnić wszystkie prawdopodobne zmiany, ale jeśli nie na temat, który Cię interesuje, przeczytaj sekcję jak uzyskać pomoc w przejściu na wyższą wersję.

Uwaga: jeśli masz małą liczbę pól niestandardowych, łatwiejszym rozwiązaniem może być je zmodyfikować, postępując zgodnie z instrukcjami tworzenia pól niestandardowych. zamiast wprowadzać je stopniowo.

Obszary niebezpieczne

Obszary zagrożeń to znane miejsca, w których zmienił się interfejs API, a Twoje pole może nie działa.

Blockly.Field.register

Pola nie są już rejestrowane przez Blockly.Field.register();. Jest jest teraz przestrzenią nazw FieldRegistry, która obsługuje rejestrację.

Blockly.Field.register('my_field_name', myFieldClass);

Staje się:

Blockly.fieldRegistry.register('my_field_name', myFieldClass);

setText

Funkcja setText nie jest już wywoływana przez rdzeń Blockly, więc jeśli setText zawiera logikę, należy ją przenieść do obsługa wartości pakietu funkcji, w metodzie getText i funkcje renderowania (w zależności od tego, jak działa funkcja setText).

CustomFields.UpgradeField.prototype.setText = function(newText) {
  // Do validation.
  if (typeof newText != 'string' || newText === this.text_) {
    return;
  }

  // Fire event.
  if (this.sourceBlock_ && Blockly.Events.isEnabled()) {
    Blockly.events.fire(new Blockly.Events.BlockChange(
        this.sourceBlock_, 'field', this.name, this.text_, newText
    ));
  }

  // Update text value.
  this.text_ = 'prefix' + newText;

  // Rerender.
  this.size_.width = 0;
};

Staje się:

CustomFields.UpgradeField.prototype.doClassValidation_ = function(newValue) {
  if (typeof newValue != 'string') {
    return null;
  }
  return newValue;
};

CustomFields.UpgradeField.prototype.getText = function() {
  return  'prefix' + this.value_;
}

Blockly automatycznie obsługuje:

• Sprawdzanie, czy nowa wartość różni się od starej.
• Aktualizuję wartość.
• Uruchamianie zdarzeń zmiany.
• Ponownie renderuję pole.

W związku z tym:

• Weryfikacja wartości (doClassValidation_).
• Tekst pola (getText).
• Interfejs pola

.

Uwaga: zalecamy zmianę połączeń setText na Wywołania setValue – setValue obsługuje weryfikację, a setText nie.

Zalecane aktualizacje

Zalecane uaktualnienia to miejsca, w których zmieniono interfejs Field API, ale jeśli nie wprowadzać zmian w polu, najprawdopodobniej nadal będzie działać.

DOSTĘPNE DO SERIALIZACJI

Więcej informacji o właściwościach EDITABLE i SERIALIZABLE znajdziesz na stronie Właściwości do edycji i serializowalności.

CustomFields.UpgradeField.prototype.SERIALIZABLE = true;

Poniższe ostrzeżenie jest niezrozumiałe, ale można je rozwiązać, definiując SERIALIZABLE usługa:

Detected an editable field that was not serializable. Please define
SERIALIZABLE property as true on all editable custom fields. Proceeding
with serialization.

Powyższe ostrzeżenie oznacza, że według Blockly pole do zserializacji (ponieważ właściwość EDITABLE ma wartość true), ale nie można mieć pewności, dopóki nie zdefiniujesz właściwości SERIALIZABLE. Jeśli wybierzesz Pozostaw to bez zmian, a wszystko będzie działać poprawnie, a pole zostanie jest zserializowany, ale będziesz otrzymywać ostrzeżenia dotyczące konsoli.

size_.width

this.size_.width = 0;

Staje się:

this.isDirty_ = true;

Poniższe ostrzeżenie jest niezrozumiałe, ale możesz je rozwiązać, ustawiając isDirty_ właściwością zamiast właściwości size_.width:

Deprecated use of setting size_.width to 0 to rerender a field. Set
field.isDirty_ to true instead.

Powyższe ostrzeżenie oznacza, że Blockly wykrył, że używasz starej metody i chcesz użyć nowej metody.

Więcej informacji na temat właściwości isDirty_ znajdziesz na stronie isDirty_.

init

Funkcja init została przekształcona w szablon funkcji do zmniejszać ilość zduplikowanego kodu w podklasach.

CustomFields.UpgradeField.prototype.init = function() {
  if (this.fieldGroup_) {
    // Already initialized once.
    return;
  }

  // Call superclass.
  CustomFields.UpgradeField.superClass_.init.call(this);

  // Create DOM elements.
  this.extraDom_ = Blockly.utils.dom.createSvgElement('image',
      {
        'height': '10px',
        'width': '10px'
      });
  this.extraDom_.setAttributeNS('http://www.w3.org/1999/xlink',
      'xlink:href', 'image.svg');
  this.extraDom_.style.cursor = 'pointer';
  this.fieldGroup_.appendChild(this.extraDom_);

  // Bind events.
  this.mouseOverWrapper_ =
    Blockly.browserEvents.bind(
        this.getClickTarget_(), 'mouseover', this, this.onMouseOver_);
  this.mouseOutWrapper_ =
    Blockly.browserEvents.bind(
        this.getClickTarget_(), 'mouseout', this, this.onMouseOut_);

  // Render.
  this.setValue(this.getValue());
};

Staje się:

CustomFields.UpgradeField.prototype.initView = function() {
  CustomFields.UpgradeField.superClass_.initView.call(this);

  this.extraDom_ = Blockly.utils.dom.createSvgElement('image',
      {
        'height': '10px',
        'width': '10px'
      });
  this.extraDom_.setAttributeNS('http://www.w3.org/1999/xlink',
      'xlink:href', 'image.svg');
  this.extraDom_.style.cursor = 'pointer';
  this.fieldGroup_.appendChild(this.extraDom_);
};

CustomFields.UpgradeField.prototype.bindEvents_ = function() {
  CustomFields.UpgradeField.superClass_.bindEvents_.call(this);

  this.mouseOverWrapper_ =
    Blockly.bindEvent_(
        this.getClickTarget_(), 'mouseover', this, this.onMouseOver_);
  this.mouseOutWrapper_ =
    Blockly.bindEvent_(
        this.getClickTarget_(), 'mouseout', this, this.onMouseOut_);
};

Oznacza to, że blockly automatycznie obsługuje:

• Sprawdzam, czy pole zostało już zainicjowane.
• Tworzę fieldGroup_.
• Renderuję pole.
• Etykietka powiązania i pokaż zdarzenia w edytorze.

W związku z tym:

• Dodawanie kolejnych Elementy DOM (initView).
• Dodawanie kolejnych powiązania zdarzeń (bindEvents_).
• Pomijanie powiązań zdarzeń (dispose).

.

Ważne: wszystkie elementy DOM należy tworzyć wewnątrz initView, ponieważ najczęściej jest to efektywne. Rozważ refaktoryzację, jeśli tworzenie DOM odbywa się konstruktora, setText, setValue lub render_.

onMouseDown_

CustomFields.UpgradeField.prototype.onMouseDown_ = function(e) {
  // ...
};

Staje się:

CustomFields.UpgradeField.prototype.showEditor_ = function() {
  // ...
}

Zalecamy zastąpienie funkcji showEditor_ tak, aby obsługiwała mysz kliknięcia, a nie funkcję onMouseDown_, ponieważ umożliwia ona przekazywanie danych wejściowych za pomocą systemu gestów.

Więcej informacji o edytorach znajdziesz w sekcji Edytujący.

setValue

Funkcja setValue jest teraz szablonem funkcji do zmniejszać ilość zduplikowanego kodu w podklasach. Jeśli funkcja setValue zawiera funkcje logiczne, rozważ jego refaktoryzację, aby dopasować ją do ścieżek obsługi wartości opisanych Obsługa wartości.

text_

Zalecamy, aby nigdy nie uzyskiwać dostępu do właściwości text_ ani aktualizować jej na bezpośrednio. Zamiast tego użyj funkcja getText czytelny dla użytkownika tekst w polu oraz funkcja setValue, w celu aktualizacji wartości przedpłaconej pola.

Więcej informacji o wartości pola w porównaniu z jego tekstem znajdziesz w sekcji Składnia pola.

Jak uzyskać pomoc dotyczącą przejścia na wyższą wersję

Uwaga: zanim poprosisz o pomoc w przekształcaniu konta, postaraj się korzystając z podanych informacji.

Co podać

Gdy prosisz o pomoc, najlepiej zadać konkretne pytania:

Niezalecane: „Co jest nie tak z tym polem?”.

Niezalecane: „Pomóż mi uaktualnić to pole”.

Zalecane: „Tekst pola nie aktualizuje się prawidłowo”.

Niezbędne jest również udostępnienie materiałów osobom, które udzielają Ci pomocy. Te pliki powinny być łatwe w użyciu dla innych osób.

Niezalecane:

• Obrazy kodu.
• Niekompletny kod.

Zalecane:

• Wypełnij kod pola w formacie tekstowym.
• Obrazy GIF przedstawiające niewłaściwe działanie pól.
• Kroki umożliwiające odtworzenie nieprawidłowego działania pola.
• Wersja Blockly, z której uaktualniasz aplikację.

Gdzie publikować

Publikuj pytania na temat uaktualnienia na deweloperze blokującym .

Jeśli masz pewność, że problem jest związany z blokowym rdzeniem, możesz też opublikuj problem w obraźliwej witrynie GitHub. Jeśli zdecydujesz się opublikować problem, wypełnij wszystkie wymagane informacje.