Share
Har du noen gang ønsket en allsidig, enkel å bruke metode for å endre størrelse på bildene dine i PHP? Vel, det er det PHP-klassene er for - gjenbrukbare deler av funksjonalitet som vi kaller for å gjøre det skitne arbeidet bak kulissene. Vi skal lære å lage vår egen klasse som vil være godt konstruert, så vel som utvidbar. Endring av størrelse bør være enkelt. Hvor lett? Hva med tre trinn!
Før vi går inn i trinn-for-trinn-prosessen, la oss se på noen få premiumalternativer fra CodeCanyon. Det finnes dusinvis av skanne for å endre størrelsen på bildet og pluginene å velge mellom. Her er et raskt blikk på noen av dem.
Dette er en enkel PHP-klasse som endrer størrelsen på bildene i fly. Hvis du bruker en hvilken som helst PHP-aktivert webserver, og har noen form for bildeviser, er dette skriptet ideelt for deg. Den beholder alltid aspektforholdet, slik at bildet med stor størrelse holder sin form.
Image Resizer og Miniatyr CreatoranySize er et lett, drop-in, fullt automatisert, caching, make-you-coffee-and-serve-it-in-bed-skript som lar deg be om og generere bilder (jpg, gif eller png) av hvilken som helst størrelse.
anySize - Caching bilde resizerDenne Magento plugin lar deg sette maksimal bildebredde og høyde som kan lastes opp for katalogbildet. Det reduserer også filstørrelsen på katalogbildet. Det vil hjelpe deg med å redusere diskplassbruken ettersom bildene blir endret og komprimert.
Magento Image ResizeDenne PHP-klassen hjelper deg med å endre størrelsen på eventuelle bilder og lage ditt personlige vannmerke.
Image Resizer og vannmerke makerRezImage er et enkelt og fleksibelt verktøy for masseformatering, perfekt for webdesignere eller nettbutikkeiere. Med dette verktøyet kan du endre størrelsen på en hel mappe full av bilder, uansett hvor mange det er - bare last mappen med bildene, sett bredden og høyden og ingenting mer. Inkluderer noen forhåndsinnstillinger for oppløsning som VGA, HD, QXGA, QSXGA, etc ... men du kan også sette din egen.
RezImage - Justering av enkelt masseomforming For å gi deg et raskt innblikk i hva vi prøver å oppnå med vår klasse, skal klassen være:
Merk: Dette er ikke en veiledning om hvordan du lager klasser og objekter, og selv om denne ferdigheten vil hjelpe, er det ikke nødvendig for å følge denne opplæringen.
Det er mye å dekke - La oss begynne.
Vi begynner lett. I arbeidskatalogen opprett du to filer: en som heter index.php, den andre resize-class.php
For å gi deg en ide om hva vi prøver å oppnå, begynner vi ved å kode de samtalene vi skal bruke for å endre størrelsen på bildene. Åpne index.php-filen din og legg til følgende kode.
Som du kan se, er det en fin logikk på hva vi gjør. Vi åpner bildefilen, vi angir dimensjonene vi ønsker å endre størrelsen på bildet til, og typen resize.
Da lagrer vi bildet, velger det bildformatet vi ønsker og bildekvaliteten. Lagre og lukk index.php-filen din.
Accentsconagua
// *** Inkluder klassen inkluderer ("resize-class.php"); // *** 1) Initialiser / legg bildet $ resizeObj = ny resize ('sample.jpg'); // *** 2) Endre størrelsen på bildet (alternativer: eksakt, portrett, landskap, auto, beskjære) $ resizeObj -> resizeImage (150, 100, 'crop'); // *** 3) Lagre bilde $ resizeObj -> saveImage ('sample-resized.gif', 100); Fra koden ovenfor kan du se at vi åpner en jpg-fil, men lagrer et gif. Husk, det handler om fleksibilitet.
Det er Objektorientert Programmering (OOP) som gir denne følelsen av letthet mulig. Tenk på en klasse som et mønster; du kan inkapslere dataene - et annet jargongord som egentlig bare betyr å skjule dataene. Vi kan da gjenbruke denne klassen om og om igjen uten å måtte omskrive noen av resizing koden - du trenger bare å ringe de riktige metodene akkurat som vi gjorde i trinn to. Når vårt mønster er opprettet, lager vi forekomster av dette mønsteret, kalt objekter.
"Konstruktjonsfunksjonen, kjent som en konstruktør, er en spesialklassemetode som blir kalt av klassen når du oppretter en ny gjenstand."
La oss begynne å lage vår resize-klasse. Åpne din resize-class.php-fil. Nedenfor er en virkelig grunnleggende klasseskelettstruktur som jeg har kalt 'resize'. Legg merke til klassevariantkommentarlinjen; Dette er hvor vi begynner å legge til viktige klassevariabler senere.
Konstruksjonsfunksjonen, kjent som en konstruktør, er en spesialklassemetode (begrepet "metode" er det samme som funksjon, men når man snakker om klasser og objekter, benyttes termen metode ofte) som blir kalt av klassen når du oppretter et nytt objekt. Dette gjør det egnet for oss til å gjøre noen initialisering - som vi skal gjøre i neste trinn.
Klasse resize // *** Klassevariabler offentlig funksjon __construct ()
Merk som er a dobbelt understreke for konstruksjonsmetoden.
Vi skal endre konstruktormetoden ovenfor. For det første vil vi passere filnavnet (og banen) av bildet vårt for å bli endret. Vi kaller denne variabelen $ fileName.
Vi må åpne filen som er sendt inn med PHP (nærmere bestemt PHP GD-biblioteket), slik at PHP kan lese bildet. Vi gjør dette med den tilpassede metoden 'openImage'. Jeg kommer til hvordan denne metoden
fungerer i et øyeblikk, men for nå må vi lagre resultatet som en klassevariabel. En klassevariabel er bare en variabel - men den er spesifikk for den klassen. Husker du klassevariabelenes kommentar jeg tidligere nevnte? Legg til 'bilde' som en privat variabel ved å skrive 'privat $ image;'. Ved å sette variabelen som «Privat», setter du omfanget av den variabelen slik at den bare kan nås av klassen. Fra nå av kan vi ringe til vårt åpnede bilde, kjent som en ressurs, som vi skal gjøre senere når vi endrer størrelsen.
Mens vi er i det, la oss lagre bildet og dets høyde og bredde. Jeg har en følelse av at disse vil være nyttige senere.
Du bør nå ha følgende.
Klasse resize // *** Klassevariabler privat $ image; privat $ bredde; privat $ høyde; funksjon __construct ($ fileName) // *** Åpne filen $ this-> image = $ this-> openImage ($ fileName); // *** Få bredde og høyde $ this-> width = imagesx ($ this-> image); $ this-> height = imagesy ($ this-> bildet);
Metoder imagesx og imagesy er bygd i funksjoner som er en del av GD-biblioteket. De henter henholdsvis bredden og høyden på bildet ditt.
I det forrige trinnet kaller vi den egendefinerte metoden openImage. I dette trinnet skal vi lage den metoden. Vi vil at skriptet skal gjøre vår tenkning for oss, så avhengig av hvilken filtype som sendes inn, skal skriptet avgjøre hvilken GD Bibliotek-funksjon den ringer for å åpne bildet. Dette oppnås lett ved å sammenligne filtypen med en bryteretning.
Vi sender i filen vi ønsker å endre størrelse og returnere den filressursen.
privat funksjon openImage ($ file) // *** Få forlengelse $ extension = strtolower (strrchr ($ file, '.')); bytte ($ extension) case '.jpg': case '.jpeg': $ img = @imagecreatefromjpeg ($ file); gå i stykker; sak '.gif': $ img = @imagecreatefromgif ($ file); gå i stykker; case '.png': $ img = @imagecreatefrompng ($ fil); gå i stykker; standard: $ img = false; gå i stykker; returner $ img;
Det er her kjærligheten skjer. Dette trinnet er egentlig bare en forklaring på hva vi skal gjøre - så ingen lekser her. I neste trinn skal vi lage en offentlig metode som vi vil ringe for å utføre vår resize; så det er fornuftig å passere i bredde og høyde, samt informasjon om hvordan vi vil endre størrelsen på bildet. La oss snakke om dette et øyeblikk. Det vil være scenarier hvor du vil endre størrelsen på et bilde til en nøyaktig størrelse. Flott, la oss inkludere dette. Men det vil også være tidspunkter når du må endre størrelsen på hundrevis av bilder, og hvert bilde har et annet bildeforhold - tenk portrettbilder. Å endre størrelsen på disse til en eksakt størrelse vil føre til alvorlig forvrengning. Hvis vi tar en titt på våre alternativer for å forhindre forvrengning, kan vi:
Begge alternativene er levedyktige, avhengig av dine behov.
Jepp. Vi skal forsøke å håndtere alt ovenfor. For å gjenopprette skal vi gi alternativer til:
Det er to deler til resize-metoden. Den første får den optimale bredden og høyden for vårt nye bilde ved å lage noen tilpassede metoder - og selvfølgelig passere i resize-alternativet som beskrevet ovenfor. Bredden og høyden returneres som en matrise og settes til deres respektive variabler. Vær så snill å "passere som referanse" - men jeg er ikke en stor fan av det.
Den andre delen er hva som utfører den faktiske resize. For å holde denne opplæringsstørrelsen nede, lar jeg deg lese om følgende GD-funksjoner:
Vi lagrer også utdataene fra imagecreatetruecolor-metoden (et nytt sant fargebilde) som en klassevariabel. Legg til 'privat $ imageResized;' med de andre klassevariablene.
Endringsstørrelse utføres av en PHP-modul kjent som GD Bibliotek. Mange av metodene vi bruker, leveres av dette biblioteket.
// *** Legg til klassevariabler privat $ imageResized;
offentlig funksjon resizeImage ($ newWidth, $ newHeight, $ option = "auto") // *** Få optimal bredde og høyde - basert på $ option $ optionArray = $ this-> getDimensions ($ newWidth, $ newHeight, strtolower $ opsjon)); $ optimalWidth = $ optionArray ['optimalWidth']; $ optimalHeight = $ optionArray ['optimalHeight']; // *** Resample - skape bilde lerret av x, y størrelse $ this-> imageResized = imagecreatetruecolor ($ optimalWidth, $ optimalHeight); imagecopyresampled ($ this-> imageResized, $ this-> bilde, 0, 0, 0, 0, $ optimalWidth, $ optimalHight, $ this-> width, $ this-> height); // *** hvis alternativet er "beskjære", deretter beskjær også hvis ($ option == 'crop') $ this-> beskjære ($ optimalWidth, $ optimalHeight, $ newWidth, $ newHeight);
Jo mer arbeid du gjør nå, desto mindre må du gjøre når du endrer størrelsen. Denne metoden velger ruten å ta med, med sikte på å få den optimale størrelsen på bredde og høyde på basis av resjonsalternativet. Det kaller den riktige metoden, som vi skal skape i neste trinn.
privat funksjon getDimensions ($ newWidth, $ newHeight, $ option) switch ($ option) case 'exact': $ optimalWidth = $ newWidth; $ optimalHeight = $ newHeight; gå i stykker; saken 'portrett': $ optimalWidth = $ this-> getSizeByFixedHeight ($ newHeight); $ optimalHeight = $ newHeight; gå i stykker; sak 'landskap': $ optimalWidth = $ newWidth; $ optimalHeight = $ this-> getSizeByFixedWidth ($ newWidth); gå i stykker; case 'auto': $ optionArray = $ this-> getSizeByAuto ($ newWidth, $ newHeight); $ optimalWidth = $ optionArray ['optimalWidth']; $ optimalHeight = $ optionArray ['optimalHeight']; gå i stykker; case 'crop': $ optionArray = $ this-> getOptimalCrop ($ newWidth, $ newHight); $ optimalWidth = $ optionArray ['optimalWidth']; $ optimalHeight = $ optionArray ['optimalHeight']; gå i stykker; returordre ('optimalWidth' => $ optimalVidth, 'optimalHeight' => $ optimalHøyde); Vi har allerede diskutert hva disse fire metodene gjør. De er bare grunnleggende matte, virkelig, som beregner vår beste form.
privat funksjon getSizeByFixedHeight ($ newHeight) $ ratio = $ this-> width / $ this-> height; $ newWidth = $ newHeight * $ ratio; returnere $ newWidth; privat funksjon getSizeByFixedWidth ($ newWidth) $ ratio = $ this-> høyde / $ this-> bredde; $ newHeight = $ newWidth * $ ratio; returnere $ newHeight; privat funksjon getSizeByAuto ($ newWidth, $ newHeight) hvis ($ denne-> høyde < $this->bredde) // *** Bildet som skal endres, er bredere (landskap) $ optimalWidth = $ newWidth; $ optimalHeight = $ this-> getSizeByFixedWidth ($ newWidth); elseif ($ this-> height> $ this-> width) // *** Bildet som skal endres, er høyere (portrett) $ optimalWidth = $ this-> getSizeByFixedHeight ($ newHeight); $ optimalHeight = $ newHeight; annet // *** Bilde som skal resizert er en firkant if ($ newHeight < $newWidth) $optimalWidth = $newWidth; $optimalHeight= $this->getSizeByFixedWidth ($ newWidth); annet hvis ($ newHeight> $ newWidth) $ optimalWidth = $ this-> getSizeByFixedHeight ($ newHeight); $ optimalHeight = $ newHeight; ellers // *** Sqaure blir resizing til en firkant $ optimalWidth = $ newWidth; $ optimalHeight = $ newHeight; retur array ('optimalWidth' => $ optimalWidth, 'optimalHeight' => $ optimalHeight); privat funksjon getOptimalCrop ($ newWidth, $ newHeight) $ heightRatio = $ this-> height / $ newHeight; $ widthRatio = $ this-> width / $ newWidth; hvis ($ heightRatio < $widthRatio) $optimalRatio = $heightRatio; else $optimalRatio = $widthRatio; $optimalHeight = $this->høyde / $ optimalRatio; $ optimalWidth = $ this-> width / $ optimalRatio; returnere array ('optimalWidth' => $ optimalWidth, 'optimalHeight' => $ optimalHeight); Hvis du har valgt for en avling - det vil si, du har brukt beskjæringsalternativet, har du ett nytt lite skritt. Vi skal beskjære bildet fra
senter. Beskjæring er en veldig lignende prosess for å endre størrelse, men med et par større størrelsesparametre passert inn.
Private Function crop ($ optimalWidth, $ optimalHeight, $ newWidth, $ newHeight) // *** Finn sentrum - dette vil bli brukt til avlingen $ cropStartX = ($ optimalWidth / 2) - ($ newWidth / 2); $ cropStartY = ($ optimalHeight / 2) - ($ newHeight / 2); $ crop = $ this-> imageResized; // imagedestroy ($ dette-> imageResized); // *** Nå beskjære fra sentrum til eksakt ønsket størrelse $ this-> imageResized = imagecreatetruecolor ($ newWidth, $ newHeight); imagecopyresampled ($ this-> imageResized, $ crop, 0, 0, $ cropStartX, $ cropStartY, $ newWidth, $ newHeight, $ newWidth, $ newHeight);
Vi kommer dit; nesten ferdig. Det er nå på tide å lagre bildet. Vi passerer i banen, og bildekvaliteten vi ønsker å variere fra 0-100, 100 er den beste og kaller den riktige metoden. Et par ting å merke seg om bildekvaliteten: JPG bruker en skala fra 0-100, 100 er den beste. GIF-bilder har ingen innstilling for bildekvalitet. PNGs gjør, men de bruker skalaen 0-9, 0 er den beste. Dette er ikke bra da vi ikke kan forvente oss å huske dette hver gang vi vil lagre et bilde. Vi gjør litt magi for å standardisere alt.
offentlig funksjon saveImage ($ savePath, $ imageQuality = "100") // *** Få forlengelse $ extension = strrchr ($ savePath, '.'); $ extension = strtolower ($ extension); bytte ($ extension) case '.jpg': case '.jpeg': if (imagetypes () & IMG_JPG) imagejpeg ($ this-> imageResized, $ savePath, $ imageQuality); gå i stykker; case '.gif': if (imagetypes () & IMG_GIF) imagegif ($ this-> imageResized, $ savePath); gå i stykker; case '.png': // *** Skala kvalitet fra 0-100 til 0-9 $ scaleQuality = round (($ imageQuality / 100) * 9); // *** Omvendt kvalitetsinnstilling som 0 er best, ikke 9 $ invertScaleQuality = 9 - $ scaleQuality; hvis (imagetypes () & IMG_PNG) imagepng ($ this-> imageResized, $ savePath, $ invertScaleQuality); gå i stykker; // ... etc standard: // *** Ingen utvidelse - Ingen lagre. gå i stykker; imagedestroy ($ this-> imageResized);
Nå er det også en god tid å ødelegge vår bilderessurs for å frigjøre noe minne. Hvis du skulle bruke dette i produksjon, kan det også være lurt å fange opp og returnere resultatet av det lagrede bildet.
Vel det er det, folkens. Takk for at du fulgte denne opplæringen, håper jeg du finner det nyttig. Jeg vil sette pris på tilbakemeldingen din, via kommentarene nedenfor.
