Рассмотрим как сделать превью для картинки, используя несколько стандартных функций собранных в 1 класс. И как сохранить её в формате webp.

В реальности, превью могут использоваться в галлереи. Когда мы видим маленькие превью, при нажатии по которым отрывается большое полноразмерное фото.

Например, у нас есть изображение произвольного размера 1200 x 400 px (пикселей). И для этой картинки нужно сделать превью. Определимся, что хотим все превью размером 100 x 100 px.

Как сделать превью для картинки

Для этого сожмём изоражение и обрежем. Просто сжатия не достаточно, так как длина и ширина большого изображения не соответствуют превью.

Сжимаем по меньшей стороне. В данном случае это 400 px. У нас получается изображение размером 300 x 100 px.

Теперь обрезаем изображение. Можно просто вырезать квадрат сверху. То есть с координатами 0,0 — 100, 100. Но в таком случае будет видно только верхний левый угол.

Более хорошо будет смотреться, если вырезать квадрат из середины изображения. По координатам 100,0 — 200, 100.

Так работает класс PhotoEditor который ниже.

<?php

class PhotoEditor
{
    const JPEG = 'jpeg';
    const WEBP = 'webp';

    private function save($thumb, $output, $type)
    {
        if ($type === self::JPEG) {
            imagejpeg($thumb, $output, 60);
        }

        if ($type === self::WEBP) {
            imagewebp($thumb, $output, 60);
        }
    }

    private function resize($input, $output, $type)
    {
        $thumb_width = 120;
        $thumb_height = 120;

        list($width, $height) = getimagesize($input); // original size

        if ($width > $height) {
            $source_x = ($width - $height) / 2;
            $source_y = 0;
            $source_width = $height;
            $source_height = $height;
        } else {
            $source_x = 0;
            $source_y = ($height - $width) / 2;
            $source_width = $width;
            $source_height = $width;
        }

        $thumb = imagecreatetruecolor($thumb_width, $thumb_height);
        $source = imagecreatefromjpeg($input);

        imagecopyresampled($thumb, $source, 0, 0, $source_x, $source_y, $thumb_width, $thumb_height, $source_width, $source_height);

        $this->save($thumb, $output, $type);
    }

    private function convert($input, $output, $type)
    {
        list($width, $height) = getimagesize($input); // original size
        $path_info = pathinfo($input);
        $extension = $path_info['extension'] ?? '';

        $thumb = imagecreatetruecolor($width, $height);

        $source = '';

        if ($extension === 'jpg' || $extension === 'jpg') {
            $source = imagecreatefromjpeg($input);
        }

        if ($extension === 'png') {
            imagealphablending($thumb, false);
            imagesavealpha($thumb, true);
            $source = imagecreatefrompng($input);
        }

        if ($source !== '') {
            imagecopyresampled($thumb, $source, 0, 0, 0, 0, $width, $height, $width, $height);
        }

        $this->save($thumb, $output, $type);
    }

    public function resizeToJpeg($input, $output)
    {
        $this->resize($input, $output, self::JPEG);
    }

    public function resizeToWebp($input, $output)
    {
        $this->resize($input, $output, self::WEBP);
    }

    public function convertToWebp($input, $output)
    {
        $this->convert($input, $output, self::WEBP);
    }
}