Sans Ms][size=24]TẠO GIAO DIỆN NGƯỜ[/size]I DÙNG



Phần này sẽ hướng dẫn bạn cách thức để tạo nên một ứng dụng có giao diện hẳn hoi. Một điều quan trọng mà bạn cần nhớ là một ứng dụng trên windows không nhất thiết phải có giao diện (ví dụ như các dịch vụ của win) và các thao tác xử lý đối với một ứng dụng trên Windows là tập trung vào xử lý sự kiện xảy ra trên cửa sổ của ứng dụng đó. Ở đây, các bạn cần nắm được vài chú ý sau :



- Control ID : nó thực chất là một số nguyên (>0) đại diện cho control. Thông thường ta không biết số này là bao nhiêu (vì do hệ điều hành cung cấp khi chạy ứng dụng) và khi tạo ra một control ta thường gán nó vào một biến, biến đó là tên đại diện, sẽ chứa ID của control đó. Do trên cửa sổ của bạn sẽ có nhiều thành phần, mỗi thành phần cần phải có một cái tên để quản lý và khai thác. Ví dụ bạn có hai nút bấm trên cửa sổ thì bạn phải đặt tên cho nút thứ nhất là btn1 (hoặc btnOK) và nút thứ hai là btn2 (btnCancel) chẳng hạn. Để khi người dùng nhấp chuột thì ta biết rằng nút bấm nào vừa được tác động.

- Control ID : là một số nguyên duy nhất, không bao giờ có sự trùng lặp (do bộ nhớ được phân chia để chứa các thành phần ).

- Handle : cái từ này tôi không biết nên dịch thế nào cho đúng nghĩa nhưng có thể tạm hiểu rằng , nó là một giá trị đặc biệt được tạo ra và gán vào một cửa sổ khi cửa sổ đó được tạo. Thông thường , handle chỉ được dùng cho cửa sổ , ít khi dùng cho control. Khi nói đến handle , người ta nghĩ ngay đến định danh của một cửa sổ (hay GUI). Và handle là một dạng dữ liệu đặc biệt , nó không phải chuỗi hay số.



Để tạo được một ứng dụng có giao diện đồ họa , thì thành phần bạn cần tạo đầu tiên chính là một cửa sổ. Sau khi có cửa sổ thì chúng ta sẽ tạo tiếp các thành phần con trên nó (các control).

Muốn tạo được cửa sổ ta cần gọi đến hàm GuiCreate. Có cú pháp hoàn chỉnh như sau :



GUICreate ( "title" [, width [, height [, left [, top [, style [, exStyle [, parent]]]]]]] )



Các phần được rào trong cặp dấu ngoặc vuông [ ] là tùy chọn, có thể có hoặc không. Trong đó ,

Các tham số

Title : là tiêu đề của cửa sổ (văn bản này sẽ hiển thị trên thanh tiêu đề khi cửa sổ xuất hiện).

Width : độ rộng của cửa sổ (tính theo pixel)

Heigh : chiều cao của cửa sổ (tính theo pixel)

Left : vị trí bên trái của màn hình (tương ứng với tọa độ x). Gán -1 là canh giữa màn hình. Nếu đã gán giá trị cho left, thì Top cũng phải được gán giá trị.

Top : vị trí phía trên của màn hình (tương ứng với tọa độ y). Gán -1 đề canh giữa màn hình

Style : xác định style (kiểu) cửa sổ. Xem trong GUI Control Styles Appendix của file help.

Sử dụng -1 để dùng style mặc định, bao gồm các giá trị sau : $WS_MINIMIZEBOX, $WS_CAPTION, $WS_POPUP, $WS_SYSMENU.

Các style $WS_CLIPSIBLINGS, và $WS_SYSMENU luôn được sử dụng nếu như style $WS_MAXIMIZEBOX hoặc $WS_SIZEBOX được chỉ định.

exStyle : xác định style mở rộng cho cửa sổ (xem bảng Extended Style Table bên dưới ). Mặc định là -1.

Parent : handle của cửa sổ đã được tạo ra trước đó. Cửa sổ sắp tạo ra sẽ là con của cửa sổ có handle vừa gán.



Trả về

Thành công : hàm trả về handle của cửa sổ

Hỏng : hàm trả về 0 và gán @error = 1



Chú ý

ü Hai tham số Left và Top sẽ xác định vị trí xuất hiện của hộp thoại trên màn hình. Điểm giao nhau của hai tham số này chính là góc trái trên của hộp thoại.

ü Theo mặc định, các cửa sổ được tạo ra sẽ không thể có chức năng resize (dùng chuột để kéo lớn hoặc thu nhỏ kích thước của cửa sổ) và phóng lớn cực đại (maximize). Vì thế, khi bạn muốn sử dụng bất kỳ tính năng nào ở trên thì có thể thêm vào tham số style các giá trị WS_SIZEBOX hoặc WS_MAXIMIZEBOX.

ü Tuy nhiên, khi sử dụng WS_SIZEBOX thì các style WS_MINIMIZEBOX, WS_CAPTION, WS_POPUP, WS_SYSMENU lại không được thiết lập. Cách tốt nhất để tạo nên một hộp thoại có thể resize là sử dụng WS_OVERLAPPEDWINDOW.

ü Khi dùng $WS_EX_MDICHILD cho tham số style mở rộng , thì vị trí cửa sổ là vị trí liên hệ đến vùng client của cửa sổ bố-mẹ (parent). Tham số $WS_EX_LAYERED cho phép có một bức ảnh trong suốt bên trên ảnh nền đã định nghĩa trong cửa sổ parent.

ü Để kết hợp các style do bạn chỉ định với style mặc định, ta sử dụng : BitOr($GUI_SS_DEFAULT_GUI, newstyle,...).

