yellowskies/imagine-bundle

使用Imagine和Twig过滤器进行图像处理,兼容SF3。

安装: 82

依赖项: 0

建议者: 0

安全: 0

星标: 0

关注者: 2

分支: 0

开放问题: 0

类型:symfony-bundle

4.0.4 2017-01-23 22:10 UTC

This package is auto-updated.

Last update: 2024-09-12 00:49:39 UTC


README

此项目不再积极维护,请寻找其中之一的热门分支。谢谢!

SkiesImagineBundle

此捆绑包为Symfony2提供了简单的图像处理支持。例如,使用此捆绑包,可以实现以下功能

<img src="{{ '/relative/path/to/image.jpg' | apply_filter('thumbnail') }}" />

这将执行名为thumbnail的转换,您可以根据需要进行定义,例如调整大小、裁剪、绘制、遮罩等。

此捆绑包集成了独立的PHP "Imagine库"。

安装

安装是一个快速的三步过程

  1. 使用composer下载SkiesImagineBundle
  2. 启用捆绑包
  3. 配置应用的config.yml

步骤1:使用composer下载SkiesImagineBundle

在composer.json中添加SkiesImagineBundle

composer require yellowskies/imagine-bundle

Composer会将捆绑包安装到您的项目的vendor/Skies/imagine-bundle目录。

步骤2:启用捆绑包

在内核中启用捆绑包

<?php
// app/AppKernel.php

public function registerBundles()
{
    $bundles = array(
        // ...
        new Skies\Bundle\ImagineBundle\SkiesImagineBundle(),
    );
}

步骤3:注册捆绑包的路由

最后,将以下内容添加到您的路由文件中

# app/config/routing.yml

_imagine:
    resource: .
    type:     imagine

恭喜!您现在可以开始使用图像了!

基本用法

此捆绑包通过配置一组过滤器,然后将这些过滤器应用于模板中的图像来工作。因此,首先创建您需要在应用程序中的某个位置应用的过滤器。例如,假设您想将图像调整为120x90像素的缩略图

# app/config/config.yml

Skies_imagine:
    filters:
        my_thumb:
            type:    thumbnail
            options: { size: [120, 90], mode: outbound }

您还可以更改保存图像时要使用的质量和格式

# app/config/config.yml

Skies_imagine:
    filters:
        my_thumb:
            type:    thumbnail
            options: { size: [120, 90], mode: outbound, quality: 100, format: png }

您现在已定义了一个名为my_thumb的过滤器,它执行缩略图转换。我们将稍后学习有关可用转换的更多内容,但现在,此新过滤器可以立即在模板中使用

<img src="{{ '/relative/path/to/image.jpg' | apply_filter('my_thumb') }}" />

或者如果您使用PHP模板

<img src="<?php $this['imagine']->filter('/relative/path/to/image.jpg', 'my_thumb') ?>" />

在幕后,捆绑包在第一次请求时将过滤器应用于图像,然后将其缓存到类似路径。在下一个请求中,缓存的图像将直接从文件系统提供。

在此示例中,最终渲染的路径可能如下所示:/media/cache/my_thumb/relative/path/to/image.jpg。这是Imagine将保存过滤后的图像文件的位置。

HTTP缓存头

  • cache_type - 三个值之一:falsepublicprivate。将false设置为禁用缓存,即设置Cache-Control: no-cache

    默认:false

  • cache_expires - 设置缓存过期时间。使用DateTime解析器理解的格式。表达式将用+前缀,因此表达式应该是如2 weeks这样的形式。仅在cache_type等于publicprivate时使用。

    默认:1 day

配置示例

# app/config/config.yml

Skies_imagine:
    filters:
        my_thumb:
            type:    thumbnail
            options: { size: [120, 90], mode: outbound, cache_type: public, cache_expires: 2 weeks }

缓存头只在生成图像的第一次请求时设置。要解决这个问题,您应该在Web服务器中添加额外的配置。以下是为Apache Web服务器提供的示例

<IfModule mod_expires.c>
    <Directory "/path/to/web/media/cache">
        ExpiresActive On
        ExpiresDefault "access plus 2 weeks"
    </Directory>
</IfModule>

配置

捆绑包的默认配置如下所示

Skies_imagine:
    source_root:  %kernel.root_dir%/../web
    web_root:     %kernel.root_dir%/../web
    cache_prefix: media/cache
    driver:       gd
    filters:      []

有几个配置选项可用

  • source_root - 可以设置为原始图像目录的绝对路径。此选项允许您将原始图像存储在Web根目录之外的不同位置。在此根目录下,将在apply_filter模板过滤器中指定的相同相对路径中查找图像。

    默认:%kernel.root_dir%/../web

  • web_root - 必须是你应用程序的Web根目录的绝对路径。这用于确定生成图像文件的存放位置,以便在下次请求图像时,Apache可以在将请求交给Symfony2之前将其获取。

    默认:%kernel.root_dir%/../web

  • cache_prefix - 这也用于图像生成的路径中,以避免在Web根目录中充斥缓存图像。例如,默认情况下,图像将被写入到 web/media/cache/ 目录。

    默认: media/cache

  • driver - 三个驱动之一:gdimagickgmagick

    默认: gd

  • filters - 指定你想要定义和使用过滤器的选项

