Tương tự như chức năng thay đổi độ lớn nét vẽ, muốn thay đổi màu của nét vẽ ta cùng phải thông qua đối tượng paint của lớp MyView vì thế trong lớp này ta cần định nghĩa phương thức sau :
public void setMyColor(int c) { paint.setColor(c);
}
Màu sắc của nét vẽ có thể thay đổi thông qua việc nhấn vào các nút màu tương ứng trên giao diện. Tuy nhiên trên giao diện này chỉ có những màu cơ bản, để có thể lựa chọn nhiều màu sắc hơn, ta sẽ xây dựng một lớp riêng để hiển thị một dialog chọn màu, . Để chọn màu từ các nút màu cơ bản trên giao diện, ứng với mỗi nút này ta cần định nghĩa các phương thức tương ứng để thay đổi màu.
public void Green(View v) {
mview.setMyColor(Color.GREEN); temColor = Color.GREEN;
}
Phương thức này được gọi ứng với nút màu tương ứng : <ImageButton android:id="@+id/imageButton6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/green" android:onClick="Green"/>
Dialog chọn màu cũng được thế kế trong một lớp riêng (lớp ColorDialog) , trong lớp này cũng cần định nghĩa một phương thức để hiển thị dialog này lên màn hình. Phương thức này sẽ có 2 tham số truyền vào : 1 tham số là đối tượng của lớp MyView để gán màu thông qua tham số này, 1 tham số kiểu int để lưu giữ màu hiện tại. Trên dialog này ta có các thành phần chính: 1 ImageView để hiển thị vành khuyên chọn màu, 1 button để hiển thị màu hiện tại, 1 button để hiển thị màu đang lựa chọn , 1 ImageView hiển thị thanh màu chuyển từ đậm tới nhạt tương ứng với màu chọn trên vành khuyên.
Trong phương thức này ta cần khai báo một đối tượng thuộc lớp Bitmap, đây là nơi ta vẽ hình vành khuyên lên và hiển thị lên màn hình thông qua đối tượng ImageView . Để vẽ được lên đối tượng Bitmap đã khai báo ta cần khai báo thêm một đối tượng kiểu Paint và Canvas. Ta cần ghi đè lại phương thức onTouch(View v, MotionEvent event) để thực hiện đổi màu khi tay ta di chuyển trên vành khuyên .
Bố cục các thành phần trên dialog : tạo file color.xml với bố cục như hình bên dưới
Hình 13: Thiết kế giao diện của dialog chọn màu Tiêu đề LinearLayout: orientation=” vertical” ImageView Màu muốn chọn LinearLayout: orientation=”h orizontal”
Màu hiện tại
ImageButton
Vành khuyên chọn màu
Thanh màu chuyển từ đậm sang nhạt
Kết quả sau khi hoàn thành :
Hình 14: Dialog chọn màu