Fun dengan PHP GD Library: Part 1

1 comments 12:17 PM Posted by Unknown


Fun dengan PHP GD Library: Part 1

Jika Anda seorang avid PHP pengembang, Anda mungkin menyadari ekstensi GD library. Bagi mereka yang tidak terbiasa, perpustakaan GD memungkinkan Anda untuk mengubah, memanipulasi, dan membuat gambar cukup sederhana. Hari ini, kita akan mempelajari dasar-dasar menggunakan PHP dan GD library.

Pertama Hal Pertama

Anda akan perlu memastikan GD library diinstal dan diaktifkan pada server Anda. Tidak tahu bagaimana melakukan ini? Jangan khawatir, hanya membuat file PHP pada server Anda dan ketik:
 <Php echo phpinfo ();??>
Sekarang mengakses halaman di browser Anda dan Anda akan melihat daftar raksasa merinci fitur versi PHP. Gulir ke bawah sedikit dan mencari 'GD' pos untuk memastikan itu diaktifkan. Jika tidak, Anda akan perlu menghubungi perusahaan hosting Anda. Untungnya, kebanyakan server saya telah bekerja pada sudah memiliki perpustakaan GD dipasang dan diaktifkan.
Jika Anda ingin membaca lebih lanjut tentang perpustakaan GD, pastikan untuk memeriksa pengenalan GD penggu .

The Basics

Mari kita membahas beberapa dasar-dasar untuk mendapatkan kita mulai. Pertama, kita akan ingin memastikan bahwa kami melaporkan semua kesalahan ke browser. Kita dapat melakukannya dengan memasukkan berikut di bagian paling atas dari file php kami: 
  <? Php
 ini_set ("display_errors", "1");
 error_reporting (E_ALL);
 ?> 

Jadilah Persegi

Mari kita mulai sederhana dan menggunakan PHP untuk membuat kotak biru bagi kita - ada yang luar biasa tetapi kita perlu mengetahui dasar-dasar pertama. Untuk mencapai persegi kami, kita perlu melakukan hal berikut:
  • Menetapkan jenis konten kami sebagai gambar sehingga browser benar dapat menafsirkan script.
  • Buat kanvas gambar baru kosong dengan lebar tertentu dan tinggi.
  • Mengatur warna latar belakang kami menjadi biru.
  • Simpan gambar akhir dan output ke browser.
  • Membersihkan setiap memori yang digunakan untuk membuat dan menyimpan gambar.
  • Panggil gambar dari file index.php kami yang akan ditampilkan.
Sekarang bahwa kita memiliki langkah dan proses untuk alun-alun bekerja, kita bisa mulai kode. Saya melakukan yang terbaik untuk berkomentar setiap langkah kode, dan akan pergi melalui fungsi tertentu atau proses setelah potongan kode. Yang mengatakan, di sini adalah kode untuk persegi kami. Setelah disisipkan dalam, simpan file ini sebagai 'basic_square.php':

  <? Php
 // Laporkan setiap kesalahan
 ini_set ("display_errors", "1");
 error_reporting (E_ALL);

 // Mengatur jenis konten yang benar
 header ('content-type: image / png');

 // Buat aliran gambar dasar kita
 // Lebar 125px tinggi, 125px
 $ Image = ImageCreate (125, 125);

 // Mengatur warna latar belakang
 $ Biru = ImageColorAllocate ($ image, 0, 0, 255);

 // Set up warna lain hanya untuk menunjukkan bagaimana warna pertama dinyatakan digunakan sebagai warna latar belakang ketika kita menggunakan ImageCreate ()
 // Perhatikan bagaimana biru diterapkan pada latar belakang, * tidak * merah.
 $ Merah = ImageColorAllocate ($ image, 255, 0, 0);

 // Menyimpan gambar sebagai png dan output
 imagepng ($ image); 
 
 // Memori sampai Batal digunakan
 imagedestroy ($ image);
 ?>
