kingston-kms / yii2-image-cropper
用于上传和裁剪图片的 Yii-Framework 小部件
v1.0.0
2022-12-18 19:24 UTC
Requires
- bower-asset/jcrop: =0.9.12
- bower-asset/simple-ajax-uploader: 2.6.1
- yiisoft/yii2: *
- yiisoft/yii2-imagine: *
This package is auto-updated.
Last update: 2024-09-19 21:19:09 UTC
README
用于上传和裁剪图片的 Yii-Framework 扩展
安装
通过以下方式安装此扩展:通过 composer。
运行以下命令
php composer.phar require --prefer-dist kingston-kms/yii2-image-cropper
或者在您的 composer.json
文件的 require 部分添加
"kingston-kms/yii2-image-cropper": "*"
。
使用方法
扩展安装完成后,只需在代码中通过以下方式使用它
use budyaga\cropper\Widget;
<?php $form = ActiveForm::begin(['id' => 'form-profile']); ?>
<?php echo $form->field($model, 'photo')->widget(Widget::className(), [
'uploadUrl' => Url::toRoute('/user/user/uploadPhoto'),
]) ?>
<div class="form-group">
<?php echo Html::submitButton('Save', ['class' => 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
小部件具有以下属性
在 UserController 中
public function actions()
{
return [
'uploadPhoto' => [
'class' => 'budyaga\cropper\actions\UploadAction',
'url' => 'http://your_domain.com/uploads/user/photo',
'path' => '@frontend/web/uploads/user/photo',
]
];
}
操作具有以下参数
您可以在前端和后端使用此小部件。例如:用户可以更改其用户头像,管理员可以更改用户头像。
操作如下
用户点击新的照片区域或拖拽文件
JavaScript FileAPI 加载图片。
该图片在组件中显示,用户可以裁剪它或上传另一张图片。
当用户点击“裁剪图片”时,将发送包含文件和坐标的请求到服务器。该图片将在表单中显示,用户可以保存它,或更改裁剪区域,或上传另一张照片。