alvinojutsu/yii2-image-cropper

yii2 image cropper

yii2 image cropper

yii2 image cropper, _(*1)

this repo is modification from https://github.com/navatech/yii2-cropper, _(*2)

thanks to @lephuong, _(*3)

Enhancement

• Crop 1 image multiple size
• Thumbnail default size

Installation

The preferred way to install this extension is through composer., _(*4)

Either run, _(*5)

php composer.phar require --prefer-dist alvinojutsu/yii2-image-cropper "*"

or add, _(*6)

"alvinojutsu/yii2-image-cropper": "*"

to the require section of your composer.json file., _(*7)

Usage

Once the extension is installed, simply use it in your code by :, _(*8)

Without $model, _(*9)

<?= \alvinux\imagecropper\Cropper::widget([
    'name' => 'Post[picture]',
    // 'value' => 'https://fengyuanchen.github.io/cropper/images/picture.jpg', // Default blank image if not sett
    'options' => [
        ['width' => 200,'height' => 200],
        ['width' => 500,'height' => 200],
        ['width' => 500,'height' => 100],
    ],
    'showThumbnailCropper' => true, // optional, if ( showThumbnailCropper == false && autoCrop == true ) then 'hidden' else 'show',
    'autoCrop' => true, // optional, default (true), if autoCrop = 'true' there is no "Crop Image" button, if set false then you have to click 'Crop Image' button to get value
    'thumbnail' => ['width' => 250, 'height' => 250], // optional, default 150 x 150
    'pluginOptions' => [
        // https://github.com/fengyuanchen/cropper
        // Options default
        // 'autoCropArea'   => true,
        // 'strict'   => false,
        // 'guides'   => true,
        // 'highlight'   => true,
    ]
]); ?>

With $model, _(*10)

<?= \alvinux\imagecropper\Cropper::widget([
    'model' => $model,
    'attribute' => 'picture',
    'options' => [
        ['width' => 200,'height' => 200],
        ['width' => 500,'height' => 200],
        ['width' => 500,'height' => 100],
    ],
    'showThumbnailCropper' => true, // optional, if ( showThumbnailCropper == false && autoCrop == true ) then 'hidden' else 'show',
    'autoCrop' => true, // optional, default (true), if autoCrop = 'true' there is no "Crop Image" button, if set false then you have to click 'Crop Image' button to get value
    'thumbnail' => ['width' => 250, 'height' => 250], // optional, default 150 x 150
    'pluginOptions' => [
        //https://github.com/fengyuanchen/cropper
    ]
]); ?>

Screenshot

• Default without image br/

• With image br/