Question

我正在尝试使用我在drupal 8主题中创建的图像样式打印图像。

我可以通过{{content.banner}}在模板中打印图像，但如何将图像样式应用于该图像？我试着寻找文件，但似乎没有任何文件。

Answer 1

Currently drupal 8 doesn't have special filter for applying image style. Instead you can set new attribute for your image like this:

{% set image = image|merge({'#image_style': 'thumbnail'}) %}

Then simply output your updated image:

{{ image }}

P.S . You can do {{ dump(image) }} to see what attributes you can update

Answer 2

我通过创建自己的 Twig Filter 来解决这个问题。

您也可以通过创建自己的模块来展示此过滤器。

随意重复使用。

<强>代码

namespace Drupal\twig_extender\TwigExtension;

use Drupal\node\Entity\Node;
use Drupal\Core\Link;
use Drupal\Core\Url;

use Drupal\file\Entity\File;
use Drupal\image\Entity\ImageStyle;

class Images extends \Twig_Extension {
     /**
     * Generates a list of all Twig functions that this extension defines.
     */
     public function getFunctions(){
         return array(
             new \Twig_SimpleFunction('image_style', array($this, 'imageStyle'), array('is_safe' => array('html'))),
         );
     }

    /**
    * Gets a unique identifier for this Twig extension.
    */
    public function getName() {
        return 'twig_extender.twig.images';
    }


     /**
      * Generate images styles for given image
      */
      public static function imageStyle($file_id, $styles) {
          $file = File::load($file_id);
          $transform = array();
          if (isset($file->uri->value)) {
              $transform['source'] = $file->url();
              foreach ($styles as $style) {
                  $transform[$style] = ImageStyle::load($style)->buildUrl($file->uri->value);
              }
          }
         return $transform;
      }
}

<强>用法

{% set transform = image_style(image.entity.fid.value, ['thumbnail', 'large']) %}

然后您就可以访问源图像＆amp;样式

{{ transform.source }}
{{ transform.thumbnail }}
{{ transform.large }}

希望它会帮助你！

Answer 3

也许值得一提，首先质疑您的假设很有用。您真的需要在Twig中这样做吗？如果您仅可以配置视图模式（或“视图”字段）以使用适当的（响应式）图像样式渲染图像字段，那将更加简单。

Answer 4

如何在没有contrib模块的情况下执行此操作：将其设为自己的渲染数组。

{% for item in content.field_images['#items'] %}
  {% set image = {
    '#theme':      'image_style',
    '#style_name': 'medium',
    '#uri':        item.entity.uri.value,
    '#alt':        item.alt,
    '#width':      item.width,
    '#height':     item.height
  } %}
  {{ image }}
{% endfor %}

如何在Drupal 8 twig模板中使用图像样式？

4 个答案: