สอน codeigniter image resize เปลี่ยนขนาดภาพที่อัพโหลด
สอน codeigniter image resize เปลี่ยนขนาดภาพที่อัพโหลด
ในขั้นตอนของการพัฒนาเว็บไซต์ อีกนึ่ง feature หนึ่งที่มักจะมีอยู่แทบจะทุกเว็บไซต์ในปัจจุบันคือ การอัพโหลดรูปภาพ ยกตัวอย่างเช่นการอัพโหลดรูปภาพสำหรับทำรูปประจำตัวหรือรูปโปรไฟล์ อัพโหลดสลิปสำหรับการแจ้งโอนเงิน อัพโหลดรูปสำหรับ
ตกแต่งในโปรแกรม เป็นต้น ในขั้นตอนของการอัพโหลด โปรแกรมจำเป็นจะต้องปรับขนาดรูปภาพที่ผู้ใช้งานอัพโหลดซึ่งอาจจะมีขนาดความกว้างและความสูงแตกต่างกันออกไป การทำ image resize จึงเป็นขั้นตอนที่สำคัญมาก ทั้งในเรื่องของการแสดงผลที่เหมาะสม สมส่วน และเรื่องของขนาดที่มีผลต่อการโหลดของเว็บไซต์โดยตรง สำหรับ codeigniter นั้น มีฟังก์ชั่นเกี่ยวกับการอัพโหลดและปรับขนาดให้รูปภาพให้ใช้งานที่ค่อนข้างครบถ้วน ลองมาดูกันครับว่าเราจะสามารถจัดการยังไงกับรูปได้บ้าง
สร้างฟังก์ชั่นสำหรับทำ Image Resize
ในการสร้างฟังก์ชั่นนั้น เราสามารถสร้างไว้ใน controller โดยตรงหรืออาจจะแยกไปสร้างไว้ในส่วนของ libraries เพื่อจะได้สามารถนำไปใช้งานได้มากกว่าหนึ่ง controller ตัวอย่างฟังก์การทำ image resize
private function resizeImage($file,$width,$height,$quality){ $image = $file; $config['image_library'] = 'gd2'; $config['source_image'] = $image['full_path']; $config['maintain_ratio'] = TRUE; // ปรับขนาดโดยยังรักษาสัดส่วนของรูปไว้ $config['quality'] = $quality; // ความละเอียดของรูปใหม่สูงสุด 100 $config['width'] = $width; // ความกว้างของรูปภาพ $config['height'] = $height; // ความสูงของรูปภาพ $image = base_url("uploads/".$image['file_name']); $this->load->library('image_lib', $config); $this->image_lib->resize(); return $image; }
ฟังก์ชั่น resizeImage จะรับค่าพารามิเตอร์มา 4 ตัวแปร คือ ข้อมูลรูป ความกว้าง ความสูง และความละเอียด ตามลำดับ
วิธีเรียกใช้งาน
ตัวอย่างการใช้งานใน controller
public function upload(){ if(!$this->upload->do_upload('file')) { echo $this->upload->display_errors(); }else{ $cover_image = $this->upload($this->upload->data(),640,480,80); } $this->load->library('upload', $config); }
จากตัวอย่างโค๊ดด้านบนตัวแปร $cover_image คือ url สุดท้ายของรูปที่เราจะสามารถนำไปใช้งานต่อได้ โดยมีขนาดทั้งความกว้าง ความสูงและความละเอียด ตรงตามที่เราได้กำหนดไว้