0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Drupalのviewsモジュールをもっとカスタマイズしよう

Posted at

Drupal viewsモジュールとは

Drupalのviewsモジュールとは、ノードやユーザー、その他、拡張モジュールの独自テーブル(entityにviews_dataキーは必要)など様々なテーブルのデータの取得を管理画面からGUIで管理できるモジュールです。
昔はコントリビュートモジュールだったようですが、その人気の高さから、今ではコアモジュールになっています。

viewsモジュールを触ってみて

データの取得のクエリをコード上ではなく、管理画面をぽちぽちして、自動的に発行すると聞くと、何か制限があるんじゃないかとか、ベテランのエンジニアほど拒否反応を示す気がしますが...
このviewsモジュールというのは非常によくできていると感じます。

また、このviewsモジュールを活用して、csvとしてデータをダウンロードするモジュールなどもコントリビュートモジュールも存在しています。
もはや、Drupalといえば、viewsモジュールとも言えるぐらい代名詞的なモジュールだと思います。

本題

Drupalを触った方ならお馴染みのviewモジュールの設定画面にヘッダーやフッターエリアがあります。
ここに自作モジュールから定義した独自の部品を追加させるカスタマイズのご紹介です。

KFPUAzZTC0vpou5EQMlBOY03JI1sFp.png

これをどうやって追加するかと言うと、Plugin APIを使います。
Plugin APIで一番有名なもので言えば、カスタムブロックの追加でしょうか。
今回のviewsのエリアに追加する場合は、「ViewsArea」アノテーションを使えばできるようです。
以下、参考コード

CloseButton.php
<?php

namespace Drupal\close_button\Plugin\views\area;

use Drupal\Core\Form\FormStateInterface;
use Drupal\views\Plugin\views\area\AreaPluginBase;

/**
 * CloseButton class.
 *
 * @ingroup views_area_handlers
 *
 * @ViewsArea("close_button")
 */
class CloseButton extends AreaPluginBase {

  /**
   * {@inheritDoc}
   */
  public function render($empty = FALSE) {
    if (!$empty || !empty($this->options['empty'])) {
      $label = !empty($this->options['button_label']) ? $this->options['button_label'] : 'この画面を閉じる';
      return [
        '#type' => 'button',
        '#value' => $label,
        '#attributes' => [
          'class' => ['js-close-button'],
        ],
        '#attached' => [
          'library' => [
            'close_button/close_button',
          ],
        ],
      ];
    }

    return [];
  }

  /**
   * {@inheritdoc}
   */
  protected function defineOptions() {
    $options = parent::defineOptions();
    $options['button_label'] = ['default' => ''];
    return $options;
  }

  /**
   * {@inheritDoc}
   */
  public function buildOptionsForm(&$form, FormStateInterface $form_state) {
    parent::buildOptionsForm($form, $form_state);

    $form['button_label'] = [
      '#type' => 'textfield',
      '#title' => 'ラベル',
      '#description' => 'リンクの文字列。',
      '#default_value' => $this->options['button_label'],
    ];
  }

}
close_button.module
<?php

/**
 * @file
 * Close Button module.
 */

/**
 * Implements hook_views_data().
 */
function close_button_views_data() {
  $data['views']['close_button'] = [
    'title' => '閉じるボタン',
    'help' => '現在開いているページを閉じるボタンを追加します',
    'area' => [
      'id' => 'close_button',
    ],
  ];
  return $data;
}

test.png

このように、独自モジュールから画面を閉じるボタン(window.close())を追加することができるようになりました。
また、コンテンツ画面のフッターに閉じるボタンを追加しましたが、「ViewsArea」を使う事によって、他のviewsでも再利用が可能になります。

メモ

個人的な感想ですが、ブロックとの使い分けに関して

  • フロントだとブロックを使った方が自由度が高く、積極的に利用する
  • ページ上で変更箇所が少ない管理画面上では、ViewsAreaを積極的に利用する

上記が良いのかなと思いました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?