Thiết kế nút bấm bằng hình ảnh Image

[vbano1]

A. Thiết kế nút bấm trên UserForm
Đối với việc thiết kế nút bấm có chèn hình ảnh, chúng ta gặp khá nhiều khó khăn khi tùy chỉnh vị trí của ảnh trên nút bấm.

Bạn cần đăng nhập để thấy đính kèm

Chúng ta gặp vấn đề khó khăn là do tùy chỉnh mà Microsoft cho chúng ta là rất hạn chế, không thể tùy tiện đặt ở đâu thì đặt.
Vì vậy, thay vì sử dụng nút bấm thông thường, tôi nghĩ tới một cách đơn giản sau. Đó là sẽ sử dụng Image thay cho nút bấm.

Bước 1: Chuẩn bị hình ảnh cho nút bấm.
Ngay trên Excel, bạn có thể tùy ý vẽ cái gì cũng được. Cụ thể tôi sẽ dùng công cụ sau để vẽ nút bấm.

Bạn cần đăng nhập để thấy đính kèm

Việc chọn màu cho nút bấm cũng tùy ý theo thiết kế của bạn, không bị hạn chế gì. Kích thước nút bấm cũng là tùy ý.

Bạn cần đăng nhập để thấy đính kèm

Nếu như thiết kế nút bấm trực tiếp trên UserForm, việc lựa chọn font chữ nào cũng khiến chúng ta suy nghĩ. Ví dụ font chữ mà chúng ta định sử dụng nhưng trên máy tính người khác không có font chữ ấy thì sẽ ra sao. Vì vậy, so với cách làm thông thường, thì cách sử dụng hình ảnh như thế này sẽ có ưu điểm, đó là khi tạo hình ảnh thì tùy ý thiết kế, khi mang đi sử dụng thì không lo lắng máy tính đối phương ra làm sao.

Việc tiếp theo, tôi sẽ chèn ảnh GIF có nền trong suốt vào.

Bạn cần đăng nhập để thấy đính kèm

Bạn group các đối tượng trong bức ảnh để chúng liên kết với nhau.

Bạn cần đăng nhập để thấy đính kèm

Bạn copy bức ảnh bằng cách ấn Ctr+c.

Bước 2: Trên UserForm:

Bạn cần đăng nhập để thấy đính kèm

Chèn Image vào UserForm và chú ý thiết định như sau:

Bạn cần đăng nhập để thấy đính kèm

Trong đó chú ý phần Picture (màu xanh): Bạn đặt con trỏ vào vùng (None) và ấn Ctr+v.
Kết quả là:

Bạn cần đăng nhập để thấy đính kèm

Double Click vào nó để viết macro:

Private Sub Image1_Click()
    MsgBox "tuhocvba.net"
End Sub

Kết quả:

Bạn cần đăng nhập để thấy đính kèm

Đến đây có thể tạm coi như chúng ta đã xong phần cơ bản, phần sau, chúng ta sẽ suy nghĩ làm sao để có cảm giác tốt hơn với nút bấm của chúng ta.
(Còn nữa)

 

[Euler]

A. Thiết kế nút bấm trên UserForm
(Tiếp theo)
Lần này để có cảm giác nút bấm tốt hơn:

Bạn cần đăng nhập để thấy đính kèm

Kịch bản thay đổi màu nút bấm để có trải nghiệm tốt hơn đã từng trình bày ở đây, các bạn có thể xem lại:

Bạn cần đăng nhập để thấy link

Tôi sẽ làm như sau:
Bước 3: Chuẩn bị ảnh trên Excel
Tôi sửa lại ảnh nền của ảnh là màu xám trên Excel.

Bạn cần đăng nhập để thấy đính kèm

Tôi thực hiện copy bằng Ctr+c.
Bước 4: Trên UserForm.
Copy Image1, tôi tạo ra Image2 như sau:

Bạn cần đăng nhập để thấy đính kèm

Sau đó thực hiện di chuyển Image2 trùng vào vị trí Image1 bằng cách điều chỉnh lại thông tin Left và Top của Image2 cho giống thông tin của Image1.

Bạn cần đăng nhập để thấy đính kèm

Kết quả:

Bạn cần đăng nhập để thấy đính kèm

Ta viết code ẩn-hiện như sau:

Option Explicit

Private Sub Image1_Click()
    MsgBox "tuhocvba.net"
End Sub
Private Sub Image1_MouseMove(ByVal Button As Integer, ByVal Shift As Integer, ByVal X As Single, ByVal Y As Single)
    Image1.Visible = True 'xanh
    Image2.Visible = False  'Den
End Sub
Private Sub Image2_MouseMove(ByVal Button As Integer, ByVal Shift As Integer, ByVal X As Single, ByVal Y As Single)
    Image1.Visible = True 'xanh
    Image2.Visible = False  'Den
End Sub
Private Sub UserForm_MouseMove(ByVal Button As Integer, ByVal Shift As Integer, ByVal X As Single, ByVal Y As Single)
    Image1.Visible = False 'Xanh
    Image2.Visible = True   'Den
End Sub