08. 04. 2013 20:00

PHP: Trieda pre miniatúry obrázkov

Sťahovať triedu môžete tu:
» PHP trieda Miniatura 1.0 (4,4 kB)

Dokumentácia

  1. Základná funkcionalita
  2. Orezanie obrázku na zvolený rozmer
  3. Výstupný formát obrázku
  4. Otáčenie obrázku
  5. Efekty
  6. Nastavenie kvality obrázku
  7. Pridávanie vodoznakov
  8. Chybové hlášky
  9. Ukladanie do súboru
  10. Súbor miniatura.php a miniatura_url.php
  11. Ako použiť miniatura.php

Základná funkcionalita

Príklad súbora miniatura_zaklad.php:

<?php
  require_once "class.miniatura.php";
  
  $cesta = "ukazka.jpg";
  $obrazok = new Miniatura($cesta);
  
  $obrazok->sirka = 200;
  $obrazok->vyska = 200;
  
  $obrazok->kresli(); 
?>

HTML stránka:

<img src='miniatura_zaklad.php' alt='Alternatívny text' />

Výsledok:

IMG Z pôvodného obrázka (500x333px) sa vytvorila miniatúra s rovnakým pomerom strán. (200x133px)

Táto miniatúra nepresiahne maximálne hodnoty šírky(200px) a výšky(200px) a zachová pomer strán.

Orezanie obrázku na zvolený rozmer

Zmeníme premennú orezanie na 1

$obrazok->sirka = 500;
$obrazok->vyska = 150;
  
$obrazok->orezanie = 1;

Výsledok:

IMG
IMG Z pôvodného obrázka (500x333px) sa vytvorila miniatúra s rozmermi 500x150px.

Obrázok sa orezal tak, aby pasoval do daných rozmerov.

Ďalší príklad orezania:

$obrazok->sirka = 70;
$obrazok->vyska = 133;
  
$obrazok->orezanie = 1;

Výsledok:

IMG IMG

Výstupný formát obrázku

Povolené sú tieto tri výstupné formáty: JPG, PNG a GIF.

$obrazok->vystup = "jpg";
//alebo
$obrazok->vystup = "png";
//alebo
$obrazok->vystup = "gif";

Pokiaľ tento parameter nevyplníte alebo ho vyplníte zle, výstupný formát bude rovnaký ako vstupný.


Otáčenie obrázku

IMG Na obrázku vľavo je znázornené ako sú brané do úvahy premenné sirka a vyska.

Defaultná hodnota pozadia je
"255, 255, 255, 127"

Formát farby pozadia je RGBA
"red, green, blue, alpha"
Rozsah čísel pre red, green a blue je
od 0 do 255
Rozsah čísel pre alpha(hodnota priesvitnosti) je od 0(nepriesvitné) do 127(úplne priesvitné)

Príklady:

IMG
$obrazok->sirka = 100;
$obrazok->vyska = 100;

$obrazok->otoc = 45;
$obrazok->pozadie = "180,255,50,0";

IMG
$obrazok->sirka = 100;
$obrazok->vyska = 100;

$obrazok->otoc = -15;
$obrazok->vystup = "png";

IMG
$obrazok->sirka = 100;
$obrazok->vyska = 100;

$obrazok->otoc = 60;
$obrazok->orezanie = 1;
$obrazok->vystup = "png";

IMG
$obrazok->sirka = 100;
$obrazok->vyska = 100;

$obrazok->otoc = -90;

Efekty

Pridávanie efektu obrázka

$obrazok->pridajEfekt("nazov efektu"); 

Nastavenie maximálneho počtu efektov:

$obrazok->maxEfektov = 2; //defaultne je nastavené na 5 

Zoznam efektov: ciernobiely, malba, sepia, negativ, emboss, rozmazanie, zvyraznihrany, jas, kontrast, pixeluj, kolorizuj.

Efekty si zachovajú poradie, v akom ich budete pridávať.

IMG
$obrazok->pridajEfekt("ciernobiely");
IMG
$obrazok->pridajEfekt("malba");
IMG
$obrazok->pridajEfekt("sepia");
IMG
$obrazok->pridajEfekt("negativ");

