alxndrchernov/nova-image-cropper-field

一个带有裁剪和调整大小功能的Nova高级图像字段。

资助包维护!
ctessier

安装次数: 7

依赖项: 0

建议者: 0

安全性: 0

星标: 0

关注者: 0

分支: 26

语言:Vue

v2.0.4 2023-10-15 12:27 UTC

This package is auto-updated.

Last update: 2024-09-15 14:23:45 UTC


README

StyleCI Latest Version on Packagist Total Downloads License

Nova的高级图像字段,允许您上传、裁剪和调整图像大小

此包基于原生Nova图像字段构建。它使用Advanced Cropper在前端显示裁剪器,并使用Intervention Image在后台处理图像。

screenshot of the advanced image field

需求

有关详细信息,请参阅Intervention要求

入门

使用Composer将包安装到使用Nova的Laravel应用程序中

composer require ctessier/nova-advanced-image-field

如果您想使用Imagick作为默认的图像处理库,请按照Laravel的Intervention文档进行操作。这将为您提供一个新的配置文件,您可以在其中指定您想要的驱动程序。

代码示例

AdvancedImage 继承自 Image,因此您可以使用 Image 实现的任何方法。请参阅此处的文档。

// Show a cropbox with a fixed ratio
AdvancedImage::make('Photo')->croppable(16/9),

// Resize the image to a max width
AdvancedImage::make('Photo')->resize(1920),

// Override the image processing driver for this field only
AdvancedImage::make('Photo')->driver('imagick'),

要显示图像为圆形头像,请使用 AdvancedAvatar 类或 rounded 方法

AdvancedAvatar::make('Avatar')->croppable(),
AdvancedImage::make('Avatar')->croppable()->rounded(),

API

driver(string $driver)

覆盖Intervention用于图像操作的默认驱动程序。

AdvancedImage::make('Photo')->driver('imagick'),

croppable([float $ratio])

指定底层图像是否可裁剪。

如果作为第一个参数给出一个数值,它将用于定义裁剪框的固定宽高比。

AdvancedImage::make('Photo')->croppable(),
AdvancedImage::make('Photo')->croppable(16/9),

resize(int $width = null[, int $height = null])

指定图像应调整到的尺寸(宽度或高度)。

AdvancedImage::make('Photo')->resize(1920),
AdvancedImage::make('Photo')->resize(600, 400),
AdvancedImage::make('Photo')->resize(null, 300),

注意:此方法使用Intervention Image resize(),并带有放大和宽高比约束。

autoOrientate()

指定底层图像是否应进行定向。如果存在Exif数据,它将旋转图像到指定的方向。

这在某些情况下对于裁剪器正确工作可能是强制性的。

AdvancedImage::make('Photo')->autoOrientate(),

注意:PHP必须通过--enable-exif编译以使用此方法。Windows用户还必须启用mbstring扩展。请参阅Intervention Image文档以获取更多详细信息。

quality(int $quality)

指定转换后图像的结果质量。

这仅适用于JPG格式,因为PNG压缩是无损的。值必须在0(质量差,文件小)到100(质量最好,文件大)之间。

AdvancedImage::make('Photo')->resize(600, 400)->quality(95),

注意:质量将被传递到Intervention Image save()方法。