PHPackages dpodium/yii2-widget-upload-crop - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [File & Storage](/categories/file-storage) 4. / 5. dpodium/yii2-widget-upload-crop ActiveYii2-extension[File & Storage](/categories/file-storage) dpodium/yii2-widget-upload-crop =============================== Yii2 widget for file upload and allow user to zoom and crop the image 0.5(9y ago)518.2k↓61.1%3[3 issues](https://github.com/dpodium/yii2-widget-upload-crop/issues)BSDJavaScript Since Feb 22Pushed 8y ago4 watchersCompare [ Source](https://github.com/dpodium/yii2-widget-upload-crop)[ Packagist](https://packagist.org/packages/dpodium/yii2-widget-upload-crop)[ RSS](/packages/dpodium-yii2-widget-upload-crop/feed)WikiDiscussions master Synced 2d ago READMEChangelogDependencies (1)Versions (6)Used By (0) Yii2 Upload Crop Widget ======================= [](#yii2-upload-crop-widget) ========== Yii2 widget that enhance file input with crop and zoom features. Based on package cyneek/yii2-widget-upload-crop by Joseba Juániz. Installation ------------ [](#installation) The preferred way to install this extension is through [composer](http://getcomposer.org/download/). Either run ``` php composer.phar require dpodium/yii2-widget-upload-crop "*" ``` or add ``` "dpodium/yii2-widget-upload-crop": "*" ``` to the require section of your `composer.json` file. Usage --- This widget is ready with all required scripts in it's assets, just call the widget to render it: ``` echo \dpodium\yii2\widget\upload\crop\UploadCrop::widget( [ 'form' => $form, 'model' => $fileModel, 'attribute' => 'avatar', 'maxSize' => 300, 'imageSrc' => (isset($imageSrc)) ? $$imageSrc : '', 'title' => Yii::t('admin', 'Crop photo'), 'changePhotoTitle' => Yii::t('admin', 'Change photo'), 'jcropOptions' => [ 'dragMode' => 'move', 'viewMode' => 1, 'autoCropArea' => '0.1', 'restore' => false, 'guides' => false, 'center' => false, 'movable' => true, 'highlight' => false, 'cropBoxMovable' => false, 'cropBoxResizable' => false, 'background' => false, 'minContainerHeight' => 500, 'minCanvasHeight' => 400, 'minCropBoxWidth' => 200, 'minCropBoxHeight' => 200, 'responsive' => true, 'toggleDragModeOnDblclick' => false ] ] ); ``` Widget method options --------------------- [](#widget-method-options) - model (string) (Mandatory) > Defines the model that will be used to make the form input field. You may use DynamicForm for it. - attribute (string) (Mandatory) > Defines the model attribute that will be used to make de form input field. If using dynamicform, just create a temporary attribute, eg. 'image'. - form (ActiveForm) (optional) > Its the ActiveForm object that defines the form in which the widget it's included. It will be used to inherit the form config when making the input field. - enableClientValidation (boolean) (optional) > Used when the form option it's not defined. It establishes if it's or isn't activated in the widget input fields the Yii2 javaScript client validation. - imageOptions (array) (optional) > List with options that will be added to the image field that will be used to define the crop data in the modal. The format should be \['option' => 'value'\]. - jcropOptions (array) (optional) > List with options that will be added in javaScript while creating the crop object. For more information about which options can be added you can [read this web](https://github.com/fengyuanchen/cropper#options). - maxSize (integer) (optional) > Being 300 by default, it's the attribute that defines the max-height and max-width that will be applied to the preview image that it's shown after selecting a crop zone. Recovering form image and crop data ----------------------------------- [](#recovering-form-image-and-crop-data) The form will send to the server the data this way: - Image file: it must be assigned to the model attribute itself in the usual way. [For example](http://stackoverflow.com/questions/23592125/how-to-upload-a-file-to-directory-in-yii2?answertab=active#tab-top) - Cropping values: they will be sent to Yii 2 in array form: ``` ["cropping"]=> array(4) { ["x"]=> string(1) "12" ["width"]=> string(3) "400" ["y"]=> string(1) "0" ["height"]=> string(3) "297" } ``` Example ------- [](#example) ``` ... use yii\base\DynamicModel; use yii\web\UploadedFile; use yii\imagine\Image; use Imagine\Image\Box; ... $uploadParam = 'avatar'; $maxSize = 2097152; $extensions = 'jpeg, jpg, png, gif'; $width = 200; $height = 200; if (Yii::$app->request->isPost) { $model = new DynamicModel([$uploadParam]); $model->load(Yii::$app->request->post()); $model->{$uploadParam} = UploadedFile::getInstance($model, $uploadParam); $model->addRule($uploadParam, 'image', [ 'maxSize' => $maxSize, 'extensions' => explode(', ', $extensions), ])->validate(); if ($model->hasErrors()) { Yii::$app->session->setFlash("warning", $model->getFirstError($uploadParam)); } else { $name = Yii::$app->user->id . '.png'; $cropInfo = Yii::$app->request->post('cropping'); try { $image = Image::crop( $model->{$uploadParam}->tempName, intval($cropInfo['width']), intval($cropInfo['height']), [$cropInfo['x'], $cropInfo['y']] )->resize( new Box($width, $height) ); } catch (\Exception $e) { Yii::$app->session->setFlash("warning", $e->getMessage()); } //upload and save db $path = 'images/'.$name; if (isset($image) && $image->save($path)) { ... //store your image info to db here ... Yii::$app->session->setFlash("success", Yii::t('alert', 'Avatar upload success.')); } else { Yii::$app->session->setFlash("warning", Yii::t('alert', 'Avatar upload failed.')); } } return $this->redirect(['account/index']); } else { throw new BadRequestHttpException(Yii::t('cropper', 'ONLY_POST_REQUEST')); } ``` ### Health Score 30 — LowBetter than 62% of packages Maintenance8 Infrequent updates — may be unmaintained Popularity31 Limited adoption so far Community11 Small or concentrated contributor base Maturity57 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~113 days Total 5 Last Release 3334d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/c7d4729d14d133df43f29028b24bdf23a9ceadbc94012de1b7ec02ce58c55e02?d=identicon)[dpodium](/maintainers/dpodium) --- Top Contributors [![sionghuat](https://avatars.githubusercontent.com/u/13095881?v=4)](https://github.com/sionghuat "sionghuat (6 commits)") --- Tags yii2widgetcropfileuploadzoom ### Embed Badge ![Health badge](/badges/dpodium-yii2-widget-upload-crop/health.svg) ``` [![Health](https://phpackages.com/badges/dpodium-yii2-widget-upload-crop/health.svg)](https://phpackages.com/packages/dpodium-yii2-widget-upload-crop) ``` ### Alternatives [noam148/yii2-image-manager A Yii2 module/widget for upload and cropping images 13014.9k](/packages/noam148-yii2-image-manager)[vova07/yii2-fileapi-widget The FileAPI widget for Yii2 framework. 4766.3k9](/packages/vova07-yii2-fileapi-widget)[karpoff/yii2-crop-image-upload Yii 2 Crop image upload widget 1818.5k](/packages/karpoff-yii2-crop-image-upload)[limion/yii2-jquery-fileupload-widget Blueimp file upload widget for Yii2 1224.8k](/packages/limion-yii2-jquery-fileupload-widget) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)