GUI设计与制作入门

Posted 2020-09-23

GUI设计与制作入门
本人学习AutoIt还不到一年，可以说是新手，但在学习过程中得到众多AutoIt爱好者(konan、del888、COCO等)的大力帮助和有益启发。下文的编写纯属个人理解，深入学习还得看原文帮助文件。
AutoIt发展至今(已到V3.10版)，在GUI(图形界面)方面有不同程度的改进和提高。从目前函数语句增加情况看，设计一些比较复杂的应用程序应当说是不成问题的。我预测随着AutoIt版本进一步提高，GUI的设计功能将大大增强，到时GUI设计的编写器就如同VB6图形设计编写器一定能为我们设计程序应用提供极大的方便。
    AutoIt中的GUI是我们设计AutoIt可视应用程序的重要组成部分，也是基础部分。下面，我将从窗口的设计讲起。  
    (一)窗口的设计
    在GUI设计中，窗口的设计是最基本的。窗口一般由窗口名、窗口外形、窗口背景颜色和按钮等组成。
1、窗口设计的完整原文语句。GUICreate ( "title" [, width [, height [, left [, top [, style [, exStyle [, parent]]]]]]] )
窗口的基本语句是：
       GUICreate("窗口的设计", 200, 100)
在窗口的基本语句中：“窗口的设计”就是窗口文件名；“200”就是窗口的宽；“100”就是窗口的高。下面请看例子：
2、简单窗口的脚本(红色部分)与注解。
#include ：#include <外部脚本名称>
#include指包括所需的常量和变量。写任何GUI脚本都必须在脚本最前面写入 #include 语句。
GUICreate("我的窗口") 
默认时可不用标明宽与高，默认值一般是400与400。窗口的宽与高也可以使用变量来设计。如：$width=500, $height=500。
例子如下：
$width=500
$height=500
GuiCreate("我的窗口",$width,$height,(@DesktopWidth-$width)/2, (@DesktopHeight-$height)/2)
注解：(@DesktopWidth-$width)/2为屏幕左边到窗口的距离；(@DesktopHeight-$height)/2为屏幕顶部到窗口的距离。屏幕宽与高是与显示器的分辩率一致的。另外还有风格函数可以继续往后加入，但意义不是很大。对于初学者建议用简单的方法。如GuiCreate("我的窗口",200,100)。要注意的是，窗口宽与高的值不要大于显示器的分辩率值。
GUISetState (@SW_SHOW)
显示窗口。如果@SW_SHOW改为@SW_HIDE则窗口隐藏。详情见帮助文件：GUISetState项中的参数。也可什么都不加，默认值是显示窗口。即：GUISetState ()。
下面是运行对话框直至窗口关闭的循环语句。
While 1
    $msg = GUIGetMsg()
    If $msg = $GUI_EVENT_CLOSE Then ExitLoop
Wend

如图：
[attach]1154[/attach]
下面是宽与高为200和100的窗口图片
[attach]1155[/attach]
由此可见，GUI设计窗口并非那么复杂，只要设置好几个关键值就可以了。
3、窗口背景色彩的设计。
窗口背景色彩设计主要运用下列语句来解决。
背景色彩设计完整原文语句是：GUISetBkColor ( background [, winhandle] )
用法：GUISetBkColor语句必须紧跟GUICreate语句。括号里的参数可自行设定。实例：
#include
GUICreate ("My GUI")
GUISetBkColor (0xE0FFFF)  ; 设置自己喜欢的色彩
GUISetState  ()     
While 1
    $msg = GUIGetMsg()
    If $msg = $GUI_EVENT_CLOSE  Then ExitLoop
Wend
[attach]1156[/attach]
在GUISetBkColor (0xE0FFFF)语句中“0xE0FFFF”是色彩值；“E0FFFF”色彩代码。改变色彩只要改变代码即可。上图中的色彩代码分别是“E0FFFF”和“FF0033”。
4、窗口按钮的设计。
设计按钮是为了达到控制与应用的目的。设计按钮的完整语句是：
GUICtrlCreateButton ( "text", left, top [, width [, height [, style [, exStyle]]]] )
可以看出按钮语句是由“按钮名、按钮与窗口左边距、按钮与窗口顶边距、按钮形状的宽、按钮形状的高、按钮的外形风格”等组成。
下面是按钮不同参数的图形：
[attach]1157[/attach] [attach]1158[/attach]

左图的按钮语句是：
GUICtrlCreateButton ("OK",  10, 30, 50)
GUICtrlCreateButton ( "Cancel", 60, 30, 50)
右图的按钮语句是：
GUICtrlCreateButton ("OK",  10, 30, 50)
GUICtrlCreateButton ( "Cancel", 10, 60, 50)
从以上两组按钮语句看，要比原文按钮语句简单的多，这也是GUI易学的奥妙。当然，复杂的语句也是可以掌握好的。如按钮与图标叠加的设计，只要加上相应的语句即可。完整脚本如下：
#include
GUICreate ("我的图标按钮",400,200)
GUISetBkColor (0xE0FFFF)  ; 设置自己喜欢的色彩
GUICtrlCreateButton ("我的图标按钮", 10,20,40,40, $BS_ICON)
GUICtrlSetImage (-1, "shell32.dll",43)
GUICtrlCreateButton ("我的图标按钮", 80,20,40,40, $BS_ICON)
GUICtrlSetImage (-1, "shell32.dll",31)
GUICtrlCreateButton ("我的图标按钮", 150,20,40,40, $BS_ICON)
GUICtrlSetImage (-1, "shell32.dll",22)
GUISetState  ()     
While 1
    $msg = GUIGetMsg()
    If $msg = $GUI_EVENT_CLOSE  Then ExitLoop
