Lớp xử lý ảnh trên CodeIgniter

CodeIgniter đưa ra cho chúng ta một lớp xử lý ảnh vô cùng hiệu quả. Lớp xử lý ảnh này có rất nhiều phương thức để chúng ta tùy chỉnh ảnh khi upload lên website. Trong bài này chúng ta sẽ xem xét về lớp xử lý ảnh trên CodeIgniter.

Lớp xử lý ảnh trên CodeIgniter cho phép chúng ta thực hiện các công việc sau:

Chỉnh sửa kích thước ảnh

  • Tạo ảnh thumbnail
  • Cắt ảnh
  • Xoay ảnh
  • Làm mờ ảnh

Lớp xử lý ảnh này cũng hỗ trợ đầy đủ bộ ba thư viện lớn đó là : GD/GD2, NetPBM, và ImageMagick

Chú ý: Chức năng là mờ ảnh chỉ có trên bộ thư viện GD/GD2. Ngoài ra, ngay cả các bộ thư viện khác được hỗ trợ, thì bộ GD là yêu cầu để mã chương trình tính toán được các đặc tính của ảnh. Tuy nhiên, quá trình xử lý ảnh sẽ được thực hiện với lớp thư viện mà ta định trước.

1. Khởi tạo lớp xử lý ảnh.

Như là hầu hết các lớp khác trên CodeIgniter, lớp xử lý ảnh được khởi tạo trong Controller thông qua hàm $this->load->library.

$this->load->library('image_lib');

Khi bộ thư viện được tải lên thì nó bắt đầu sẵn sàng để sử dụng. Bộ thư viện mà ta sẽ xử dụng tên là $this->image_lib

2. Xử lý một bức ảnh.

Bất kể kiểu xử lý là gì ( thay đổi kích thước, cắt xén, xoay hay làm mờ ) thì quá trình chung là hoàn toàn giống hệt nhau. Ta sẽ thiết lập một vài tham số tương ứng với các quá trình mà ta muốn thực hiện.

Ví dụ, tạo một ảnh thumbnail ta sẽ làm như sau:

$config['image_library'] = 'gd2';
$config['source_image']	= '/path/to/image/mypic.jpg';
$config['create_thumb'] = TRUE;
$config['maintain_ratio'] = TRUE;
$config['width']	 = 75;
$config['height']	= 50;

$this->load->library('image_lib', $config); 

$this->image_lib->resize();

Đoạn mã ở trên nói với hàm image_resize rằng sẽ cần tìm kiếm một bức ảnh tên là mypic.jpg đặt tại thư mục là source_image, sau đó sẽ tạo ra một ảnh thumb có kích thước là 75 x 50 pixels sử dụng bộ thư viện GD2 image_library.

Khi tùy chọn maintain_ratio được kích hoạt, ảnh thumb sẽ được tạo với kích thước gần nhất có thể với kích thước width và height mà ta thiết lập trước.

Ảnh thumb tạo ra có tên là mypic_thumb.jpg

Chú ý : 

Để lớp ảnh được phép thực hiện một quá trình xử lý nào đó, thì thư mục chứa ảnh phải được phân quyền được ghi.

Quá trình xử lý ảnh thường yêu cầu dung lượng bộ nhớ của server lớn cho một vài quá trình. Nếu bạn gặp phải lỗi liên quan đến việc cạn kiệt bộ nhớ trong khi xử lý ảnh thì bạn nên tăng giới hạn bộ nhớ của PHP.

3. Các hàm xử lý

Có 4 hàm xử lý ảnh bao gồm:

  1. $this->image_lib->resize()
  2. $this->image_lib->crop()
  3. $this->image_lib->rotate()
  4. $this->image_lib->watermark()
  5. $this->image_lib->clear()

Các hàm này trả về TRUE nếu thành công và FALSE nếu thất bại. Nếu có lỗi xảy ra, ta có thể lấy được thông tin chi tiết lỗi bằng hàm.

echo $this->image_lib->display_errors();

Trên thực tế ta thường xử dụng biểu thức điều kiện để hiển thị lỗi nếu có, ví dụ:

if ( ! $this->image_lib->resize())
{
    echo $this->image_lib->display_errors();
}

Chú ý: Ta có thể định dạng lỗi trả về bằng mã HTML, bằng cách thêm vào thẻ mở và thẻ đóng vào hàm này, ví dụ:

$this->image_lib->display_errors('', '');

4. Các tham số thông dụng nhất.

Các tham số thông dụng được đưa ra ở bên dưới sẽ giúp ta xử lý phù hợp với yêu cầu cụ thể.

Chú ý rằng không phải tất cả các tham số là dùng được trên tất cả các hàm.

Kiểu xử lý :

  • R - Thay đổi kích thước
  • C - Cắt xén ảnh
  • X - Xoay ảnh
  • W - Làm mờ ảnh

Danh sách tham số:

  • image_library : Thiết lập thư viện ảnh được dùng - R,C,X,W
  • library_path  : Thiết lập đường dẫn tuyệt đối tới bộ thư viện ImageMagick hoặc NetPBM. Nếu bạn sử dụng các bộ thư viện này, thì phải đưa đường dẫn vào - R,C,X
  • source_image  : Thiết lập tên và đường dẫn của ảnh nguồn cần chỉnh sửa. Đường dẫn phải là tuyệt đối hoặc tương đối, không phải là URL - R,C,X,W
  • dynamic_output : Xác định xem ảnh trả về sẽ được ghi vào đĩa hay được sinh ra một cách linh động. Nếu chọn thiết lập là sinh ra ảnh linh động, thì chỉ có một ảnh duy nhất được hiển thị ở một thời điểm, và không thể thay đổi vị trí trên trang web. Nó chỉ đơn giản là xuất ra ảnh thô ban đầu một cách linh động trên trình duyệt - R,C,X,W
  • quality : Thiết lập chất lượng của ảnh. Ảnh có chất lượng càng cao thì dung lượng càng lớn - R,C,X,W
  • new_image : Thiết lập đường dẫn đích hay tên ảnh đích. Ta sẽ sử dụng thông số này khi tạo một ảnh bản sao. Đường dẫn phải là tương đối hoặc tuyệt đối, không phải là URL - R,C,X,W
  • width : Thiết lập chiều rộng của ảnh - R,C
  • height : Thiết lập chiều cao của ảnh - R,C
  • create_thumb (boolean - TRUE/FALSE) : Nói cho hàm xử lý để sinh ra ảnh thumb hay không - R
  • thumb_marker : Chỉ rõ tên chỉ thị của ảnh thumb. Nó sẽ được chèn vào trước phần đuôi mở rộng của ảnh. Như mypic.jpg sẽ thành mypic_thumb.jpg - R
  • maintain_ration (boolean - TRUE/FALSE) : Chỉ ra xem liệu có muốn duy trì tỷ lệ gốc khi thay đổi kích cỡ ảnh hay là dùng giá trị cứng - R,C
  • master_dim (auto, width, height) : Chỉ ra chiều ưu tiên để chỉnh cỡ ảnh hoặc tạo ảnh thumb theo - R
  • rotation_angle (90, 180, 270, vrt, hor) : Chỉ ra góc quay khi xoay ảnh. Chú ý rằng PHP xoay theo chiều ngược chiều quay của kim đồng hồ, do đó góc xoay 90 độ về bên phải sẽ phải là 270 - X
  • x_axis : Thiết lập tọa độ X theo pixel để cắt ảnh. Ví dụ, có thiết lập là 30 thì sẽ cắt ảnh này đi 30 pixel tư bên trái - C
  • y_axis : Thiết lập tọa độ Y theo pixel để cắt ảnh. Ví dụ, có thiết lập là 30 thì sẽ cắt ảnh này đi 30 pixel tư bên trên đỉnh - C

5. Thiết lập các tham số trong file config.

Nếu bạn thích việc thiết lập các tham số ở trên thì bạn có thể đặt chúng vào trong file config. Rất đơn giản là tạo ra một file tên là image_lib.php, thêm mảng $config vào file này.

Sau đó lưu lại trong thư mục config, như vậy sau này nó sẽ được tự động sử dụng. Ta sẽ không cần sử dụng hàm $this->image_lib->initialize này nữa.

a. Hàm $this->image_lib->resize()

