Create Image Thumbnails

This tutorial will help you to create "Thumbnail image". When you upload the images using Yii Framework, You can create thumbnail image. Here i explained step by step. Step 1: First Create one simple extension for image thumbnail. Add the thumbnail_images.php file into extensions/ThumbnailImages folder. Step 2: Configure the model for files. Here i just created simple model "Files" for images
<?php
class Files extends CFormModel
{
public function rules()
{
return array(array('images', 'required'),);
}
public function attributeLabels(){
return array('images' => 'Images',   );
}
}
?>
Step 3: Create the "FilesController" and it contains the all functions for thumbnail images like imagesave, thumbnail creation etc. Filescontroller have two functions. They are create, createimage.
<?php
Yii::import('application.extensions.ThumbnailImages.thumbnail_images');
class FilesController extends Controller
{
public $layout='//layouts/column2'; 
public function actionCreate($id)
{
$model=new Files;
if(isset($_POST['Files']))
{           
$filelist=CUploadedFile::getInstancesByName('fileurl');
if($filelist){
              foreach($filelist as $thefile)
{
$image=$thefile;
$imagetime=time();                    
$type=$thefile->extensionName;     
$destination=Yii::app()->basePath."/../simages/$imagetime"; 
if($image->saveAs($destination.'.'.$type)){
// pass destination path without letters and image format
                        $this->createimage(100,'',$destination,'s',$type);
$this->createimage(240,'',$destination,'m',$type);
$this->createimage(600,'',$destination,'l',$type);          
}
}                                   
}
        }
$this->render('create',array('model'=>$model,));
}

public function createimage($width,$height,$destination,$thumb,$type){
$obj_imgl = new thumbnail_images;
$obj_imgl->PathImgOld = $destination.".".$type;
$obj_imgl->PathImgNew = $destination."$thumb.".$type;
$obj_imgl->NewWidth = $width;
if($height!=''){
$obj_imgl->NewHeight = $height;
}
if (!$obj_imgl->create_thumbnail_images()) 
echo "error"; 
}
}
?>
Step 4: Function "create" will help you to save the uploaded images with timestamp and function "createimage" will help you to create thumbnail images. Step 5: Thumbnail image sizes are small, medium, large.
Small-s- 100px(width) Medum-m- 240px(width) Large-l- 600px(width)
Here i am using the letters s,m,l with image name to differentiate the images. You can configure this value. Step 6: Using "create" function, We have to save the original images using yii "saveAs" function. Using the saved path (original image) we will create thumbnail images. Image names based on timestamp and image type.Sample image names: Timestamp: 123456789 Type: jpg
Original - 123456789.jpg
Small-123456789s.jpg
Medum -123456789m.jpg
Large-123456789l.jpg
After saved the original image, Call the "createimage" function to create thumnail image. Step 7: "createimage" function will handle the thumbnail image creation. It needs five arguments. They are image width, height, original image saved path till timestampvalue (images/123456789), thumbnail image identifier letter and image type. Using "$destination+"."+$type"  We can get original image path. Using "$destination+$thumb+"."+$type" We can create thumbnail images. Step 8: Create form for this action
<?php
/* @var $this FilesController */
/* @var $model Files */
/* @var $form CActiveForm */
?>
<div class="form">
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'files-form',
'enableAjaxValidation'=>false,
    'htmlOptions'=>array('enctype' => 'multipart/form-data'),
)); ?>

<p class="note">Fields with <span class="required">*</span> are required.</p>
<?php echo $form->errorSummary($model); ?>

<?php echo $form->labelEx($model,'images'); ?>
<?php $filetype='jpg|jpeg|png|gif';
$this->widget('CMultiFileUpload', 
array('model'=>$model,
'name' => 'images',
'max'=>5,
'accept'=>$filetype,
'duplicate'=>'Duplicate file!',
'denied' => 'Invalid file type', )
);
echo $form->error($model,'images');
?>
<?php echo CHtml::submitButton('Save',array('name'=>'Files')); ?>
<?php $this->endWidget(); >
This is very simple way to create thumbnail images in yii framework
  • erum hannan

    how to save thumbnail image in yii ?

    • m bala

      In step 3, line number 19 “if($image->saveAs())” is used to save the uploaded image into particular path. Using this original image, we can create thumbnail image(See the below url to get the thumbnail class) and see the line number 31 createimage() will helpful to create thumb image using original image path

      http://demo.bsourcecode.com/yiiframework/files/thumbnail_images.phps

      • erum hannan

        my question is how can i save thumbnail image i am able to create thumbnail image but failed to save thumbnail in my specified folder

        • m bala

          May be folder permission problem please check that. Otherwise pls post your code

          • erum hannan

            can u please add code here how can i save Thumbnail image in desired folder

          • m bala

            public function actionCreate()

            {

            $model=new Files;

            if(isset($_POST[‘Files’]))

            {

            $filelist=CUploadedFile::getInstancesByName(‘fileurl’);

            if($filelist){

            foreach($filelist as $thefile)

            {

            $image=$thefile;

            $type=$thefile->extensionName;

            //127.0.0.1/myproject/simages/image12

            $destination=Yii::app()->basePath.”/../simages/$image”;

            //added jpg extension

            //127.0.0.1/myproject/simages/image12.jpg

            if($image->saveAs($destination.’.’.$type)){

            //create thumbail image using $destination original image path

            $obj_imgl = new thumbnail_images;

            // original image path

            $obj_imgl->PathImgOld = $destination.”.”.$type;

            // thumbnail image path

            $obj_imgl->PathImgNew = $destination.”_thumbiamge.”.$type;

            $obj_imgl->NewWidth = 150;

            if($height!=”){

            $obj_imgl->NewHeight = 150;

            }

            if (!$obj_imgl->create_thumbnail_images())

            echo “error”;

            }

            }

            }

            }

            $this->render(‘create’,array(‘model’=>$model,));

            }

  • witri

    i want to display image with this code. but, only the name of that image showing in my field maskapai.
    foreach ($ticket as $data) {
    echo ”;
    echo “$data[waktu_berangkat]”;
    echo “$data[waktu_tiba]”;
    echo “$data[maskapai]”; //this is the code to show image
    echo ”;
    }
    anyone can help me?
    Thankyou