IMG
$obrazok->pridajEfekt("emboss");

IMG
$obrazok->pridajEfekt("rozmazanie");

IMG
$obrazok->pridajEfekt("zvyraznihrany");

IMG
$obrazok->pridajEfekt("jas",50);

IMG
$obrazok->pridajEfekt("kontrast",-50);

IMG
$obrazok->pridajEfekt("pixeluj",10);

IMG
//druhý parameter je - R,G,B - od 0 do 255
$obrazok->pridajEfekt("kolorizuj","255,0,0");

IMG
//viac efektov za sebou
$obrazok->pridajEfekt("kontrast",-60);
$obrazok->pridajEfekt("jas",100);
$obrazok->pridajEfekt("ciernobiely");

IMG
//viac efektov za sebou
$obrazok->maxEfektov = 2;
$obrazok->pridajEfekt("kontrast",-60);
$obrazok->pridajEfekt("jas",100);
$obrazok->pridajEfekt("ciernobiely");
//tento efekt sa už nevykoná, pretože
//max. počet efektov je nastavných na 2

IMG
//viac efektov za sebou
$obrazok->pridajEfekt("negativ");
$obrazok->pridajEfekt("kolorizuj","0,255,0");

IMG
//rovnaký príklad, len vymenené riadky
//na poradí efektov záleží
$obrazok->pridajEfekt("kolorizuj","0,255,0");
$obrazok->pridajEfekt("negativ");

Nastavenie kvality obrázku

Kvalita JPEG-u (rozsah od 0 do 100)

$obrazok->vystup = "jpg";
$obrazok->kvalita = 60; //od 0(najhoršia) do 100(najlepšia)

Kvalita PNG (rozsah od 0 do 9)

$obrazok->vystup = "png";
$obrazok->kvalita = 7; //od 0(najhoršia) do 9(najlepšia)

Pre GIF formát je premenná kvalita irelevantná.

Pridávanie vodoznakov

Použitie:

$obrazok->pridajVodoznak(súbor, X, Y, šírka, výška);

Parametre:
Povinné:

  • Súbor: cesta k súboru(berie aj URL)
Nepovinné:
  • X: X-ová súradnica ľavého rohu vodotlače. (default pravý dolný roh)
    • Očakávané hodnoty
      • Celé číslo
      • "" (prázdny reťazec) - x-ová hodnota ostane defaultná
      • "stred" - vodotlač zarovná na stred na x-ovej osi
  • Y: Y-ová súradnica ľavého rohu vodotlače.
    • Očakávané hodnoty
      • Celé číslo
      • "" (prázdny reťazec) - y-ová hodnota ostane defaultná
      • "stred" - vodotlač zarovná na stred na y-ovej osi
  • šírka: šírka výslednej vodotlače
  • výška: výška výslednej vodotlače

Príklady:

Pôvodné obrázky, ktoré budem používať v príkladoch ako vodoznaky:

1:
vodoznak1.png
2:
vodoznak2.png
3:
vodoznak3.png

Ukážka vodoznaku
$obrazok = new Miniatura("ukazka.jpg");
$obrazok->sirka = 500;
$obrazok->vyska = 150;
$obrazok->orezanie = 1;

$obrazok->pridajVodoznak("vodoznak1.png"); //v príkladoch budem meniť len tento riadok

$obrazok->kresli();

Ukážka vodoznaku
$obrazok->pridajVodoznak("vodoznak1.png","","",100,20);
//vodoznak sa zmenší na 100x20 (nezachováva sa pomer strán)

Ukážka vodoznaku
$obrazok->vodoznakOdsadenie = 20; //odsadenie zprava a zdola 20px
$obrazok->pridajVodoznak("vodoznak1.png","","",100,20);

Ukážka vodoznaku
$obrazok->pridajVodoznak("vodoznak2.png",0,0);

Ukážka vodoznaku
$obrazok->pridajVodoznak("vodoznak3.png","stred","stred");

Ukážka vodoznaku
//viac vodoznakov naraz
$obrazok->pridajVodoznak("vodoznak1.png","stred","",100,20);
$obrazok->pridajVodoznak("vodoznak2.png",0,0);
$obrazok->pridajVodoznak("vodoznak3.png","stred","stred");