Hàm này cho phép ta thay đổi kích cỡ ảnh, tạo bản sao (có hoặc không thay đổi kích cỡ), hoặc tạo ảnh thumb.

Với mục đích thực tế thì không có sự khác biệt giữa việc tạo bản sao hay tạo ảnh thumb ngoại trừ là ảnh thumb thì có thêm bộ đánh dấu đi kèm ( phần _thumb đi kèm với tên ảnh thumb đó).

Hàm resize() sẽ tạo ra một ảnh thumb (kích thước không đổi) nếu bạn thiết lập tham số sau là TRUE:

$config['create_thumb'] = TRUE;

Hàm resize() tạo ra một ảnh bản sao (kích thước không đổi) nếu bạn thiết lập tham số sau :

$config['new_image'] = '/path/to/new_image.jpg';

Chú ý : Tùy vào cách ta thiết lập mà ta sẽ có kết quả như sau:

  • Nếu chỉ truyền vào tên ảnh thì nó sẽ được lưu vào cùng thư mục với ảnh gốc
  • Nếu truyền vào đường dẫn thì nó sẽ được lưu vào thư mục có đường dẫn này với tên trùng với tên ảnh gốc.
  • Nếu truyền vào cả tên và đường dẫn thì nó sẽ được lưu vào thư mục và tên này.

Nếu cả 2 tham số ở trên (create_thumb, và new_image) không được sử dụng, thì hàm resize() sẽ xử lý trên ảnh gốc.

b. Hàm $this->image_lib->crop().

Hàm này hoạt động gần giống hàm resize() trừ việc phải thêm vào 2 tham số trục X và Y ( theo pixel) để xác định cách thức cắt.

Ví dụ

$config['image_library'] = 'imagemagick';
$config['library_path'] = '/usr/X11R6/bin/';
$config['source_image']	= '/path/to/image/mypic.jpg';
$config['x_axis'] = '100';
$config['y_axis'] = '60';

$this->image_lib->initialize($config); 

if ( ! $this->image_lib->crop())
{
    echo $this->image_lib->display_errors();
}

c. Hàm $this->image_lib->rotate().

Hàm quay ảnh thì yêu cầu tham số góc quay.

$config['image_library'] = 'netpbm';
$config['library_path'] = '/usr/bin/';
$config['source_image']	= '/path/to/image/mypic.jpg';
$config['rotation_angle'] = 'hor';

$this->image_lib->initialize($config); 

if ( ! $this->image_lib->rotate())
{
    echo $this->image_lib->display_errors();
}

Có 5 tùy chọn góc quay là:

  • 90 - Quay ngược chiều kim đồng hồ 90 độ
  • 180 - Quay ngược chiều kim đồng hồ 180 độ
  • 270 - Quay ngược chiều kim đồng hồ 270 độ
  • hor - Lật ảnh theo chiều ngang
  • vrt - Lật ảnh theo chiều dọc

d. Hàm $this->image_lib->clear().

Hàm này dùng để thiết lập lại các giá trị được dùng khi xử lý ảnh. Ta thường sẽ gọi hàm này trong vòng lặp.

$this->image_lib->clear();

6. Làm mờ một ảnh.

Giống như các hàm ở trên thì quy trình chung của hàm watermark() là bao gồm việc thiết lập các tham số tương ứng với công việc cần thực hiện, sau đó là gọi hàm watermark() ra.

Ví dụ.

$config['source_image']	= '/path/to/image/mypic.jpg';
$config['wm_text'] = 'Copyright 2006 - John Doe';
$config['wm_type'] = 'text';
$config['wm_font_path'] = './system/fonts/texb.ttf';
$config['wm_font_size']	= '16';
$config['wm_font_color'] = 'ffffff';
$config['wm_vrt_alignment'] = 'bottom';
$config['wm_hor_alignment'] = 'center';
$config['wm_padding'] = '20';

$this->image_lib->initialize($config); 

$this->image_lib->watermark(); 

Đoạn mã trên sẽ dùng font kiểu True Type 16 pixel để tạo ra dòng chữ 'Copyright 2006 - John Doe'. Mặt nạ mờ sẽ được đặt vào ở cuối và giữa của bức ảnh khoảng 20 pixel tính từ phần đáy của ảnh.

Chúc các bạn thành công :)