Mari kita pergi melalui masing-masing fungsi dan langkah dalam kode di atas sehingga kami dapat lebih memahami apa yang terjadi di sini.
  • Seperti disebutkan, kami melaporkan kesalahan ke browser sehingga kita dapat memperbaiki bug.
  • Selanjutnya kita menggunakan header () fungsi untuk menetapkan jenis konten kami ke gambar png.
  • Kami menyimpan gambar dalam sebuah variabel bernama 'citra' dan menciptakan aliran gambar dasar kita dan menyatakan lebar dan tinggi kita. Lihat ImageCreate () untuk informasi lebih lanjut.
  • Selanjutnya kita menggunakan ImageColorAllocate fungsi untuk menyimpan warna biru di 'biru' variabel kita. Juga perhatikan bagaimana warna pertama menyatakan akan ditetapkan sebagai latar belakang menggunakan ImageCreate. Jadi biru akan background warna kita, bukan merah.
  • Kami menggunakan imagepng () untuk menyimpan gambar akhir kami, dibutuhkan parameter tambahan jika Anda ingin menyimpannya ke direktori.
  • Terakhir, kita menjernihkan memori yang digunakan dengan memanggil imagedestroy () .
Kita bisa mengakses dan melihat kotak biru kami dengan pergi ke blue_square.php, atau bahkan lebih baik, kita bisa link ke index.php pada kami seperti: 
  <Img src = 'http://themeforest.s3.amazonaws.com/65_gd/basic_square.php' alt ='' />
Dengan asumsi semua berjalan baik, Anda akan melihat kotak biru seperti di bawah:

Hello Dunia

Sekarang bahwa kita memiliki dasar-dasar yang sangat menciptakan gambar, mari kita membuat gambar dengan beberapa teks dan font pilihan kami. Kita dapat menggunakan font yang kita inginkan, asalkan font adalah Font TrueType (. Tff). Untuk beberapa contoh berikutnya saya akan menggunakan 'Advent' font yang Anda bisa temukan di sini. Kami akan menciptakan 'Hello World' string di lapangan latar belakang abu-abu gelap. Mari kita lihat pada kode sumber pertama dan kemudian pergi ke setiap langkah. 
  <? Php
 // Laporkan setiap kesalahan
 ini_set ("display_errors", "1");
 error_reporting (E_ALL); 

 // Mengatur jenis konten
 header ('content-type: image / png');

 // Buat gambar dasar kami aliran 300x300 piksel
 $ Image = ImageCreate (300, 300);

 // Set up beberapa warna, gunakan abu-abu gelap sebagai warna latar belakang
 $ Dark_grey = ImageColorAllocate ($ image, 102, 102, 102);
 $ Putih = ImageColorAllocate ($ image, 255, 255, 255);

 // Set path ke jenis font sejati kita
 $ Font_path = 'advent_light';

 // Set string teks kami
 $ String = 'Hello World!';

 // Menulis teks kami untuk gambar yang ada.
 imagettftext ($ image, 50, 0, 10, 160, font_path $ putih, $, $ string);

 // Buat gambar akhir kami
 imagepng ($ image);

 // Hapus memori
 imagedestroy ($ image);
 ?>
Menyimpan kode di sebuah file bernama 'hello_world.php' dan mengaksesnya menggunakan teknik yang sama seperti yang kami sebutkan di atas. Jadi apa yang berbeda di sini?
  • Kami mengatur dimensi untuk 300 × 300 piksel dan menggunakan latar belakang abu-abu gelap.
  • Perhatikan bagaimana kita menyatakan jalan font variabel bernama dan menggunakan nama font kita sebagai nilai? Hal ini karena nantinya di script kita perlu mengetahui jalan untuk font kita sehingga kita dapat menggunakan PHP untuk menggambar teks kami. Juga mencatat dengan cermat bagaimana ada ekstensi. Mengutip manual:
    Tergantung pada versi GD library PHP menggunakan, ketika file font yang tidak dimulai dengan ttf terkemuka / kemudian. Akan ditambahkan.
    Ini berarti karena file font kita tidak memiliki '/' di depannya, tff otomatis. Akan ditambahkan.
  • Selanjutnya kita mengatur string kami, 'Hello World!', Dan menyimpannya dalam sebuah variabel untuk digunakan nanti.
  • Fungsi utama yang perlu diperhatikan di sini adalah berikutnya, imagettftext () , yang mengambil 8 parameter. Sumber daya $ image, mengapung $ ukuran, mengapung $ angle, int $ x, int $ y, int $ warna, string $ berkas font, string $ text (dalam urutan itu).
