Erstellen benutzerdefinierter Feldformatierer in Drupal 8

Key Takeaways

• Erstellen eines benutzerdefinierten Feldformaters in Drupal 8 beinhaltet die Definition einer neuen Formatierklasse im Verzeichnis SRC/Plugin/Field/Fieldformatter eines benutzerdefinierten Moduls, das sich vom Standard -ImageFormatter -Plugin erstreckt.
• Die neue Formatierklasse sollte die Methode von ViewElements () überschreiben, um ein Render -Array von Felddaten zurückzugeben, wodurch das Standard -Image_Formatter -Thema ersetzt wird.
.
Ein neues Thema, Image_title_Caption_formatter, wird in der .module -Datei des Moduls erstellt, wobei dieselben Variablen wie im Standard -Bild -Formatter -Thema übergeben wurden.
Das benutzerdefinierte Feldformatierer kann in Drupal 8 über die Registerkarte "Anzeige verwalten" des Inhaltstyps auf ein Feld angewendet werden, wobei das benutzerdefinierte Formatierer aus dem Dropdown "Format" ausgewählt wird.

Bitte beachten Sie, dass Drupal 8 aufgrund des Entwicklungsprozesses zum Zeitpunkt des Schreibens möglicherweise einige Teile des Codes veraltet sein. Schauen Sie sich dieses Repository an, in dem ich versuche, den Beispielcode zu aktualisieren und es mit der neuesten Drupal 8 -Version zu funktionieren.

Mit der Einführung von kommentierten Plugins hat sich in Drupal 8 viel geändert. Wir haben einen optimierten Ansatz, um Funktionen zu beschreiben und zu entdecken, die den Kern erweitern. Zusammen mit vielen anderen Komponenten basiert die frühere Feld API (Teil der größeren und konsolidierten Entitäts -API) jetzt auf Plugins.

In diesem Tutorial werden wir ein benutzerdefiniertes Feldformater für ein vorhandenes Feld (Bild) definieren. Wir wollen es erreichen, es möglich zu machen, ein Bild mit einer kleinen Beschriftung darunter anzuzeigen. Diese Bildunterschrift ist der dem Bild zugeordnete Titelwert, der dem Bild zugeordnet ist, wenn einer vorhanden ist.

Der Code, den wir hier schreiben, finden Sie in diesem Repository als das Modul image_title_caption. Aber mal sehen, wie wir zu diesem Endergebnis kommen können.

Das Drupal -Modul

Beginnen Sie uns zunächst ein neues benutzerdefiniertes Modul (Image_title_Caption) mit nur einer Datei:

image_title_caption.info.yml:

name: Image title caption
type: module
description: Uses the image title field as a caption
core: 8.x
dependencies:
  - image

Nichts außergewöhnlich hier. Wir können das Modul sogar noch aktivieren, wenn wir wollen.

Das Plugin

In Drupal 8 sind Feldformatter (wie Feldtypen und Widgets selbst) Plugins. Kern werden entweder durch Kernmodule definiert oder können im DrupalcorfieldPluginFieldFieldFieldFormatter -Namespace gefunden werden. Und wie wir in einem früheren Artikel gesehen haben, in dem wir uns benutzerdefinierte Blöcke angesehen haben, gehen Plugins in das SRC/ Plugin/ Ordner unseres Moduls. Im Fall von Feldformatierern ist dies das SRC/Plugin/Field/Fieldformatter -Verzeichnis.

unten sehen Sie unsere eigene Formatierklasse:

src/plugin/field/fieldformatter/imagetitlecaption.php:

name: Image title caption
type: module
description: Uses the image title field as a caption
core: 8.x
dependencies:
  - image

Dies ist unser Plugin. Sonst nichts dran. Über der Klassenerklärung haben wir die @FieldFormatter -Annotation, durch die das Plugin entdeckt wird. Wir geben eine Plugin -ID (Image_title_Caption), Beschriftung und ein Array von Feldtypen an, mit denen dieser Formatier verwendet werden kann. In unserem Fall enthält letztere nur den Standard -Bildfeldtyp, aber wir könnten mehr unterstützen, wenn wir wollten, auch benutzerdefinierte Feldtypen. Die Werte, die in diesem Array gehen, sind Plugin -IDs

