Mit dem Feldformer können Sie festlegen, wie ein Datensatz gerendert werden soll. Diese Funktion ist sehr nützlich, da sie die Entwicklung von Renderings ermöglicht, die auf mehreren Websites verwendet werden können.

Um das Verständnis zu erleichtern, werden wir einen Formatierer erstellen, mit dem Bilder als Raster angezeigt werden können.
(NB: Wir werden in diesem Tutorial nicht auf Stile eingehen.)

Voraussetzung:
Erstellen Sie benutzerdefinierte Feldtypen, Widgets und Formatierungen

Wo soll ich anfangen?
Sie müssen das Feld bestimmen, das für die Verwaltung der Daten zuständig ist, in unserem Fall das Bildfeld.

namespace Drupal\image\Plugin\Field\FieldType;


....
 *   default_widget = "image_image",
 *   default_formatter = "image",
...

# voir le fichier core/modules/image/src/Plugin/Field/FieldType/ImageItem.php

Aus dieser Datei bestimmen wir die Standardformatierung: Bild. Wir erweitern es, um unser eigenes zu erstellen.

<?php

namespace Drupal\more_fields\Plugin\Field\FieldFormatter;

use Drupal\Core\Field\FieldItemListInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\image\Plugin\Field\FieldFormatter\ImageFormatter;

/**
 * Plugin implementation of the 'FieldGalleries' formatter.
 *
 * @FieldFormatter(
 *   id = "more_field_mit_gallery_formatter",
 *   label = @Translation("Mitor Gallery (Grid)"),
 *   field_types = {
 *     "image"
 *   },
 *   quickedit = {
 *     "editor" = "image"
 *   }
 * )
 */
class FieldMitorGalleryFormatter extends ImageFormatter {


}

Dieser minimale Code ermöglicht es bereits, unser Feld in den Konfigurationsoptionen des Formatierers anzuzeigen.

Wir fügen die Methode hinzu, mit der wir die Anzeige unseres Feldes steuern können.

  /**
   *
   * {@inheritdoc}
   */
  public function viewElements(FieldItemListInterface $items, $langcode) {
    $elements = [
      '#theme' => 'more_field_mit_gallery_formatter',
      'items' => parent::viewElements($items, $langcode)
    ];
    return $elements;
  }

Um die Darstellung zu vereinfachen, haben wir uns für ein Thema entschieden (es steht Ihnen aber frei, einen anderen Ansatz zu verwenden).
Wir werden später darauf zurückkommen.

Dann fügen wir die beiden Methoden defaultSettings und settingsForm hinzu, mit denen wir die Konfiguration verwalten können.

  /**
   *
   * {@inheritdoc}
   */
  public static function defaultSettings() {
    return [
      "container_class" => "",
      "item_class" => ""
    ] + parent::defaultSettings();
  }


  /**
   *
   * {@inheritdoc}
   */
  public function settingsForm(array $form, FormStateInterface $form_state) {
    $elements = parent::settingsForm($form, $form_state);
    $elements['container_class'] = [
      "#type" => "text_field",
      "#title" => $this->t('Container class'),
      '#default_value' => $this->getSetting('container_class')
    ];
    $elements['item_class'] = [
      "#type" => "text_field",
      "#title" => $this->t('Item class'),
      '#default_value' => $this->getSetting('item_class')
    ];
    return $elements;
  }