Simpan halaman ini dan mengaksesnya namun Anda inginkan, Anda harus mendapatkan gambar yang terlihat seperti di bawah.

Sudut itu!

Apakah Anda menangkap bahwa salah satu parameter dari fungsi imagettftext adalah 'angle'. Ini berarti kita dapat sudut string kita untuk beberapa hasil yang unik. Mari kita kembali kode kita dari atas dan sudut kami 'Hello World! " teks.

 <? Php
 / / Laporkan setiap kesalahan
 ini_set ("display_errors", "1");
 error_reporting (E_ALL); 

 / / Mengatur jenis konten
 header ('content-type: image / png');

 / / Buat gambar dasar kami aliran 300x300 piksel
 $ Image = ImageCreate (300, 300);

 / / Set up beberapa warna, gunakan abu-abu gelap sebagai warna latar belakang
 $ Dark_grey = ImageColorAllocate ($ image, 102, 102, 102);
 $ Putih = ImageColorAllocate ($ image, 255, 255, 255);

 // Set path ke jenis font sejati kita
 $ Font_path = 'advent_light';

 // Set string teks kami
 $ String = 'Hello World!';

 // Menulis teks kami untuk gambar yang ada.
 imagettftext ($ image, 50, - 45, 30, 70, $ putih, $ font_path, $ string);

 // Buat gambar akhir kami
 imagepng ($ image);

 // Hapus memori
 imagedestroy ($ image);
 ?>
Perhatikan bagaimana kita telah menambahkan sudut -45 derajat ke fungsi bukan nol (serta reposisi teks kita beberapa)? Ini adalah semua yang diperlukan untuk sudut beberapa teks ke gambar, Anda akan melihat sesuatu seperti gambar di bawah.
Apakah Anda bersenang-senang belum? Tidak ada? Nah, kemudian mari kita gunakan pendekatan yang lebih praktis dan menciptakan sesuatu yang dapat berguna.

Apa Tanggal tersebut?

Tidak hanya bisa kita membuat gambar dari awal, tapi kita bisa membuat gambar dari gambar yang ada! Dengan sedikit kerja kita dapat dengan mudah membuat kecil 'kalender icon' yang menampilkan tanggal saat ini (bulan, hari, tahun). Sebuah pencarian Google yang sederhana untuk 'kalender kosong ikon' dibesarkan ikon bebas svg. Bahwa saya diubah ukurannya dan diubah menjadi. Png. Jadi Anda memiliki gagasan tentang apa yang saya bicarakan tentang Anda dapat melihat kalender kosong 'di bawah ini.
Sekarang bahwa kita memiliki kanvas untuk bekerja dengan, kita dapat menggunakan GD berbagai fungsi tanggal PHP untuk membuat ini semua datang bersama-sama. Disclaimer: Saya bukan desainer dunia terbesar, ikon kosong yang lebih baik dan pilihan font mungkin akan menjadi ide yang baik jika saya akan menggunakan ini 'kalender ikon' di situs nyata. Aku akan meninggalkan merancang untuk kalian semua. Yang mengatakan, mari kita lihat kode final dan kemudian meninjau. 
  <? Php
 // Laporkan semua Kesalahan
 ini_set ("display_errors", "1");
 error_reporting (E_ALL); 

 // Set jenis konten
 header ('content-type: image / jpeg');

 // Simpan nilai-nilai tanggal kami di variabel terpisah
 Daftar ($ bulan, $ hari, $ tahun) = explode ('/', date ('F / jS / Y'));

 // Load gambar dasar kami
 $ Image = imagecreatefrompng ('calendar_blank.png');
 $ IMAGE_WIDTH = imagesx ($ image);

 / Warna Setup / dan file font
 $ Putih = ImageColorAllocate ($ image, 255, 255, 255);
 $ Hitam = ImageColorAllocate ($ image, 0, 0, 0);
 $ Font_path = 'advent_light';

 // Dapatkan posisi string teks
 $ Pos_month = imagettfbbox (13, 0, $ font_path, $ bulan);
 $ Pos_day = imagettfbbox (25, 0, $ font_path, $ hari);
 $ Pos_year = imagettfbbox (8, 0, $ font_path, $ tahun);

 // Buat Bulan
 imagettftext ($ image, 13, 0, ($ IMAGE_WIDTH - $ pos_month [2]) / 2, 40, $ putih, $ font_path, $ bulan);

 // Buat Hari
 imagettftext ($ image, 25, 0, ($ IMAGE_WIDTH - $ pos_day [2]) / 2, 80, $ hitam, $ font_path, $ hari);

 // Buat Tahun
 imagettftext ($ image, 8, 0, ($ IMAGE_WIDTH - $ pos_year [2]) / 2, 100, $ hitam, $ font_path, $ tahun);

 // Buat gambar akhir
 imagejpeg ($ image,'', 100);

 // Hapus memori;
 imagedestroy ($ image);
 ?>