Wend

脚本窗口图形如下图

[attach]1159[/attach]
当然，按钮还可以叠加图片等，只要设置好函数语句就可以了。设置的方法是在GUICtrlCreateButton ("我的图标按钮", 10,20,40,40, $BS_ICON)语句中，改变$BS_ICON即可。详情见帮助文件：GUI Control Styles项中的Push Button Styles参数。以上仅仅是把按钮设计出来了，但真正要起作用还需要修改和增加语句。关于按钮的控制与应用将在第二讲中详细解答。
p处理 2008-5-3 17:09
二)按钮的控制与应用
按钮的控制与应用主要是用来完成一项任务或控制某一个部件的动作。
    1、控制的基本方法。一般按钮使用变量来设计与控制。即：
$OK = GUICtrlCreateButton ("按钮OK", 10,20,80,40)
$Cancel = GUICtrlCreateButton ("按钮Cancel", 150,20,80,40)
按钮的控制语句应放在循环判断语句当中。即：在下列循环判断语句当中"..."中加入控制语句。
While 1
      $msg = GUIGetMsg()
...
WEnd
示例脚本如下：
#include
GUICreate ("我的图标按钮",400,200)
GUISetBkColor (0xE0FFFF)  ; 设置自己喜欢的色彩
$OK = GUICtrlCreateButton ("按钮OK", 10,20,80,40)
$Cancel = GUICtrlCreateButton ("按钮Cancel", 150,20,80,40)
GUISetState(@SW_SHOW)
While 1
  $msg = GUIGetMsg()
  Select
    Case $msg = $ok
      MsgBox(0, "按钮的控制", "控制成功!")
    Case $msg = $GUI_EVENT_CLOSE or $msg = $Cancel
      MsgBox(0, "按钮的控制", "控制结束! 按确定或关闭窗口将自动退出程序...！")
      ExitLoop
  EndSelect
WEnd
    2、循环判断的设置。一般循环判断语句在While...Wend中通常用以下两种语句。即：Select...Case...EndSelect与If Then（或If...ElseIf...Else...EndIf）（详见帮助文件）。两种判断语句示例脚本：
      第一种：
While 1
  $msg = GUIGetMsg()
  Select
    Case $msg = $ok1
      MsgBox(0, "按钮的控制1", "控制1!")
    Case $msg = $ok2
      MsgBox(0, "按钮的控制", "控制2!")
    Case $msg = $ok3
      MsgBox(0, "按钮的控制", "控制3!")
    Case $msg = $ok4
      MsgBox(0, "按钮的控制", "控制4!")
...
    Case $msg = $GUI_EVENT_CLOSE or $msg = $Cancel
      MsgBox(0, "按钮的控制", "控制结束! ")
      ExitLoop
  EndSelect
WEnd
这一种判断语句可以设置无限的按钮，只要你的窗口能放下无限的按钮。每一个Case只能控制或完成一项任务，也就是一事一办。当然在Case里面还可以增加下一级或更多级的判断。如增加If Then语句，也可以增加Select...Case...EndSelect语句（这种情况较为复杂，新手不宜）。
    第二种：
While 1
$msg = GUIGetMsg()
  if  $msg = $exit  Then
     　MsgBox(0, "退出", "退出控制吗！")
       Exit
  　EndIf
if  $msg =  $ok1  Then
   　　$Box = MsgBox(0, "按钮的控制1", "控制1!")
    　　　　if  $Box = 1  Then  RUN("Setup1.exe")
      Exit
EndIf
if  $msg =  $ok2  Then
   　　$Box2 = MsgBox(0, "按钮的控制2", "控制2!")
    　　　　if  $Box2 = 1  Then  RUN("Setup2.exe")
      Exit
EndIf
if  $msg =  $ok3  Then
   　　$Box3 = MsgBox(0, "按钮的控制3", "控制3!")
    　　　　if  $Box3 = 1  Then 
                            RUN("Setup3.exe")
      　　　EndIf
EndIf
...
WEnd
         从示例看，这一种判断语句也同样可以设置无限的按钮，只要你的窗口能放下无限的按钮。每一个If Then也同样只能控制或完成一项任务。在If Then里面也可以增加下一级的判断。如增加Select...Case...EndSelect。看示例：
While 1
$msg = GUIGetMsg()
  if  $msg = $exit  Then
     　MsgBox(0, "退出", "退出控制吗！")
       Exit
  　EndIf
if  $msg =  $ok  Then
   　　Select
    　　　Case $msg = $ok1
      　　　　MsgBox(0, "按钮的控制1", "控制1!")
    　　　Case $msg = $ok2
      　　　　MsgBox(0, "按钮的控制", "控制2!")
    　　　Case $msg = $ok3
      　　　　MsgBox(0, "按钮的控制", "控制3!")
    　　　Case $msg = $ok4
      　　　　MsgBox(0, "按钮的控制", "控制4!")
              ...
   　　　 Case $msg = $GUI_EVENT_CLOSE  or  $msg = $Cancel
      　　　　MsgBox(0, "按钮的控制", "控制结束! ")
      　　　　ExitLoop
  　　　EndSelect
EndIf
WEnd
    3、注意的事项。在运用判断语句时，无论是用Select...Case...EndSelect语句，还是用If Then语句时，都要注意：设计任务或动作的脚本最好是在判断语句中一次运行完。另外，关闭窗口和退出的语句都不要忘记加上。如（$msg = $GUI_EVENT_CLOSE；$msg = $exit）。特别是在多级判断语句里，不要忘记退出循环的语句。如（ExitLoop；EndSelect；EndIf；WEnd）。
    关于GUI设计中的其他控件的制作与应用将在第三讲中详细解答。