phuongdev89/yii2-cropper

Yii-Framework 用于上传和裁剪图像的小部件

安装: 18

依赖者: 0

建议者: 0

安全: 0

星级: 0

关注者: 0

分支: 62

类型:yii2-extension

2.3.0 2023-01-10 15:43 UTC

This package is auto-updated.

Last update: 2024-09-10 19:11:23 UTC


README

Yii-Framework 的上传和裁剪图像扩展

安装

安装此扩展的首选方法是通过 composer

你可以运行

php composer.phar require --prefer-dist phuongdev89/yii2-cropper "@dev"

或者添加

"phuongdev89/yii2-cropper": "@dev"

到你的 composer.json 文件的 require 部分中。

使用方法

一旦安装了扩展,只需在你的代码中使用它即可

use phuongdev89\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' => 'phuongdev89\cropper\actions\UploadAction',
            'url' => 'http://your_domain.com/uploads/user/photo',
            'path' => '@frontend/web/uploads/user/photo',
        ]
    ];
}

操作具有以下参数

你可以在前端和后端使用此小部件。例如:用户可以更改他的用户头像,管理员可以更改用户头像。

操作如下

用户点击新照片区域或拖动文件

g4n7fva

图片通过 JavaScript FileAPI 加载。

yeul3gy

此图片在小部件中显示,用户可以裁剪它或上传另一张图片

jaungjk

当用户点击“裁剪图像”时,带有文件和坐标的请求会被发送到服务器。此图片在表单中显示,用户可以保存它,或更改裁剪区域,或上传另一张照片。

0ejh55q