Jadi apa yang terjadi di sini? Apa ini fungsi list ()? Semua baik pertanyaan, dan kami akan membahas mereka semua langkah demi langkah:
  • Seperti biasa kami mengatur jenis header sehingga gambar akan ditampilkan dengan benar.
  • On line 10 Anda akan melihat kita menggunakan fungsi daftar . Kami menetapkan nilai dari array tanggal (dikonversi ke array melalui meledak () ) dengan variabel di dalam fungsi daftar. Ini adalah cara mudah untuk mengambil informasi array dan menugaskan sekaligus untuk beberapa variabel. Kami sekarang dapat mengakses variabel $ bulan, $ hari, dan $ tahun individual.
  • On line 22-24 kita menggunakan imagettfbbox () fungsi untuk mengambil kotak loncat dari string kami (singkatnya, ukuran atau panjang), fungsi mengembalikan sebuah array nilai, sehingga untuk mengakses pojok kanan bawah kita bisa menggunakan $ pos_month [2]. Kami memerlukan informasi ini sehingga kami dapat secara otomatis memposisikan teks kita dengan benar tidak peduli ukuran.
  • Terakhir kita membuat setiap string dan menggunakan beberapa matematika dasar untuk posisi koordinat x dari string kita.
Dengan asumsi alam semesta tidak meledak, Anda harus mendapatkan gambar seperti di bawah (kecuali tanggal harus menjadi apa pun tanggal saat ini pada server Anda, di bawah ini adalah gambar statis dari hasilnya). Juga, berkat catpin untuk bantuan dengan script.

Kucing dan Filter Gambar

Hal terakhir yang kita akan menyentuh pada hari ini adalah sangat menyenangkan imagefilter () fungsi. Fungsi imagefilter mengambil gambar didefinisikan pra dan menerapkan filter ditentukan untuk gambar, seperti mengubah gambar ke grayscale. Mari kita lihat gambar kita akan bekerja dengan, benar-benar tersentuh.
Sekarang mari kita mengkonversi kitty gila untuk gambar grayscale menggunakan fungsi imagefilter. 
  <? Php
 // Laporkan semua kesalahan
 ini_set ("display_errors", "1");
 error_reporting (E_ALL); 

 // Periksa untuk melihat apakah gambar sumber diatur
 if (isset ($ _GET ['sumber'])) {
  // Lakukan beberapa sanitasi yang sangat dasar dari string
  $ Image = filter_var ($ _GET ['sumber'], FILTER_SANITIZE_STRING);

  // Load gambar dari sumber yang disediakan
  $ Image = imagecreatefromjpeg ($ image);

  // Mengubah gambar ke gambar grayscale
  imagefilter ($ image, IMG_FILTER_GRAYSCALE);

  // Set jenis konten
  header ('content-type: image / jpeg');

  // Simpan gambar dengan kualitas 90 persen
  imagejpeg ($ image,'', 90);

  // Menjernihkan memori
  imagedestroy ($ image);
 }
 ?>
