图片裁剪

addJcrop('name值', '标题' [, '提示', '默认值', '参数', '额外属性', '额外css类', '缩略图参数', '水印参数'])

版本	新增功能
1.2.0	自定义生成缩略图，自定义水印

标识符：jcrop

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像')
    ->fetch();

点击“上传”选择图片，并在图片上拖动鼠标，选择适合的大小。

然后点击“裁剪”即可。

这里的默认值是指图片的id。

该组件有以下常用的参数，根据实际需求设置。

参数名	默认值	说明
minSize	[ 8, 8 ]	选框最小尺寸，代表宽和高
maxSize	[ 0, 0 ]	选框最大尺寸，代表宽和高
aspectRatio	0	选框宽高比，它的值为width/height，例如：1表示正方形
bgColor	null]	背景颜色。颜色关键字、HEX、RGB 均可。
bgOpacity	null	背景透明度，比如0.5
edge	[ 'n' => 0, 's' => 0, 'e' => 0, 'w' => 0 ]	选框距四边的距离，其中s和e要写负值
canDrag	true	选框是否可拖拽
canResize	true	选框是否可改变大小
canSelect	true	是否可以新建选框
setSelect	null	设置选框大小和位置
saveWidth	null	保存的图片宽度
saveHeight	null	保存的图片高度

这里挑几个参数说一下

比如，希望限定选框的最小尺寸为10x10和最大尺寸50x50。

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', ['minSize' => [10, 10], 'maxSize' => [50, 50]])
    ->fetch();

想设置选框距离四边的距离都为10px

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', ['edge' => ['n' => 10, 's' => -10, 'e' => -10, 'w' => 10]])
    ->fetch();

n表示距上方距离，s表示距下方距离，e表示距右方距离，w表示距左方距离，其中，下和右的值需写负值。

设置选框大小和位置

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', ['setSelect' => [10, 10, 50, 50]])
    ->fetch();

表示选区距左方和上方10px，并且设置选区大小为50x50.

设置保存图片的大小

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', ['saveWidth' => 50, 'saveHeight' => 50])
    ->fetch();

以上表示图片最终保存为50x50，如果不填写则保存的图片大小以选区为准。

此参数需要1.2.0或以上版本支持。

生成30x30的缩略图

如果需要生成30x30的缩略图，那么size参数要写成30,30（用逗号隔开）

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', [], '', ['size' => '30,30'])
    ->fetch();

或者

return ZBuilder::make('form')
    ->addFormItems([
        ['jcrop', 'avatar', '头像', '', '', [], '', ['size' => '30,30']]
    ])
    ->fetch();

设置缩略图裁剪类型

默认情况下，缩略图的裁剪方式是“等比例缩放”，如果需要设置其他类型，可以这样写

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', [], '', ['size' => '30,30', 'type' => 2])
    ->fetch();

type参数可以设置以下几种，默认为1，即等比例缩放。

关闭缩略图功能

默认情况下，如果没有设置缩略图参数，那么是否生成缩略图由【系统】【系统设置】【上传】中的配置决定。

如果在表单项参数中设置了缩略图参数，则以表单项的缩略图参数为优先。

如果在系统设置中设置了缩略图参数，但在某些情况下，想临时不生成缩略图，则可以将缩略图参数设置为字符串'close'。

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', [], '', 'close')
    ->fetch();

此参数需要1.2.0或以上版本支持。

设置参数的img为附件id，即水印图片的附件id，如果附件不存在，则不会添加水印。

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', [], '', '', ['img' => 10])
    ->fetch();

设置水印的位置

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', [], '', '', ['img' => 10, 'pos' => 1])
    ->fetch();

水印位置有以下几个参数，默认为9，即右下角。

设置水印透明度

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', [], '', '', ['img' => 10, 'pos' => 1, 'alpha' => 90])
    ->fetch();

透明度取值范围是0~100，数字越小，透明度越高。

不添加水印

默认情况下，如果没有设置水印参数，那么是否添加水印由【系统】【系统设置】【上传】中的配置决定。

如果在表单项参数中设置了水印图参数，则以表单项的水印参数为优先。

如果在系统设置中设置了打开了水印功能，但在某些情况下，想临时不添加水印，则可以将水印参数设置为字符串'close'。

return ZBuilder::make('form')
    ->addJcrop('avatar', '头像', '', '', [], '', '', 'close')
    ->fetch();