Muuta kuvan kokoa PHP: ssä Intervention Image Library -sovelluksella
Etsitkö kuinka muuttaa kuvien kokoa PHP: ssä? Työskennellessämme verkkosovelluksessa meidän on luotava erilaiset pienoiskuvat alkuperäisestä kuvasta. Pikkukuva on alkuperäisen kuvan koonmuutettu versio. Tässä artikkelissa tutkitaan, kuinka kuvia voidaan ladata ja muuttaa PHP: ssä.
Miksi kuvien kokoa tulisi muuttaa?
Sivustolla on useita skenaarioita, joissa meidän on näytettävä lyhyt versio suuresta kuvasta. Suosittu esimerkki on Kuvagalleria. Galleriassa käytimme näyttämään luettelon pienistä kuvista. Kun käyttäjä napsauttaa pientä kuvaa, se avaa suuren kuvan ponnahdusikkunassa. Toinen esimerkki on aiheeseen liittyvien artikkeleiden näyttäminen, joissa näytetään pieniä kuvia sekä viestin otsikko ja kuvaus.
Näissä tilanteissa meidän on luotava pieni kuva (pikkukuva) alkuperäistä kuvaa käyttämällä. Pieni pikkukuva pienentää sivujen kokoa. Koska käytät pientä pikkukuvaa, selain vaatii pienen kaistanleveyden kuvan lataamiseen. Se lisää joitain etuja verkkosivustolle. Jotkut niistä ovat:
- Parantaa palvelimen suorituskykyä
- Pienennä kaistanleveyttä
- Paranna sivunopeutta
Tästä huolimatta katsotaanpa, kuinka kuvan kokoa muutetaan PHP: ssä.
Päästä alkuun
Intervention Image on avoimen lähdekoodin kirjasto, joka toimii kuvan koonmuutostyökaluna. Konepellin alla Intervention Image käyttää GD-kirjastoa ja Imagickia kuvankäsittelyyn ja manipulointiin.
Aloittamiseksi sinun on asennettava Intervention Image -kirjasto sovellukseesi. Suosittelen Composerin käyttöä kirjaston asennukseen.
Avaa pääte projektin juurihakemistossa ja suorita alla oleva komento.
composer require intervention/imageKun olet asentanut kirjaston, sinun on sisällytettävä sen ympäristö sovellukseesi. Lisää tätä varten kahden rivin alapuolelle PHP-tiedosto.
<?php
// include composer autoload
require 'vendor/autoload.php';
use InterventionImageImageManagerStatic as Image;Kuvan lataamiseksi ja koon muuttamiseksi tarvitsemme lomakkeen, jossa voi selata kuvaa ja painaa Lähetä-painiketta. Käytä alla olevaa HTML-koodia, joka sisältää tiedostosyötön ja lähetyspainikkeen.
<form method="post" enctype="multipart/form-data">
<p><input type="file" name="image" /></p>
<input type="submit" name="submit" value="Submit">
</form>Muuta kuvan kokoa PHP: ssä Intervention Image -sovelluksella
Olemme asentaneet kirjaston ja luoneet lomakkeen. Seuraavaksi meidän on ladattava ja muutettava kuvan koko lennossa. Aion luoda kaksi hakemistoa uploadsja thumbnails. Vuonna uploadskansio, säilytämme alkuperäisen kuvan. Kuvan pikkukuva tallennetaan thumbnailshakemistoon.
Käytä alla olevaa koodia, joka tallentaa kuvan alkuperäisen ja pikkukuvan version hakemistoon uploadsja thumbnailshakemistoon.
<?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);
}
}Yllä olevassa koodissa läpäisin leveyden 300 ja muutoin kuvan kokoa säilyttämällä niiden kuvasuhde. Voit välittää leveysarvon vaatimuksesi mukaan. Kuvasuhteen säilyttämistä suositellaan kuvan kokoa muutettaessa. Kuvasuhdetta käytettäessä kuva ei veny. Jos etsit kovaa satoa, korvaa sitten alla olevat rivit
$img->resize(300, null, function ($constraint) {
$constraint->aspectRatio();
});Kanssa
$img->resize(300, 150)->save($thumbnailpath);Johtopäätös
Tässä opetusohjelmassa tutkittiin, kuinka kuvien kokoa muutetaan säilyttämällä niiden kuvasuhde. Kirjoitimme myös koodin, joka rajaa kuvan kovasti. Intervention Image -kirjasto tarjoaa muutama vaihtoehto lisää resizemenetelmää. Voit lukea lisää heidän dokumentoinnistaan.