Saya telah membuat script di atas sedikit lebih fleksibel, sehingga memberikan Anda pilihan untuk mengubah gambar apapun menjadi gambar gray-scale dengan referensi seperti di bawah ini: 
  <Img src = 'http://themeforest.s3.amazonaws.com/65_gd/grayscale.php?source=cat.jpg' alt ='' />
Jelas, Anda bisa mengisi 'sumber' dengan path ke setiap gambar yang Anda ingin memilikinya dikonversi ke skala abu-abu. Selanjutnya, silakan menerapkan langkah-langkah keamanan lebih lanjut jika Anda berencana untuk menggunakan ini pada server hidup. Juga script diatas mengharapkan untuk menerima gambar. Jpeg, Anda bisa mendapatkan kreatif dan memilikinya menerima semua jenis gambar jika Anda inginkan. Kucing Anda sekarang harus terlihat seperti gambar di bawah ini.

Lebih Filter

Untuk membungkus pelajaran ini, mari kita cepat melihat filter lain yang bisa kita gunakan dan hasil yang mereka hasilkan.

Kecerahan Filter

Menyesuaikan kecerahan gambar yang diberikan, parameter ketiga menyesuaikan kecerahan. 
  <? Php
 header ('content-type: image / jpeg');

 $ Image = imagecreatefromjpeg ('cat.jpg');
 / / Parameter 3rd menerima tingkat kecerahan.
 imagefilter ($ image, IMG_FILTER_BRIGHTNESS, 40);
 imagejpeg ($ image,'', 90);
 imagedestroy ($ image);
 ?>

Gaussian Blur

Gaussian mengaburkan gambar, tidak ada parameter diterima. 
  <? Php
 header ('content-type: image / jpeg');

 $ Image = imagecreatefromjpeg ('cat.jpg');
 imagefilter ($ image, IMG_FILTER_GAUSSIAN_BLUR);
 imagejpeg ($ image,'', 90);
 imagedestroy ($ image);
 ?> 
 

Kontras

Parameter ketiga menerima tingkat kontras.

 <? Php
 header ('content-type: image / jpeg');
 $ Image = imagecreatefromjpeg ('cat.jpg');
 imagefilter ($ image, IMG_FILTER_CONTRAST, - 15);
 imagejpeg ($ image,'', 90);
 imagedestroy ($ image);
 ?>

Berarti Removal (efek sketsa)

Tidak ada parameter diterima. 
  <? Php
 header ('content-type: image / jpeg');
 $ Image = imagecreatefromjpeg ('cat.jpg');
 imagefilter ($ image, IMG_FILTER_MEAN_REMOVAL);
 imagejpeg ($ image,'', 90);
 imagedestroy ($ image);
 ?>

Colorize

Menerima nilai merah, hijau, biru, dan alpha channel (opsional) dalam urutan itu. 
  <? Php
 header ('content-type: image / jpeg');
 $ Image = imagecreatefromjpeg ('cat.jpg');
 / / Parameter alpha channel dihilangkan bawah seperti opsional.
 imagefilter ($ image, IMG_FILTER_COLORIZE, 50, 0, 0);
 imagejpeg ($ image,'', 90);
 imagedestroy ($ image);
 ?>

Sampai waktu berikutnya ...

Saya harap ini memberi Anda beberapa wawasan ke perpustakaan GD PHP. Pada bagian 2, kita akan membahas beberapa teknik yang lebih canggih, dan, tentu saja, bersenang-senang lagi.

artikel ini dikutip dari www*.themeforest.net

Written by

1 comment:

Subscribe to: Post Comments (Atom)