A PHP Image manipulation plug-in, Intervention Image, is recommended

Whether the Web front end, or APP development, can not avoid dealing with image processing, for the front end, image processing is easy to say, but also relatively simple.

But the application background, or interface, after all, the main job is to process data, image processing is less, but now the background processing image features, also will more and more, such as in the public, to achieve specific posters generating function, then you need to fan the user’s head and nicknames embedded to fixed on the picture, make posters, sharing circle of friends, Play a propaganda role.

So today I recommend the Intervention Image plug-in to PHP engineers.

Intervention Image

Intervention/ Image is a customized image manipulation tool for Laravel that provides an easy-to-express way to create and edit images.

Intervention Image is an open source PHP image handling and manipulation library. It provides an easier and expressive way to create, edit, and compose images and supports currently the two most common image processing libraries GD Library and Imagick.

The class is written to make PHP image manipulating easier and more expressive. No matter if you want to create image thumbnails, watermarks or format large image files Intervention Image helps you to manage every task in an easy way with as little lines of code as possible.

The library follows the FIG standard PSR-2 to ensure a high level of interoperability between shared PHP code and is fully unit-tested.

Image. Intervention. IO /

Install the Intervention Image

This article introduces the basic use of the Intervention Image in combination with the Laravel project, so using Composer to install the Intervention Image is the most suitable. The Intervention Image website also recommends using Composer for installation.

Phar requires intervention/imageCopy the code

How to install Composer that can be seen in my previous article

D.laravel-china.org/docs/5.5/in…

Laravel configuration

Add provider to the $providers array in the config/app.php configuration file:

Intervention\Image\ImageServiceProvider::classCopy the code

Add the corresponding aliase to the $aliases array:

'Image' => Intervention\Image\Facades\Image::classCopy the code

To configure the Image Driver, you only need to modify the Image Driver in the config/image.php configuration file. You only need to run the corresponding command to generate the configuration file:

php artisan vendor:publish --provider="Intervention\Image\ImageServiceProviderLaravel5"Copy the code

The configuration file is as follows:

<? phpreturn array(

    /*
    |--------------------------------------------------------------------------
    | Image Driver
    |--------------------------------------------------------------------------
    |
    | Intervention Image supports "GD Library" and "Imagick" to process images
    | internally. You may choose one of them according to your PHP
    | configuration. By default PHP's "GD Library" implementation is used. | | Supported: "gd", "imagick" | */ 'driver'= >'gd');Copy the code

If you want to change the Imagick driver, just change the driver value.

Start the journey of image processing

Route::get('/yemeishu/{value}'.function ($value) {

    $img = Image::make(base_path().'/***/background0.jpeg');

    return $img->response('jpeg');
});Copy the code

In this way, we can directly output the image, of course we can add a paragraph on the image: “I like Laravel”, and output: 600*800 size.

Route::get('/yemeishu/{value}'.function ($value) {

    $img = Image::make(base_path().'/***/background0.jpeg')->resize(600, 800);

    $img->text('I like Laravel.', 120, 220, function ($font) {

        $font->file(base_path().'/***/font1.ttf');

        $font->size(32);

        $font->valign('bottom');

        $font->color('# 333333');
    });

    return $img->response('jpeg');
});Copy the code

Then we put a “QR code image” on top, which is a URL link:

Route::get('/yemeishu/{value}'.function ($value) {
    $img = Image::make(base_path().'/public/***/background0.jpeg')->resize(600, 800);

    $img->text('I like Laravel.', 120, 220, function ($font) {
        $font->file(base_path().'/***/font1.ttf');
        $font->size(32);
        $font->valign('bottom');
        $font->color('# 333333'); }); // Get the remote image$erweimaimage = Image::make('http://ow20g4tgj.bkt.clouddn.com/2017-11-11-15103969491817.jpg')->resize(200, 200); // Insert at the bottom, 50 below$img->insert($erweimaimage.'bottom', 0, 50);

    return $img->response('jpeg');
});Copy the code

So it’s kind of like a poster.

Let’s move on to the juicy one. In the actual generation, our posters are mainly designed by designers, and then the developers cut the diagram and implement it into specific functions.

Directly on the code:

public function getBookImageMaker($book.$share.$xcxurl) {
        $background = [
            base_path().'/public/***/background0.jpeg',
            base_path().'/public/***/background1.jpeg',
            base_path().'/public/***/background2.jpeg'
        ];

        $font_paths =  [base_path().'/***/font0.ttf',
            base_path().'/***/font1.ttf'];

        $font_path = $font_paths[rand(0, 1)];
        $img = Image::make($background[rand (0, 2)]) - > resize (640, 1000);$face_img = Image::make($share['face_img']) ->resize(60, 60); // Add head to head$img->insert(
            $face_img.'top-left', 55, 76); // Add a nickname to the header$img->text($share['nickname'].'For you', 131, 120, function ($font) use ($font_path) {
            $font->file($font_path);
            $font->size(32);
            $font->valign('bottom');
            $font->color('# 333333'); }); // Book images area$bodyimage = Image::canvas(533, 475, '#fe7e86');

        $goodsimage = Image::make($book['goods_img'])
            ->resize(531, 309);

        $bodyimage->insert($goodsimage.'top-left', 1, 1);

        $bodybuttomimage = Image::canvas(531, 164, '#fff');

        $strings =  $this->mbStrSplit($book['name'], 18);

        $i = 0; //top position of string
        if (count($strings) = = 1) {$bodybuttomimage->text($strings[0], 17, 44, function ($font) use ($font_path) {
                $font->file($font_path);
                $font->size(30);
                $font->valign('top');
                $font->color('# 333333');
            });
        } else {
            foreach($strings as $key= >$string) {
                if ($key= = 2) {break; } // Header section$bodybuttomimage->text($string, 17, 16 + $i.function ($font) use ($font_path) {
                    $font->file($font_path);
                    $font->size(27);
                    $font->valign('top');
                    $font->color('# 333333');
                });
                $i = $i + 43; //shiftTop postition down 42}} //if ($book['orig_price']) {
            $price = $book['orig_price'];
        } else {
            $price = $book['price'];
        }
        $bodybuttomimage->text('Original price:'.$price, 17, 118, function ($font) use ($font_path) {
            $font->file($font_path);
            $font->size(24);
            $font->valign('top');
            $font->color('#a3a3a3');
        });

        if ($book['group'] && $book['group'] ['endtime'] > date("Y-m-d H:i:s")) {
            $xianjiaString = Group purchase price:;
            $xianPrice = $book['group'] ['price'];

            $tuanButton = Image::canvas(107, 33, '#ff0000');

            $tuanButton->text($book['group'] ['min_quantity'].'and one', 22, 6, function ($font) use ($font_path) {
                $font->file($font_path);
                $font->size(25);
                $font->align('left');
                $font->valign('top');
                $font->color('#fff');
            });

            $bodybuttomimage->insert($tuanButton.'top-right', 30, 110);
        } else {
            $xianjiaString = 'Current price:';
            $xianPrice = $book['price'];
        }

        $bodybuttomimage->text($xianjiaString, 180, 118, function ($font) use ($font_path) {
            $font->file($font_path);
            $font->size(24);
            $font->valign('top');
            $font->color('# 333333');
        });

        $bodybuttomimage->text(A '$'.$xianPrice, 270, 118, function ($font) use ($font_path) {
            $font->file($font_path);
            $font->size(27);
            $font->valign('top');
            $font->color('#fe0000');
        });
        $bodyimage->insert($bodybuttomimage.'top-left', 1, 310);
        $img->insert($bodyimage.'top-left', 55, 154); // Bottom part of the QR code$dibuimage= Image: : canvas (596308);$codeimage = Image::make(base_path().'/public/img/maker/1/codeborder.jpeg')->resize(255, 255);
        $codesourceimage = Image::make($xcxurl)
            ->resize(249, 249);
        $codeimage->insert($codesourceimage.'top-left', 3, 3);

        $dibuimage->insert($codeimage.'top-left', 33, 23);

        $dibuimage->text('Long press to identify small code', 300, 110, function ($font) use ($font_path) {
            $font->file($font_path);
            $font->size(27);
            $font->valign('top');
            $font->color('# 333333');
        });

        $dibuimage->text('Snap it up now! ', 370, 150, function ($font) use ($font_path) {
            $font->file($font_path);
            $font->size(27);
            $font->valign('top');
            $font->color('# 333333');
        });

        $img->insert($dibuimage.'top-left', 22, 650);

        return $img;
    }Copy the code

The final product is as follows:

As for the function of the above code, please refer to the official website API description:

image.intervention.io/

conclusion

Now a variety of e-commerce, content application platforms, all kinds of public publicity will use “posters”, how to make a variety of personalized label embedded posters in the background interface, should be a new need. This article recommends the Intervention Image plug-in.

Recommended reading

1. Recommend a PHP web request plugin Guzzle mp.weixin.qq.com/s/w2I8hUmHu…

2. Recommend a Laravel admin backstage management plug-in mp.weixin.qq.com/s/PnAj0j2X3…

“Finished”

Coding01 looks forward to your continued attention

And thank you for seeing this