Ukážka vodoznaku
//rotácia obrázku
$obrazok->sirka = 150;
$obrazok->vyska = 150;
$obrazok->otoc = 90;

$obrazok->pridajVodoznak("vodoznak1.png","","",100,20);
Ukážka vodoznaku
//rotácia obrázku
$obrazok->otoc = 90;
$obrazok->rotujVodoznak = 0;
//nebude rotovať vodoznak spolu s obrázkom
$obrazok->pridajVodoznak("vodoznak1.png","","",100,20);

Chybové hlášky

IMG

$obrazok = new Miniatura("neexistujuci_obrazok.jpg");
$obrazok->kresli();

IMG

$obrazok = new Miniatura("nepovoleny_typ_suboru.txt");
$obrazok->kresli();

Ukladanie do súboru

Pre ukladanie do súboru použite namiesto metódy kresli() metódu
ulozDo(string subor,bool prepisAkExistuje).

Nasledujúci skript miniatúru nezobrazí, ale uloží ju do súboru obrazok_orezany.jpg - ak daný súbor už existuje, skript sa zastaví s chybovou hláškou
"Subor uz existuje!".

<?php
  require_once "miniatura.class.php";
  
  $obrazok = new Miniatura("obrazok.jpg");
  
  $obrazok->sirka = 200;
  $obrazok->vyska = 200;
  $obrazok->orezanie = 1;

  $obrazok->vystup = "jpg";
  $obrazok->kvalita = 80; 
  
  $obrazok->ulozDo("obrazok_orezany.jpg"); 
?>

Ak chcete, aby sa existujúci súbor prepísal, pridajte druhý parameter

$obrazok->ulozDo("obrazok_orezany.jpg",true); 

Súbor miniatura.php a miniatura_url.php

Súbor miniatura.php: (obrázok z URL - nie, listovanie pomocou "../" - nie)

Po zadaní druhého parametra (true) do konštruktora triedy "Miniatura", trieda povolí čerpanie obrázkov aj cez URL.


$url_link = "http://img.ownage.sk/blog/5/ukazka.jpg";
$obrazok = new Miniatura($url_link,true);

Súbor miniatura_url.php: (obrázok z URL - áno, listovanie pomocou "../" - áno)



Ako použiť miniatura.php

Súbor miniatura.php príjma tieto GET parametre:

  • q - cesta k súboru
  • sirka - šírka miniatúry
  • vyska - výška miniatúry
  • orezanie - orezanie miniatúry (1 - áno, 0/nevyplnené - nie)
  • pozadie - farba pozadia (formát "R,G,B")
  • otoc - rotácia obrázku v stupňoch
  • vystup - výstupný formát miniatúry (jpg/png/gif)
  • efekty - zoznam efektov (jednotlivé efekty sú oddeľované znakom "|" a doplňujúce informácie efektu oddeľte znakom ":" od názvu efektu)

    Príklad: &efekty=kontrast:-20|ciernobiely|kolorizuj:0,0,150
    Nastaví kontrast na -20, zmení farby na čiernobiele a celé to kolorizuje na modro

Pár ukážok HTML kódu:

Obrázok
<img src='/miniatura/miniatura.php?q=test.jpg&sirka=50&vyska=50' alt='Obrázok' />
Obrázok
<img src='/miniatura/miniatura.php?q=test.jpg&sirka=50&vyska=100&orezanie=1&efekty=ciernobiely' alt='Obrázok' />
Obrázok
<img src='/miniatura/miniatura.php?q=test.jpg&sirka=50&vyska=80&orezanie=1&efekty=kontrast:-50|jas:-10|sepia' alt='Obrázok' />
Obrázok
<img src='/miniatura/miniatura.php?q=test.jpg&sirka=50&vyska=50&orezanie=1&otoc=90' alt='Obrázok' />
Obrázok
<img src='/miniatura/miniatura_url.php?q=https://www.google.sk/images/srpr/logo4w.png&sirka=80&vyska=50&otoc=-90' alt='Obrázok' />