Die Klasse sieht einfach aus, da wir uns vom Standard -ImageFormatter -Plugin erstrecken, der vom Kernbildmodul definiert ist. Für unseren Zweck müssen wir nur die Methode ViewElements () überschreiben, die für die Rückgabe eines Render -Arrays unserer Felddaten verantwortlich ist. Letzteres befindet sich in der Liste der $ items und kann verwendet und für das Rendering vorbereitet werden.

Das erste, was wir in dieser Methode tun, ist, dass wir die übergeordnete Klassenmethode auf den Elementen aufrufen und diese in einer Variablen speichern. Das wird das Bild bereits so vorbereiten, dass es normalerweise so wäre.

standardmäßig verwendet das ImageFormatter -Plugin (das übergeordnete) das Thema Image_formatter im Render -Array, um die Bildfeldwerte auszugeben. Was wir hier tun, ist, dass wir für jedes Element dieses Thema durch unser eigenes ersetzen: Image_title_Caption_formatter. Dann geben wir die Elemente (Render -Array) zurück, genau wie der Elternteil.

Sie werden dies in Drupal 8 bemerken: Wir erhalten einen sehr guten Hinweis darauf, was wir aus den übergeordneten Klassen, die wir erweitern, tun müssen. Und wenn Sie mich fragen, ist das viel besser, als herauszufinden, was ein magischer Haken oder eine magische Funktion tut.

Das Thema

Da das von uns oben angegebene Thema image_title_caption_formatter so weit imaginär ist, müssen wir es erstellen. In der .moduledatei unseres Moduls müssen wir Hook_THEME implementieren:

image_title_caption.module:

<span><span><?php
</span></span><span>
</span><span><span>/**
</span></span><span><span> * <span>@file
</span></span></span><span><span> * Contains \Drupal\image_title_caption\Plugin\Field\FieldFormatter\ImageTitleCaption.
</span></span><span><span> */
</span></span><span>
</span><span><span>namespace Drupal<span>\image_title_caption\Plugin\Field\FieldFormatter</span>;
</span></span><span>
</span><span><span>use Drupal<span>\Core\Field\FieldItemListInterface</span>;
</span></span><span><span>use Drupal<span>\image\Plugin\Field\FieldFormatter\ImageFormatter</span>;
</span></span><span>
</span><span><span>/**
</span></span><span><span> * Plugin implementation of the 'image_title_caption' formatter.
</span></span><span><span> *
</span></span><span><span> * @FieldFormatter(
</span></span><span><span> *   id = "image_title_caption",
</span></span><span><span> *   label = @Translation("Image with caption from title"),
</span></span><span><span> *   field_types = <span>{
</span></span></span><span><span> *     "image"
</span></span><span><span> *   <span>}
</span></span></span><span><span> * )
</span></span><span><span> */
</span></span><span><span>class ImageTitleCaption extends ImageFormatter {
</span></span><span>
</span><span>  <span>/**
</span></span><span><span>   * <span>{@inheritdoc}
</span></span></span><span><span>   */
</span></span><span>  <span>public function viewElements(FieldItemListInterface $items) {
</span></span><span>    <span>$elements = <span>parent::</span>viewElements($items);
</span></span><span>    <span>foreach ($elements as &$element) {
</span></span><span>      <span>$element['#theme'] = 'image_title_caption_formatter';
</span></span><span>    <span>}
</span></span><span>
</span><span>    <span>return $elements;
</span></span><span>  <span>}
</span></span><span>
</span><span><span>}</span></span>

Dies sollte vertraut aussehen, da es Drupal sehr ähnlich ist. 7. Bitte beachten Sie die Variablen, die wir an dieses Thema übergeben. Wir beabsichtigen, das Standard -Image_Formatter -Thema zu überschreiben, sodass wir auch die gleichen Variablen hier übergeben haben. Da das Thema Image_Formatter vorverarbeitet ist, müssen wir außerdem auch ein Präprozessor für unser Thema erstellen:

<span>/**
</span><span> * Implements hook_theme().
</span><span> */
</span><span>function image_title_caption_theme() {
</span>  <span>return array(
</span>    <span>'image_title_caption_formatter' => array(
</span>      <span>'variables' => array('item' => NULL, 'item_attributes' => NULL, 'url' => NULL, 'image_style' => NULL),
</span>    <span>),
</span>  <span>);
</span><span>}</span>

In diesem Präprozessor führen wir zwei Aktionen aus:

