带有图像样式的 Drupal 8 图像

Posted

技术标签:

【中文标题】带有图像样式的 Drupal 8 图像【英文标题】:Drupal 8 images with image style 【发布时间】:2014-09-05 10:32:59 【问题描述】:

在 drupal 7 中,我使用函数 image_style_url('style', uri) 生成具有样式的新图像并返回图像的路径。那么在drupal 8中会用什么代替它呢?谢谢

【问题讨论】:

【参考方案1】:

根据change records:

use Drupal\image\Entity\ImageStyle;

$path = 'public://images/image.jpg';
$url = ImageStyle::load('style_name')->buildUrl($path);

【讨论】:

我需要在 Twig 模板中执行此操作,但在这里我不能使用 php。我该怎么办? @FredK 你看错了:你不需要在模板中做这件事;您可能出于某种原因想要这样做,但这是个坏主意,而且您绝对不需要。模板预处理函数是此代码的正确位置。但是如果你坚持必须在 Twig 中完成,你需要编写一些 PHP 来向它公开 ImageStyle 类方法。不过,这比仅按照推荐的方式执行要花费更长的时间 对于仍在寻找@FredK 解决方案的任何人,Twig Tweak 模块有一个 image_style 过滤器,可用于避免预处理【参考方案2】:

您应该尽可能使用新的 Drupal 功能。

改为使用:

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

$fid = 123;
$file = File::load($fid);
$image_uri = ImageStyle::load('your_style-name')->buildUrl($file->getFileUri());

根据https://www.drupal.org/node/2050669编辑:

$original_image = 'public://images/image.jpg';

// Load the image style configuration entity
use Drupal\image\Entity\ImageStyle;
$style = ImageStyle::load('thumbnail');

$uri = $style->buildUri($original_image);
$url = $style->buildUrl($original_image);

【讨论】:

【参考方案3】:

在您的控制器和 Drupal 的其他 OOP 部分中,您可以使用:

use Drupal\image\Entity\ImageStyle;

$path = 'public://images/image.jpg';
$url = ImageStyle::load('style_name')->buildUrl($path);

YOUR_THEME.theme 文件中,而Error: Class 'ImageStyle' not found in YOURTHEMENAME_preprocess_node 您可以使用以下方法进行操作

 $path = 'public://images/image.jpg';
 $style = \Drupal::entityTypeManager()->getStorage('image_style')->load('thumbnail');
 $url = $style->buildUrl($path);

另一种方法是提供一个可渲染数组,让drupal Render 引擎渲染它。

$render = [
    '#theme' => 'image_style',
    '#style_name' => 'thumbnail',
    '#uri' => $path,
    // optional parameters
];

【讨论】:

感谢 3 个版本!【参考方案4】:

我发现我经常想对图像进行预处理以将图像样式应用于节点或段落类型上的图像。在许多情况下,我创建了一个段落,允许用户以百分比的形式选择图像的宽度。在预处理中,我会检查宽度的值并应用正确的图像样式。

use Drupal\image\Entity\ImageStyle;

function THEME_preprocess_paragraph__basic_content(&$vars) 
  //get the paragraph
  $paragraph = $vars['paragraph'];

  //get the image
  $images = $paragraph->get('field_para_image');
  //get the images value, in my case I only have one required image, but if you have unlimited image, you could loop thru $images
  $uri = $images[0]->entity->uri->value;

  //This is my field that determines the width the user wants for the image and is used to determine the image style
  $preset = $paragraph->get('field_column_width')->value;

  $properties = array();
  $properties['title'] = $images[0]->getValue()['title'];
  $properties['alt'] = $images[0]->getValue()['alt'];

  //this is where the Image style is applied
  switch($preset) 
     case 'image-20':
       $properties['uri'] = ImageStyle::load('width_20_percent')->buildUrl($uri);
       break;
     case 'image-45':
       $properties['uri'] = ImageStyle::load('width_45_percent')->buildUrl($uri);
       break;
     case 'image-55':
       $properties['uri'] = ImageStyle::load('width_55_percent')->buildUrl($uri);
       break;
     case 'image-100':
       $properties['uri'] = ImageStyle::load('width_100_percent')->buildUrl($uri);
       break;
  
  //assign to a variable that the twig template can use
  $vars['basic_image_display'] = $properties;

在此示例中,我正在预处理一个名为“basic_content”的特定段落类型,但您可以使用节点预处理执行相同的操作。继续我的示例,我将有一个名为 paragraph--basic_content.html.twig 的树枝模板来处理该段落类型的显示。

在 twig 文件中显示图像是这样的。

<img class="img-responsive" src="basic_image_display['uri']"  title=" basic_image_display['title'] "/>

【讨论】:

【参考方案5】:
$view_mode = $variables['content']['field_media_image']['0']['#view_mode'];
$display_content = \Drupal::service('entity_display.repository')
->getViewDisplay('media', 'image', $view_mode)->build($media_entity);
$style = ImageStyle::load($display_content['image'][0]['#image_style']); $original_image = $media_entity->get('image')->entity->getFileUri();
$destination = $style->buildUri($original_image);

这是您从媒体图像实体获取图像样式的方式。

【讨论】:

【参考方案6】:

从 .module 文件中的经典 Drupal 数据库查询中为我工作:

$query = \Drupal::database()->select('file_managed', 'f' );
$query->addField('f', 'uri');
$pictures = $query->execute()->fetchAll();

foreach ($pictures as $key => $picture) 

   $largePictureUri = entity_load('image_style', 'large')->buildUrl($picture->uri);

【讨论】:

【参考方案7】:

我在 Drupal 8 中使用了这段代码。它工作正常。

$fid = 374; //get your file id, this value just for example 
$fname = db_select('file_managed', 'f')->fields('f', array('filename'))->condition('f.fid', $fid)->execute()->fetchField();
$url = entity_load('image_style', 'YOUR_STYLE_NAME')->buildUrl($fname);

【讨论】:

使用 Drupal 对象而不是数据库查询是最佳实践(和更简洁的代码)。我建议使用$file = File::load($fid); 命令来获取文件对象,而不是在数据库中查询文件名。 要添加到 sagesolution 的评论中,现在不推荐使用 entity_load() 函数,因此用户应该参考使用 ImageStyle 类加载样式的答案。

以上是关于带有图像样式的 Drupal 8 图像的主要内容,如果未能解决你的问题,请参考以下文章

在Drupal7中手动构建imagecache(也称为图像样式)

Drupal - 使用带有视图的灯箱(Rel 属性) - 在输出链接中

text Drupal 8响应图像

视图中的drupal图像全屏显示,如何使图像变小?

通过 vue js 将电影图像发布/上传到 drupal 8

在 Drupal 视图中显示图像