Змінення розміру зображення в PHP за допомогою інтервенційної бібліотеки зображень

Шукаєте, як змінити розмір зображень у PHP? Під час роботи над веб-додатком нам потрібно створити різні версії ескізів оригінального зображення. Ескіз – це змінена версія оригінального зображення. У цій статті ми вивчаємо, як завантажувати та змінювати розмір зображень у PHP.

Чому ми повинні змінювати розмір зображень?

На веб-сайті є кілька сценаріїв, коли нам потрібно відобразити коротку версію великого зображення. Популярним прикладом є Галерея зображень. У галереї ми звикли відображати список невеликих зображень. Коли користувач натискає на маленьке зображення, воно відкриває велике зображення у спливаючому вікні. Інший приклад – показ відповідних статей, де ми показуємо невеликі зображення разом із заголовком та описом публікації.

У цих сценаріях нам потрібно створити невелике зображення (ескіз), використовуючи наше оригінальне зображення. Маленька мініатюра зменшує розмір ваших сторінок. Оскільки ви використовуєте маленьку мініатюру, браузер вимагає низької пропускної здатності для завантаження зображення. Це додасть веб-сайту певні переваги. Деякі з них:

• Покращує продуктивність сервера
• Зменшіть пропускну здатність
• Покращення швидкості сторінки

З огляду на це, давайте подивимося, як змінити розмір зображення в PHP.

Починаємо

Intervention Image – це бібліотека з відкритим кодом, яка виконує функцію інструмента зміни розміру зображення. Під капотом Intervention Image використовує GD Library та Imagick для обробки зображень та маніпуляцій.

Для початку вам потрібно встановити у вашу програму бібліотеку Intervention Image. Я рекомендую використовувати Composer для встановлення бібліотеки.

Відкрийте термінал у кореневому каталозі проекту та запустіть команду нижче.

composer require intervention/image

Після встановлення бібліотеки вам потрібно включити її середовище у свою програму. Для цього включіть нижче два рядки до файлу PHP.

<?php
// include composer autoload
require 'vendor/autoload.php';
  
use InterventionImageImageManagerStatic as Image;

Для того, щоб завантажити та змінити розмір зображення, нам потрібна форма, де можна переглянути зображення та натиснути кнопку «Відправити». Використовуйте наведений нижче HTML, який містить введення файлу та кнопку подання.

<form method="post" enctype="multipart/form-data">
    <p><input type="file" name="image" /></p>
    <input type="submit" name="submit" value="Submit">
</form>

Змінити розмір зображення в PHP за допомогою інтервенційного зображення

Ми встановили бібліотеку та створили форму. Далі ми маємо завантажувати та змінювати розмір зображення на льоту. Я збираюся створити два каталоги uploadsі thumbnails. У uploadsпапці ми збережемо оригінальне зображення. Ескізна версія зображення зберігатиметься в thumbnailsкаталозі.

Скористайтеся наведеним нижче кодом, який зберігатиме оригінал та ескіз зображення у каталогах uploadsі, thumbnailsвідповідно.

<?php
require 'vendor/autoload.php';
  
use InterventionImageImageManagerStatic as Image;
 
$allowed_mime_type = array('image/jpg', 'image/jpeg', 'image/png', 'image/gif');
 
if (isset($_POST['submit'])) {
 
    if (in_array($_FILES['image']['type'], $allowed_mime_type)) {
 
        if (!file_exists('uploads')) {
            mkdir('uploads', 0755);
        }
 
        $filename = time().'_'.$_FILES['image']['name'];
        $filepath = 'uploads/'. $filename;
        move_uploaded_file($_FILES['image']['tmp_name'], $filepath);
 
        if (!file_exists('uploads/thumbnails')) {
            mkdir('uploads/thumbnails', 0755);
        }
 
        $thumbnailpath = 'uploads/thumbnails/'. $filename;
        $img = Image::make($filepath);
        $img->resize(300, null, function ($constraint) {
            $constraint->aspectRatio();
        });
        $img->save($thumbnailpath);
    }
}

У наведеному вище коді я передав ширину як 300 та змінив розмір зображення, підтримуючи їх пропорції. Ви можете передати значення ширини відповідно до ваших вимог. Під час зміни розміру зображення рекомендується дотримувати пропорції. Використовуючи співвідношення сторін, зображення не розтягується. Однак, якщо ви шукаєте твердий урожай, замініть наведені нижче рядки

$img->resize(300, null, function ($constraint) {
    $constraint->aspectRatio();
});

С

$img->resize(300, 150)->save($thumbnailpath);

Висновок

У цьому посібнику ми вивчали, як змінювати розмір зображень, підтримуючи їх пропорції. Ми також написали код, який важко обріже зображення. Бібліотека зображень Intervention надає ще кілька варіантів resizeметоду. Ви можете прочитати більше про це в їх документації.

Пов’язані статті

• Змініть розмір зображення в Laravel за допомогою інтервенційної бібліотеки зображень
• Змінити розмір зображення в PHP за допомогою TinyPNG
• Перетягніть завантаження файлів за допомогою JavaScript та PHP