ü Muốn sử dụng được các hằng số liên quan đến GUICreate, bạn cần gọi #include <WindowsConstants.au3>



Bảng các style mở rộng (Extended style table)



Style mở rộng
Kết quả

$WS_EX_ACCEPTFILES
Cho phép một control edit hoặc input được tạo trên GUI có thể nhận được tên của file được kéo và thả vào. Control cũng phải được gán trạng thái $GUI_DROPACCEPTED bằng hàm GUICtrlSetState. Đối vớ các control khác, thông tin của việc drag&drop có thể được truy lại với @GUI_DRAGID, @GUI_DRAGFILE, @GUIDROPID.

$WS_EX_APPWINDOW
Yêu cầu cửa sổ luôn nổi ở-trên thanh taskbar khi nó xuất hiện.

$WS_EX_CLIENTEDGE
Cửa sổ sẽ được bao với viền bị trũng xuống (sunken).

$WS_EX_CONTEXTHELP
Bao gồm một dấu chấm hỏi ở thanh tiêu đề của cửa sổ. Không dùng được với WS_MAXIMIZEBOX hoặc WS_MINIMIZEBOX.

$WS_EX_DLGMODALFRAME
Tạo một cửa sổ có viền lớn gấp đôi bình thường. Tùy chọn, cửa sổ có thể được tạo với một thanh tiêu đề bằng cách chỉ định WS_CAPTION trong tham số style

$WS_EX_MDICHILD
Tạo một cửa sổ con bên trong cửa sổ bố-mẹ (simulation not real MDI).

$WS_EX_OVERLAPPEDWINDOW
Kết hợp style WS_EX_CLIENTEDGE và WS_EX_WINDOWEDGE

$WS_EX_STATICEDGE
Tạo một cửa sổ có viền chỉ bằng một phần ba so với bình thường , style này được sử dụng cho các mục không chấp nhận viêc nhập liệu của người dùng

$WS_EX_TOPMOST
GUI được tạo với style này sẽ luôn ở trên các cửa sổ khác, thậm chí khi GUI không được kích hoạt.

$WS_EX_TRANSPARENT
Cửa sổ sẽ xuất hiện trong suốt bởi vì các bit của những cửa sổ liên quan bên dưới đã được vẽ lại

$WS_EX_TOOLWINDOW
Tạo ra một cửa sổ chứa công cụ, ta còn gọi là floating toolbar (thanh công cụ trôi nổi). Cửa sổ chứa công cụ sẽ có một thanh tiêu đề và font chữ nhỏ hơn cửa sổ bình thường. Cứa sổ này sẽ không xuất hiện trong taskbar hoặc trong hộp thoại khi bạn Alt-Tab. Nếu cửa sổ chứa công cụ có một menu hệ thống, icon của nó sẽ không hiển thị trên thanh tiêu đề. Tuy nhiên, bạn có thể ép chúng hiển thị bằng cách gõ phím Alt-Space.

$WS_EX_WINDOWEDGE
Tạo cửa sổ được bao với viền nổi

$WS_EX_LAYERED
Tạo một cửa sổ được xếp thành lớp (layer). Chú ý rằng cái này không sử dụng được cho các cửa sổ con






Ví dụ 1

Đoạn mã này tạo ra một cửa sổ, trên đó có chứa một label và một button. Khi bạn nhấn vào Button sẽ tạo ra một số ngẫu nhiên và hiển thị ở label.



#include <GUIConstantsEx.au3>



$gui = GUICreate("Random number", 200, 100) ;tạo gui chính



;tạo nhãn sẽ hiển thị số vừa tạo

$label_num = GUICtrlCreateLabel("000", 20, 20, 160, 30)

;gán label này dùng font Arial, size là 14

GUICtrlSetFont(-1, 14, 400, 0, "Arial")

;tạo nút cấp phát số ngẫu nhiên

$button_gen = GUICtrlCreateButton("Generate random number", 20, 50, 160, 30)



GUISetState() ; hiển thị gui vừa tạo lên màn hình



while 1 ; vòng lặp xử lý thông điệp

$msg = GUIGetMsg() ;ghi nhận sự kiện xảy ra trên gui

Switch $msg

Case $GUI_EVENT_CLOSE ;nếu nhấn nút Close hoặc Alt-F4

ExitLoop ; thì thoát

Case $button_gen ;nếu nhấn nút cấp phát thì tạo số ngẫu nhiên

$num = Int(Random(-10^9, 10^9))

; gán vào label để hiển thị số vừa cấp phát

GUICtrlSetData($label_num, $num)

EndSwitch

WEnd



Ví dụ 2

Đoạn mã này minh họa việc tạo cửa sổ con có nền trong suốt bằng một ảnh gif.



#include <GUIConstantsEx.au3>

#include <WindowsConstants.au3>



Example( )



Func Example2()

Local $gui, $background, $pic, $basti_stay, $msg

Local $sFile = RegRead("HKEY_LOCAL_MACHINE\SOFTWARE\AutoIt v3\AutoIt", "InstallDir") & "\Examples\GUI\logo4.gif"



$gui = GUICreate("Background", 400, 100)

; background picture

$background = GUICtrlCreatePic(@SystemDir & "\oobe\images\mslogo.jpg", 0, 0, 400, 100)

GUISetState(@SW_SHOW)



; transparent MDI child window

$pic = GUICreate("", 169, 68, 0, 0, $WS_POPUP, BitOR($WS_EX_LAYERED, $WS_EX_MDICHILD), $gui)

; transparent pic

$basti_stay = GUICtrlCreatePic($sFile, 0, 0, 169, 68)

GUISetState(@SW_SHOW)



Do

$msg = GUIGetMsg()

Until $msg = $GUI_EVENT_CLOSE

EndFunc