Wir stellen sicher, dass die an die Vorlagendatei übergebenen Variablen zum ersten Mal vom Standard -Image -Formatter -Themenvorprozessor vorverarbeitet wurden. Dies ist so, dass alle Variablen genau gleich sind und das Bild so angezeigt wird, wie es normalerweise wäre.
Wir erstellen eine neue Variable, die als Bildunterschrift bezeichnet wird, die den sanierenden Wert des Bildtitels enthält.

Für die Sanierung verwenden wir die Helfer -String -Klasse statisch. Wir befinden uns immer noch in der .module -Datei, damit wir sie nicht injizieren können, aber wir müssen

sie oben in der Datei verwenden:

name: Image title caption
type: module
description: Uses the image title field as a caption
core: 8.x
dependencies:
  - image

Vorlage

Schließlich müssen wir eine Vorlagendatei für unser neues Thema erstellen:

Vorlagen/Bild-Title-Kapion-Formatter.html.twig:

<span><span><?php
</span></span><span>
</span><span><span>/**
</span></span><span><span> * <span>@file
</span></span></span><span><span> * Contains \Drupal\image_title_caption\Plugin\Field\FieldFormatter\ImageTitleCaption.
</span></span><span><span> */
</span></span><span>
</span><span><span>namespace Drupal<span>\image_title_caption\Plugin\Field\FieldFormatter</span>;
</span></span><span>
</span><span><span>use Drupal<span>\Core\Field\FieldItemListInterface</span>;
</span></span><span><span>use Drupal<span>\image\Plugin\Field\FieldFormatter\ImageFormatter</span>;
</span></span><span>
</span><span><span>/**
</span></span><span><span> * Plugin implementation of the 'image_title_caption' formatter.
</span></span><span><span> *
</span></span><span><span> * @FieldFormatter(
</span></span><span><span> *   id = "image_title_caption",
</span></span><span><span> *   label = @Translation("Image with caption from title"),
</span></span><span><span> *   field_types = <span>{
</span></span></span><span><span> *     "image"
</span></span><span><span> *   <span>}
</span></span></span><span><span> * )
</span></span><span><span> */
</span></span><span><span>class ImageTitleCaption extends ImageFormatter {
</span></span><span>
</span><span>  <span>/**
</span></span><span><span>   * <span>{@inheritdoc}
</span></span></span><span><span>   */
</span></span><span>  <span>public function viewElements(FieldItemListInterface $items) {
</span></span><span>    <span>$elements = <span>parent::</span>viewElements($items);
</span></span><span>    <span>foreach ($elements as &$element) {
</span></span><span>      <span>$element['#theme'] = 'image_title_caption_formatter';
</span></span><span>    <span>}
</span></span><span>
</span><span>    <span>return $elements;
</span></span><span>  <span>}
</span></span><span>
</span><span><span>}</span></span>

Ähnlich wie bei Drupal 7 ist der Name dieser Datei wichtig, da er den Themennamen widerspiegelt. Was den Inhalt betrifft, so sind sie fast die gleichen wie die Vorlage, die vom Thema Image_formatter verwendet wird, mit Ausnahme der unten gedruckten Bildunterschrift.

funktioniert es?

Jetzt, da wir den Code geschrieben haben, müssen wir das Modul aktivieren und alle Caches löschen, wenn wir nach der Aktivierung Codeänderungen vorgenommen haben. Es ist Zeit, es zu testen.

Gehen Sie beispielsweise zum Feld "Artikelinhaltstyp" -Anzeigeeinstellungen unter Admin/Struktur/Typen/Verwalten/Artikel/Anzeige. Für das Bildfeld unter der Formatüberschrift sollten Sie in der Lage sein, das Bild mit Bildunterschrift aus dem Titelformat auszuwählen. Speichern Sie das Formular und wechseln Sie zu Admin/Struktur/Typen/Verwalten/Artikel/Feldern/Knoten.Article.field_image und stellen Sie sicher, dass der Bildfeldtitel aktiviert ist.

Schließlich können Sie einen Artikel bearbeiten, ein Bild hochladen und einen Titel angeben. Dieser Titel wird sich weiterhin als solche verhalten, aber außerdem wird er unter dem Bild als Bildunterschrift angezeigt. Natürlich können Sie es immer noch stylen, wie Sie möchten usw.

Schlussfolgerung

In diesem Artikel haben wir gesehen, wie einfach es ist, ein Feldformatierer zu erstellen und das Standardverhalten in Drupal 8 zu erweitern. Wir haben nur die Überschreibung der ViewElements () dieses Plugins angesprochen, aber wir können viel mehr tun, um weiter anzupassen Dinge. Sie müssen auch nicht die ImageFormatter erweitern. Es gibt viele vorhandene Plugins, von denen Sie sich entweder ausdehnen oder als Beispiel verwenden können.

