cita/image-cropper

CitaNZ 为 SilverStripe 4 定制的图像裁剪器

维护者

详细信息

github.com/CITANZ/image-cropper

主页

源代码

问题

安装: 413

依赖关系: 1

建议者: 0

安全: 0

星标: 0

关注者: 2

分支: 2

开放问题: 10

语言:JavaScript

类型:silverstripe-vendormodule

2.0.3 2021-08-07 04:15 UTC

Requires

MIT 91d6781cd81048aba1cc889b69512d0333bd8439

cropperjsimage croppercropper toolsilverstripe image cropper

This package is auto-updated.

Last update: 2024-09-05 13:40:52 UTC

README

它是 Salted Herring 的 Cropper Field for SilverStripe - 4 的持续开发（https://github.com/salted-herring/salted-cropper）

使用方法

  1. 安装
composer require cita/image-cropper

  1. /dev/build?flush=all

  2. 示例代码

    ...
use Cita\ImageCropper\Model\CitaCroppableImage;
use Cita\ImageCropper\Fields\CroppableImageField;
...
private static $has_one = array(
    'Photo'     =>  CitaCroppableImage::class
);


public function getCMSFields()
{
    $fields = parent::getCMSFields();
    ...
    // adding a free cropper
    $fields->addFieldToTab(TAB_NAME, CroppableImageField::create('PhotoID', A_TITLE_TO_THE_FILED));

    // adding cropper with ratio
    $fields->addFieldToTab(TAB_NAME, CroppableImageField::create('PhotoID', A_TITLE_TO_THE_FILED)->setCropperRatio(16/9));
    ...
    return $fields;        
}

  3. 添加图像 > 上传/选择 > 保存 > 编辑 > 进行裁剪 > 保存

  4. 输出

    $Photo
$Photo.Cropped
$Photo.Cropped.SetWidth(100)

AWS 支持

如果您使用 SS 的 S3 资产模块来存储您的图像，您可能还希望将其添加到您网站的配置 yaml 中

SilverStripe\Admin\LeftAndMain:
  extra_requirements_javascript:
    - 'resources/vendor/cita/image-cropper/client/js/s3-workaround.js'