你指定的每个过滤器都有以下选项

  • type - 确定要使用的过滤器类型,有关更多信息,请参阅 过滤器 部分
  • options - 应传递给特定过滤器类型的选项
  • path - 覆盖全局 cache_prefix 并用此路径替换它
  • source_root - 覆盖全局 source_root 并用此路径替换它

内置过滤器

目前,此捆绑包仅包含一个内置过滤器:thumbnail

缩略图

如名称所示,thumbnail 过滤器对您的图像执行缩略图转换。配置如下所示

filters:
    my_thumb:
        type:    thumbnail
        options: { size: [120, 90], mode: outbound }

mode 可以是 outboundinset

调整大小

resize 过滤器可以用来简单更改图像的宽度和高度,而不考虑其比例。

以下是一个配置示例,它定义了两个过滤器以改变图像的确切屏幕分辨率

Skies_imagine:
    filters:
        cga:
            type:    resize
            options: { size: [320, 200] }
        wuxga:
            type:    resize
            options: { size: [1920, 1200] }

相对调整大小

relative_resize 过滤器可以用来相对于现有尺寸 heightenwidenincreasescale 图像。这些选项直接对应于Imagine的BoxInterface上的方法。

给定一个尺寸为50x40(宽度,高度)的输入图像,以下是一些注释的配置示例

Skies_imagine:
    filters:
        heighten:
            type:    relative_resize
            options: { heighten: 60 } # Transforms 50x40 to 75x60
        widen:
            type:    relative_resize
            options: { widen: 32 }    # Transforms 50x40 to 40x32
        increase:
            type:    relative_resize
            options: { increase: 10 } # Transforms 50x40 to 60x50
        scale:
            type:    relative_resize
            options: { scale: 2.5 }   # Transforms 50x40 to 125x100

如果您更喜欢在不进行过滤器配置的情况下使用Imagine,可以直接使用RelativeResize类。

粘贴

paste 过滤器将一个图像粘贴到您的图像中。

Skies_imagine:
    filters:
        paste:
            type:        paste
            options:
                image:   %kernel.root_dir%/Resources/image.png  # path to image
                x:       right                                  # [left|right|center] or integer
                y:       bottom                                 # [top|bottom|middle] or integer

使用chain过滤器,您可以在图像上应用一些过滤器。您可以简单地创建一个watermark过滤器

Skies_imagine:
    filters:
        watermark:
            type:                chain
            options:
                filters:
                    thumbnail:                                          # filter type
                        size:    [100, 100]                             # filter options
                        mode:    outbound
                    paste:
                        image:   %kernel.root_dir%/Resources/image.png
                        x:       right
                        y:       bottom

裁剪

crop 过滤器使用起始坐标和尺寸来裁剪图像。

Skies_imagine:
    filters:
        crop:
            type   : crop
            options: { start: [0, 0], size: [100, 100] } #crop image with 100x100 square box

加载您的自定义过滤器

ImagineBundle 允许您加载您自己的自定义过滤器类。唯一的要求是每个过滤器加载器实现以下接口

Skies\Bundle\ImagineBundle\Imagine\Filter\Loader\LoaderInterface

为了将捆绑包告知您的过滤器加载器,请将其注册到服务容器中,并应用以下标签(以下为XML示例)

<tag name="imagine.filter.loader" filter="my_custom_filter" />

有关服务容器的更多信息,请参阅 Symfony2 服务容器 文档。

现在,您可以在配置中定义要应用的过滤器时引用和使用您的自定义过滤器。

filters:
    my_special_filter:
        type:    my_custom_filter
        options: { }

有关过滤器加载器实现示例,请参阅 Skies\Bundle\ImagineBundle\Imagine\Filter\Loader\ThumbnailFilterLoader

注意事项

如果您在 Twig 模板中使用多个部分生成图像名称,请注意,Twig 在连接之前会应用过滤器,因此

<img src="{{ '/relative/path/to/' ~ some_variable ~ '.jpg' | apply_filter('my_thumb') }}" />

将过滤器应用于 '.jpg',然后将结果连接到 '/relative/path/to/'some_variable。正确的调用方法如下

<img src="{{ ('/relative/path/to/' ~ some_variable ~ '.jpg') | apply_filter('my_thumb') }}" />

作为服务使用

您可以将ImagineBundle用作服务并解决缓存图像路径。

$SkiesService = $this->get('imagine.cache.path.resolver');

然后,调用getBrowserPath函数,并传递原始图像的web路径和您想要使用的过滤器

$cachedImage = $SkiesService->getBrowserPath($object->getWebPath(), 'my_thumb');

同时,将ImagineBundle作为服务使用,并在控制器中创建缓存图像。

$cacheManager = $this->get('imagine.cache.manager');
$cachedPath = $cacheManager->cacheImage($this->getRequest()->getBaseUrl(), '/images/picture1.jpg', 'my_filter');