Share
Vous avez toujours voulu utiliser une méthode conviviale et simple d'utilisation pour redimensionner vos images en PHP? Eh bien, c’est à cela que servent les classes PHP: des fonctionnalités réutilisables que nous appelons pour effectuer le sale boulot en arrière-plan. Nous allons apprendre à créer notre propre classe, qui sera bien construite et extensible. Le redimensionnement devrait être facile. Comme c'est facile? Que diriez-vous de trois étapes!
Avant de passer à la procédure étape par étape, examinons quelques options premium de CodeCanyon. Il existe des dizaines de scripts de redimensionnement d'images et de plugins parmi lesquels choisir. Voici un aperçu rapide de certains d'entre eux..
C'est une classe PHP simple qui redimensionne les images à la volée. Si vous utilisez un serveur Web prenant en charge PHP et que vous avez une visionneuse d'images, ce script est idéal pour vous. Il conserve toujours les proportions, donc l'image redimensionnée conserve sa forme.
Image Resizer Et Thumbnail CreatoranySize est un script léger, instantané, entièrement automatisé, de mise en cache, de préparation et de préparation de café qui vous permet de demander et de générer des images (jpg, gif ou png) de toutes tailles..
anySize - Caching Resizer ImageCe plugin Magento vous permet de définir la largeur et la hauteur maximales de l'image pouvant être téléchargées pour l'image du catalogue. Cela réduit également la taille du fichier de l'image du catalogue. Cela vous aidera à réduire votre utilisation de l'espace disque car les images seront redimensionnées et compressées..
Magento Image RedimensionnerCette classe PHP vous aide à redimensionner des photos et à créer votre filigrane personnel.
Image Resizer Et filigrane MakerRezImage est un outil de redimensionnement d’images en vrac simple et flexible, idéal pour les concepteurs Web ou les propriétaires de boutique en ligne. Cet outil vous permet de redimensionner tout un dossier contenant des images, peu importe leur nombre. Il vous suffit de charger le dossier avec les images, de définir la largeur et la hauteur, sans plus. Inclut des préréglages de résolution tels que VGA, HD, QXGA, QSXGA, etc., mais vous pouvez également définir vos propres.
RezImage - Redimensionnement facile de l'image en vrac Pour vous donner un aperçu de ce que nous essayons de faire avec notre classe, la classe devrait être:
Remarque: il ne s'agit pas d'un didacticiel expliquant comment créer des classes et des objets. Bien que cette compétence puisse vous aider, il n'est pas nécessaire de suivre ce didacticiel..
Il y a beaucoup à couvrir - Commençons.
Nous allons commencer facilement. Dans votre répertoire de travail, créez deux fichiers: l’un appelé index.php, l’autre resize-class.php
Pour vous donner une idée de ce que nous essayons de faire, commençons par coder les appels que nous utiliserons pour redimensionner les images. Ouvrez votre fichier index.php et ajoutez le code suivant.
Comme vous pouvez le constater, il existe une bonne logique dans ce que nous faisons. Nous ouvrons le fichier image, nous définissons les dimensions pour lesquelles nous voulons redimensionner l'image et le type de redimensionnement..
Ensuite, nous sauvegardons l'image en choisissant le format d'image souhaité et la qualité de l'image. Enregistrez et fermez votre fichier index.php.
Accentsconagua
// *** Inclure la classe include ("resize-class.php"); // *** 1) Initialiser / charger l'image $ resizeObj = new resize ('sample.jpg'); // *** 2) Redimensionner l'image (options: exact, portrait, paysage, auto, recadrer) $ resizeObj -> resizeImage (150, 100, 'recadrer'); // *** 3) Enregistrer l'image $ resizeObj -> saveImage ('sample-resized.gif', 100); Dans le code ci-dessus, vous pouvez voir que nous ouvrons un fichier jpg mais enregistrons un gif. Rappelez-vous, tout est une question de flexibilité.
C'est la programmation orientée objet (OOP) qui rend ce sentiment de facilité possible. Pensez à une classe comme un modèle; vous pouvez encapsuler les données - un autre terme de jargon qui signifie simplement cacher les données. Nous pouvons ensuite réutiliser cette classe à plusieurs reprises sans avoir besoin de réécrire le code de redimensionnement; il vous suffit d'appeler les méthodes appropriées, comme nous l'avons fait à l'étape deux. Une fois notre modèle créé, nous créons des instances de ce modèle, appelées objets..
"La fonction de construction, appelée constructeur, est une méthode de classe spéciale appelée par la classe lorsque vous créez un nouvel objet."
Commençons par créer notre classe de redimensionnement. Ouvrez votre fichier resize-class.php. Ci-dessous, une structure de squelette de classe vraiment basique que j'ai nommée 'redimensionner'. Notez la ligne de commentaire de la variable de classe; c'est où nous allons commencer à ajouter nos variables de classe importantes plus tard.
La fonction de construction, appelée constructeur, est une méthode de classe spéciale (le terme "méthode" est identique à fonction, mais lorsque vous parlez de classes et d'objets, le terme méthode est souvent utilisé) qui est appelé par la classe lors de la création. un nouvel objet. Cela nous permet de faire une initialisation - ce que nous ferons à la prochaine étape.
Classe resize // *** Variables de classe fonction publique __construct ()
Notez que c'est un double trait de soulignement pour la méthode de construction.
Nous allons modifier la méthode constructeur ci-dessus. Tout d'abord, nous allons passer le nom de fichier (et le chemin) de notre image à redimensionner. Nous appellerons cette variable $ NomFichier.
Nous devons ouvrir le fichier transmis avec PHP (plus précisément la bibliothèque PHP GD) pour que PHP puisse lire l'image. Nous faisons cela avec la méthode personnalisée 'openImage'. Je vais arriver à comment cette méthode
fonctionne dans un instant, mais pour le moment, nous devons enregistrer le résultat en tant que variable de classe. Une variable de classe est juste une variable, mais elle est spécifique à cette classe. Rappelez-vous le commentaire de variable de classe que j'ai mentionné précédemment? Ajoutez 'image' en tant que variable privée en tapant 'private $ image;'. En définissant la variable sur 'Private', vous définissez la portée de cette variable afin que seule la classe puisse y accéder. À partir de maintenant, nous pouvons appeler notre image ouverte, appelée ressource, ce que nous ferons ultérieurement lorsque nous redimensionnons.
Pendant que nous y sommes, stockons la hauteur et la largeur de l'image. J'ai le sentiment que cela sera utile plus tard.
Vous devriez maintenant avoir le suivant.
Classe redimensionner // *** Variables de classe private $ image; private $ width; hauteur privée $; function __construct ($ fileName) // *** Ouvrez le fichier $ this-> image = $ this-> openImage ($ fileName); // *** Récupère la largeur et la hauteur $ this-> width = imagesx ($ this-> image); $ this-> height = imagesy ($ this-> image);
Méthodes imagesx et imagesy sont des fonctions intégrées à la bibliothèque GD. Ils récupèrent la largeur et la hauteur de votre image, respectivement.
Dans l'étape précédente, nous appelons la méthode personnalisée openImage. Dans cette étape, nous allons créer cette méthode. Nous voulons que le script réfléchisse à notre place. Par conséquent, en fonction du type de fichier transmis, le script doit déterminer la fonction de la bibliothèque GD qu'il appelle pour ouvrir l'image. Ceci est facilement réalisé en comparant l’extension de fichiers avec une instruction switch.
Nous passons dans notre fichier que nous voulons redimensionner et renvoyer cette ressource de fichiers.
fonction privée openImage ($ file) // *** Obtenir l'extension $ extension = strtolower (strrchr ($ file, '.')); switch ($ extension) case '.jpg': case '.jpeg': $ img = @imagecreatefromjpeg ($ fichier); Pause; case '.gif': $ img = @imagecreatefromgif ($ fichier); Pause; case '.png': $ img = @imagecreatefrompng ($ fichier); Pause; défaut: $ img = false; Pause; return $ img;
C'est là que l'amour se passe. Cette étape n’est en réalité qu’une explication de ce que nous allons faire. Dans la prochaine étape, nous allons créer une méthode publique que nous appellerons pour effectuer notre redimensionnement. il est donc logique de spécifier la largeur et la hauteur, ainsi que des informations sur la manière dont nous souhaitons redimensionner l'image. Parlons de cela un instant. Il y aura des scénarios dans lesquels vous voudriez redimensionner une image à une taille exacte. Super, incluons ceci. Mais il y aura aussi des moments où vous devrez redimensionner des centaines d'images et où chaque image a un rapport de format différent - pensez aux images en portrait. Le redimensionnement de celles-ci à une taille exacte entraînera une distorsion importante. Si nous examinons nos options pour éviter la distorsion, nous pouvons:
Les deux options sont viables, selon vos besoins.
Oui. nous allons essayer de gérer tout ce qui précède. Pour récapituler, nous allons proposer des options pour:
La méthode de redimensionnement comporte deux parties. La première consiste à obtenir des largeurs et des hauteurs optimales pour notre nouvelle image en créant des méthodes personnalisées - et bien sûr en passant notre option de redimensionnement comme décrit ci-dessus. La largeur et la hauteur sont renvoyées sous forme de tableau et définies pour leurs variables respectives. Ne hésitez pas à «passer comme référence», mais je ne suis pas un grand fan de cela.
La deuxième partie est ce qui effectue le redimensionnement réel. Afin de réduire la taille de ce tutoriel, je vous laisse lire les fonctions suivantes de GD:
Nous enregistrons également la sortie de la méthode imagecreatetruecolor (une nouvelle image en vraies couleurs) en tant que variable de classe. Ajoutez 'private $ imageResized;' avec vos autres variables de classe.
Le redimensionnement est effectué par un module PHP appelé bibliothèque GD. Beaucoup des méthodes que nous utilisons sont fournies par cette bibliothèque.
// *** Ajouter à la classe les variables private $ imageResized;
fonction publique resizeImage ($ newWidth, $ newHeight, $ option = "auto") // *** Obtenir la largeur et la hauteur optimales - en fonction de $ option $ optionArray = $ this-> getDimensions ($ newWidth, $ newHeight, strtolower ( $ option)); $ optimalWidth = $ optionArray ['optimalWidth']; $ optimalHeight = $ optionArray ['optimalHeight']; // *** Rééchantillonnage - crée un canevas d'image de taille x, y $ ceci-> imageResized = imagecreatetruecolor ($ optimalWidth, $ optimalHeight); imagecopyresampled ($ this-> imageResized, $ this-> image, 0, 0, 0, 0, $ optimalWidth, $ optimalHeight, $ this-> width, $ this-> height); // *** si l'option est 'crop', alors aussi crop si ($ option == 'crop') $ this-> crop ($ optimalWidth, $ optimalHeight, $ newWidth, $ newHeight);
Plus vous travaillez maintenant, moins vous avez à faire lorsque vous redimensionnez. Cette méthode choisit la route à suivre, avec pour objectif d'obtenir la largeur et la hauteur de redimensionnement optimales en fonction de votre option de redimensionnement. Il appellera la méthode appropriée, que nous allons créer à l'étape suivante..
fonction privée getDimensions ($ newWidth, $ newHeight, $ option) switch ($ option) case 'exact': $ optimalWidth = $ newWidth; $ optimalHeight = $ newHeight; Pause; case 'portrait': $ optimalWidth = $ this-> getSizeByFixedHeight ($ newHeight); $ optimalHeight = $ newHeight; Pause; cas 'paysage': $ optimalWidth = $ newWidth; $ optimalHeight = $ this-> getSizeByFixedWidth ($ newWidth); Pause; case 'auto': $ optionArray = $ this-> getSizeByAuto ($ newWidth, $ newHeight); $ optimalWidth = $ optionArray ['optimalWidth']; $ optimalHeight = $ optionArray ['optimalHeight']; Pause; case 'crop': $ optionArray = $ this-> getOptimalCrop ($ newWidth, $ newHeight); $ optimalWidth = $ optionArray ['optimalWidth']; $ optimalHeight = $ optionArray ['optimalHeight']; Pause; return array ('optimalWidth' => $ optimalWidth, 'optimalHeight' => $ optimalHeight); Nous avons déjà discuté de ce que font ces quatre méthodes. Ce ne sont que des mathématiques de base, vraiment, qui calculent notre meilleur ajustement.
fonction privée getSizeByFixedHeight ($ newHeight) $ ratio = $ this-> width / $ this-> height; $ newWidth = $ newHeight * $ ratio; return $ newWidth; fonction privée getSizeByFixedWidth ($ newWidth) $ ratio = $ this-> height / $ this-> width; $ newHeight = $ newWidth * $ ratio; return $ newHeight; fonction privée getSizeByAuto ($ newWidth, $ newHeight) if ($ this-> height < $this->width) // *** L'image à redimensionner est plus large (paysage) $ optimalWidth = $ newWidth; $ optimalHeight = $ this-> getSizeByFixedWidth ($ newWidth); elseif ($ this-> height> $ this-> width) // *** L'image à redimensionner est plus grande (portrait) $ optimalWidth = $ this-> getSizeByFixedHeight ($ newHeight); $ optimalHeight = $ newHeight; else // *** L'image à resizerd est un carré if ($ newHeight < $newWidth) $optimalWidth = $newWidth; $optimalHeight= $this->getSizeByFixedWidth ($ newWidth); else if ($ newHeight> $ newWidth) $ optimalWidth = $ this-> getSizeByFixedHeight ($ newHeight); $ optimalHeight = $ newHeight; else // *** Sqaure en cours de redimensionnement au carré $ optimalWidth = $ newWidth; $ optimalHeight = $ newHeight; return array ('optimalWidth' => $ optimalWidth, 'optimalHeight' => $ optimalHeight); fonction privée getOptimalCrop ($ newWidth, $ newHeight) $ heightRatio = $ this-> height / $ newHeight; $ widthRatio = $ this-> width / $ newWidth; si ($ heightRatio < $widthRatio) $optimalRatio = $heightRatio; else $optimalRatio = $widthRatio; $optimalHeight = $this->hauteur / $ optimalRatio; $ optimalWidth = $ this-> width / $ optimalRatio; return array ('optimalWidth' => $ optimalWidth, 'optimalHeight' => $ optimalHeight); Si vous avez opté pour un recadrage, c'est-à-dire que vous avez utilisé l'option de recadrage, il vous reste alors une étape supplémentaire. Nous allons recadrer l'image de la
centre. Le recadrage est un processus très similaire au redimensionnement, mais avec quelques paramètres de dimensionnement supplémentaires transmis..
culture de fonction privée ($ optimalWidth, $ optimalHeight, $ newWidth, $ newHeight) // *** Trouver le centre - sera utilisé pour le recadrage $ cropStartX = ($ optimalWidth / 2) - ($ newWidth / 2); $ cropStartY = ($ optimalHeight / 2) - ($ newHeight / 2); $ crop = $ this-> imageResize; // imagedestroy ($ this-> imageResized); // *** Maintenant recadrez à partir du centre à la taille exacte demandée $ this-> imageResized = imagecreatetruecolor ($ newWidth, $ newHeight); imagecopyresampled ($ this-> imageResized, $ crop, 0, 0, $ cropStartX, $ cropStartY, $ newWidth, $ newHeight, $ newWidth, $ newHeight);
Nous y arrivons presque fini. Il est maintenant temps de sauvegarder l'image. Nous passons dans le chemin et la qualité d’image souhaitée va de 0 à 100, 100 étant la meilleure et appelons la méthode appropriée. Quelques points à noter sur la qualité de l’image: JPG utilise une échelle de 0 à 100, 100 étant la meilleure. Les images GIF n'ont pas de paramètre de qualité d'image. Les PNG le font, mais ils utilisent l’échelle 0-9, 0 étant le meilleur. Ce n'est pas bon car nous ne pouvons pas nous attendre à nous en souvenir à chaque fois que nous voulons enregistrer une image. Nous faisons un peu de magie pour tout normaliser.
fonction publique saveImage ($ savePath, $ imageQuality = "100") // *** Obtenir l'extension $ extension = strrchr ($ savePath, '.'); $ extension = strtolower ($ extension); switch ($ extension) case '.jpg': case '.jpeg': if (imagetypes () & IMG_JPG) imagejpeg ($ this-> imageResized, $ savePath, $ imageQuality); Pause; case '.gif': if (imagetypes () & IMG_GIF) imagegif ($ this-> imageResized, $ savePath); Pause; case '.png': // *** Qualité de l'échelle de 0-100 à 0-9 $ scaleQuality = round (($ imageQuality / 100) * 9); // *** Inverser le paramètre de qualité car 0 est la meilleure solution, pas 9 $ invertScaleQuality = 9 - $ scaleQuality; if (imagetypes () & IMG_PNG) imagepng ($ this-> imageResized, $ savePath, $ invertScaleQuality); Pause; //… etc défaut: // *** Pas d'extension - Pas de sauvegarde. Pause; imagedestroy ($ this-> imageResized);
C’est également le bon moment pour détruire notre ressource d’image pour libérer de la mémoire. Si vous deviez l'utiliser en production, il serait peut-être utile de capturer et de renvoyer le résultat de l'image enregistrée..
Eh bien ça y est, les gars. Merci d'avoir suivi ce tutoriel, j'espère que vous le trouverez utile. J'apprécierais vos commentaires, via les commentaires ci-dessous.
