avro/image-bundle

Symfony2 图片Bundle

安装: 24

依赖: 0

建议者: 0

安全: 0

星标: 0

关注者: 2

分支: 0

开放问题: 0

类型:symfony-bundle

dev-master 2013-01-07 14:54 UTC

This package is not auto-updated.

Last update: 2024-09-22 03:31:02 UTC


README

Symfony2 图片Bundle。

轻松地将图片附加到任何对象上,并以画廊、轮播图或灯箱的形式显示它们。

状态

  • 进行中
  • 目前仅支持MongoDB,并将图片存储在GridFS中

需求

安装

使用composer下载AvroImageBundle

在composer.json中添加AvroImageBundle

{
    "require": {
        "avro/image-bundle": "*"
    }
}

现在通过运行命令告诉composer下载bundle

$ php composer.phar update avro/image-bundle

在kernel中启用bundle

// app/AppKernel.php
new Avro\ImageBundle\AvroImageBundle

添加路由

//app/config/routing

avro_image:
    resource: "@AvroImageBundle/Resources/config/routing/routing.xml"

添加资源

添加CSS

{% stylesheets output='css/compiled/app.css' filter='cssrewrite, less, ?yui_css'
...
    'bundles/avroimage/css/avro-image.css'
...
%}
<link rel="stylesheet" href="{{ asset_url }}" type="text/css" media="screen" />
{% endstylesheets %}

添加JS

{% javascripts output='js/compiled/app.js' filter='?yui_js'
...
    'bundles/avroimage/js/avro-image.js'
...
%}
    <script type="text/javascript" src="{{ asset_url }}"></script>
{% endjavascripts %}

导出资产并观察

$ php app/console assets:install --symlink=true

$ php app/console assetic:dump --watch --force 

添加映射

将图片引用添加到您想要评分的对象中

<?php
// src/Acme/ProductBundle/Document/Product.php

namespace Acme\ProductBundle\Document;

use Doctrine\ODM\MongoDB\Mapping\Annotations as ODM;
use Avro\ImageBundle\Model\ImageObjectInterface;

/**
 * @ODM\Document
 */
class Product implements ImageObjectInterface
{
    ...

    public function __construct()
    {
        $this->images = new \Doctrine\Common\Collections\ArrayCollection();
    }
    /**
     * @ODM\ReferenceMany(targetDocument="Avro\ImageBundle\Document\Image", cascade={"all"}, sort={"position"="asc"})
     */
    protected $images;

    /**
     * Set images
     *
     * @param ArrayCollection $images
     * @return Product
     */
    public function setImages(\Doctrine\Common\Collections\ArrayCollection $images)
    {
        $this->images = $images;
        return $this;
    }

    /**
     * Get images
     *
     * @return MongoCursor $images
     */
    public function getImages()
    {
        return $this->images;
    }

    /**
     * Add images
     *
     * @param Avro\ImageBundle\Document\Image $image
     */
    public function addImage(\Avro\ImageBundle\Document\Image $image)
    {
        $this->images[] = $image;
        return $this;
    }

    /**
     * Remove image
     *
     * @param Avro\ImageBundle\Document\Image $image
     */
    public function removeImage(\Avro\ImageBundle\Document\Image $image)
    {
        $this->images->removeElement($image);
        return $this;
    }

    /**
     * Get the documents name
     */
    public function getDocumentName()
    {
        return 'product';
    }
   
    ...
}

配置参考

    avro_image:
        db_driver: mongodb 
        carousels:
            my_carousel:
                style=twitter
                width: 300
                height: 300
                slide: true
            my_custom_carousel:
                style: custom
                template: AcmeDemoBundle:Carousel:my_carousel.html.twig

显示图片

在twitter bootstrap轮播图中渲染图片

{{ carousel_render('twitter', product.images) }}

就是这样!

贡献

发送您的自定义模板!