Zusätzlich können Sie auch problemlos auch neue Feldtypen und Widgets erstellen. Es ist ein ähnlicher Prozess, aber Sie müssen einige Schema -Informationen berücksichtigen, verschiedene Annotationsklassen verwenden und mehr Code schreiben. Aber der Punkt ist, dass Sie dabei sehr flexibel sind.

häufig gestellte Fragen zum Erstellen benutzerdefinierter Feldformatters in Drupal 8

Wie erstelle ich eine benutzerdefinierte Feldformaterin in Drupal 8? Zunächst müssen Sie ein benutzerdefiniertes Modul erstellen, wenn Sie noch keine haben. Erstellen Sie dann in Ihrem benutzerdefinierten Modul eine neue Datei im Verzeichnis src/plugin/field/fieldformatter. Die Datei sollte gemäß der Klasse benannt werden, die sie enthalten wird. In dieser Datei definieren Sie die Klasse für benutzerdefinierte Feldformatierer, die die Formatterbase -Klasse erweitern sollte. Sie müssen verschiedene Methoden implementieren, einschließlich ViewElements (), die für die Generierung des Render -Arrays für die Feldwerte verantwortlich sind.

Was ist der Zweck der @FieldFormatter -Annotation in Drupal 8? Es enthält Eigenschaften wie ID, Etikett und field_types. Die ID ist eine eindeutige Kennung für das Formatierer, das Etikett ist der menschlich-lesbare Name, und Field_types ist ein Array von Feldtypmaschinennamen, den der Formatierer unterstützt. Feld in Drupal 8?

Um Ihr benutzerdefiniertes Feldformater auf ein Feld in Drupal 8 anzuwenden Feld. Suchen Sie das Feld in der Liste und wählen Sie Ihr benutzerdefiniertes Formatierer aus dem Dropdown "Format" aus. Klicken Sie dann auf die Schaltfläche „Aktualisieren“ und speichern Sie die Änderungen. gesteuert durch die Methode von ViewElements () in Ihrer Formatierklasse. Diese Methode sollte ein Render -Array für die Feldwerte zurückgeben. Sie können Drupals Theming -System verwenden, um die Ausgabe weiter anzupassen. Feldtypen in Drupal 8. In der @FieldFormatter -Annotation Ihrer Formatatter -Klasse können Sie in der Eigenschaft field_types ein Array von Feldtypmaschinennamen angeben. Drupal 8?

Um ein Einstellungsformular für Ihr benutzerdefiniertes Feldformatierer in Drupal 8 zu erstellen, müssen Sie die Methoden "Einstellungenform () und SettingSSummary () in Ihrer Formateig -Klasse implementieren. Die Methode Einstellungenform () sollte ein Formulararray für die Einstellungen zurückgeben, und die Methode EinstellungenSummary () sollte ein Array von zusammenfassenden Zeilen für die Einstellungen zurückgeben. 8?

Um einen benutzerdefinierten Feldformatierer zu verwenden, um Bilder in Drupal 8 anzuzeigen, sollte Ihre Formatter -Klasse die Bildformatterbase -Klasse anstelle von FormatterBase erweitern. Sie müssen die Methode ViewElements () implementieren, um ein Render -Array für die Bildfeldwerte zu generieren. Sie können ein benutzerdefiniertes Feldformatierer für einen benutzerdefinierten Feldtyp in Drupal 8 erstellen. In der @FieldFormatter -Annotation Ihrer Formatierklasse können Sie den Maschinennamen Ihres benutzerdefinierten Feldtyps in der Eigenschaft field_types angeben. Kann ich ein benutzerdefiniertes Feldformatierer verwenden, um Links in Drupal 8? Sie müssen die Methode ViewElements () implementieren, um ein Render -Array für die Link -Feldwerte zu generieren.

Wie kann ich ein benutzerdefiniertes Feldformater für ein Mehrwertfeld in Drupal 8? Klasse und implementieren Sie die Methode ViewElements (). Diese Methode sollte ein Render -Array für die Feldwerte zurückgeben, wobei berücksichtigt wird, dass das Feld mehrere Werte aufweist.

Das obige ist der detaillierte Inhalt vonErstellen benutzerdefinierter Feldformatierer in Drupal 8. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!