原文： http://zetcode.com/gui/tcltktutorial/widgets/

在 Tcl/Tk 教程的这一部分中，我们将介绍一些基本的 Tk 小部件。 我们将为checkbutton，label，scale和listbox小部件提供示例。

小部件是 GUI 应用的基本构建块。 多年来，几个小部件已成为所有 OS 平台上所有工具包中的标准。 例如，按钮，复选框或滚动条。 其中一些名称可能不同。 例如，一个复选框在 Tk 中称为复选框。 Tk 具有一小组可满足基本编程需求的小部件。 可以将更多专门的窗口小部件创建为自定义窗口小部件。

checkbutton

checkbutton是具有两种状态的窗口小部件：开和关。 接通状态通过复选标记显示。 它用来表示一些布尔属性。 checkbutton小部件提供一个带有文本标签的复选框。

  1. #!/usr/bin/wish
  3. # ZetCode Tcl/Tk tutorial
  4. #
  5. # This program toggles the title of the
  6. # window with the checkbutton widget.
  7. #
  8. # author: Jan Bodnar
  9. # last modified: March 2011
  10. # website: www.zetcode.com
  12. frame .fr
  13. pack .fr -fill both -expand 1
  14. checkbutton .fr.cb -text "Show title" -command onClick  \
  15.     -onvalue true -offvalue false -variable selected
  16. .fr.cb select 
  17. place .fr.cb -x 50 -y 50 
  19. proc onClick {} {
  21.     global selected
  23.     if {$selected==true} {
  25.         wm title . checkbutton
  26.     } else {
  27.         wm title . ""
  28.     }
  29. }
  31. wm title . checkbutton
  32. wm geometry . 250x150+300+300

在我们的示例中，我们在窗口上放置了一个检查按钮。 选中按钮显示/隐藏窗口的标题。

  1. checkbutton .fr.cb -text "Show title" -command onClick  \
  2.     -onvalue true -offvalue false -variable selected

checkbutton命令创建一个检查按钮小部件。 -text选项指定由小部件显示的文本。 当我们单击小部件时，将执行onClick过程。 选中checkbutton时，所选变量的值为真。 否则，它具有错误的值。

  1. .fr.cb select

最初，标题显示在标题栏中。 因此，一开始，我们使用select命令检查了小部件。

  1. place .fr.cb -x 50 -y 50

我们将检查按钮小部件放置在框架上的x = 50和y = 50坐标处。

  1. if {$selected==true} {
  3.     wm title . checkbutton
  4. } else {
  5.     wm title . ""
  6. }

在onClick过程中，我们根据所选变量显示或隐藏标题。

Tcl/Tk 小部件 - 图1

图：CheckButton

label

label小部件用于显示文本或图像。 没有用户交互。

  1. sudo apt-get install libtk-img

为了运行此示例，我们必须安装libtk-img包。

  1. #!/usr/bin/wish
  3. # ZetCode Tcl/Tk tutorial
  4. #
  5. # In this script, we use a label
  6. # widget to show an image.
  7. #
  8. # author: Jan Bodnar
  9. # last modified: March 2011
  10. # website: www.zetcode.com
  12. package require Img
  14. frame .fr
  15. pack .fr
  16. image create photo img -file "tatras.jpg"
  17. label .fr.lbl -image img
  18. pack .fr.lbl
  20. wm title . label
  21. wm geometry . +300+300

我们的示例在窗口上显示图像。

  1. package require Img

默认情况下，label小部件只能显示一组有限的图像类型。 要显示 JPG 图像，我们必须使用Img包。

  1. image create photo img -file "tatras.jpg"

我们根据文件系统上的图像创建照片图像。

  1. label .fr.lbl -image img

将照片图像提供给标签窗口小部件的image参数。

  1. pack .fr.lbl

图像包装在框架中。

  1. wm geometry . +300+300

我们指定 x 和 y 坐标。 这些用于在屏幕上放置窗口。 我们忽略了窗口的大小。 打包管理器会将窗口大小设置为图像大小。

HScale

scale是一个小部件，可让用户通过在有限间隔内滑动旋钮以图形方式选择一个值。 我们的示例将在标签小部件中显示一个选定的数字。

  1. #!/usr/bin/wish
  3. # ZetCode Tcl/Tk tutorial
  4. #
  5. # In this script, we show how to
  6. # use the scale widget.
  7. #
  8. # author: Jan Bodnar
  9. # last modified: March 2011
  10. # website: www.zetcode.com
  12. frame .fr
  13. pack .fr -fill both -expand 1
  15. scale .fr.scl -orient horizontal -from 0 -to 100 \
  16.     -length 150  -variable val -showvalue 0
  17. place .fr.scl -x 50 -y 50 
  19. label .fr.lbl -textvariable val
  20. place .fr.lbl -x 80 -y 110
  22. wm title . scale
  23. wm geometry . 250x150+300+300

上面的脚本中有两个小部件。 标尺和标签。 标签控件中显示了比例控件的值。

  1. scale .fr.scl -orient horizontal -from 0 -to 100 \
  2.     -length 150  -variable val -showvalue 0

scale小部件已创建。 -orient选项使窗口小部件水平。 我们提供-from和-to选项的上限和下限。 当前选择的数字存储在 val 变量中。 默认情况下，比例小部件还显示选定的数字。 使用-showvalue选项，我们将其隐藏。

  1. label .fr.lbl -textvariable val

label小部件已创建。 它将显示上述val变量。

Tcl/Tk 小部件 - 图2

图：scale小部件

listbox

listbox是显示对象列表的窗口小部件。 它允许用户选择一项或多项。

  1. #!/usr/bin/wish
  3. # ZetCode Tcl/Tk tutorial
  4. #
  5. # In this script, we show how to
  6. # use the listbox widget.
  7. #
  8. # author: Jan Bodnar
  9. # last modified: March 2011
  10. # website: www.zetcode.com
  12. frame .fr
  13. pack .fr -fill both -expand 1
  15. listbox .fr.lb 
  16. .fr.lb insert end "Scarlett Johansson" "Rachel Weiss" "Natalie Portman" \
  17.     "Jessica Alba" 
  19. bind .fr.lb <<ListboxSelect>> { setLabel [%W curselection]}
  21. place .fr.lb -x 20 -y 20 
  23. label .fr.lbl 
  24. place .fr.lbl -x 20 -y 210
  26. wm title . listbox
  27. wm geometry . 300x250+300+300
  29. proc setLabel { idx } {
  31.     set val [.fr.lb get $idx]
  32.     .fr.lbl configure -text $val
  34. }

在我们的示例中，我们显示了listbox中的女演员列表。 当前选择的女演员显示在标签小部件中。

  1. listbox .fr.lb

使用listbox命令创建列表框小部件。

  1. .fr.lb insert end "Scarlett Johansson" "Rachel Weiss" "Natalie Portman" \
  2.     "Jessica Alba"

在这里，我们将四个女演员插入小部件。

  1. bind .fr.lb <<ListboxSelect>> { setLabel [%W curselection]}

当我们在列表框中选择一个项目时，将生成<<ListboxSelect>>事件。 我们将setLabel过程绑定到此事件。 我们还向过程发送参数。 当前所选值的索引。 %W curselection返回索引。 %W是有关小部件的处理器，curselection是在此小部件上执行的命令。

  1. proc setLabel { idx } {
  3.     set val [.fr.lb get $idx]
  4.     .fr.lbl configure -text $val
  6. }

在setLabel过程中，我们根据获得的索引找出值。 此值稍后显示在标签窗口小部件中。

Tcl/Tk 小部件 - 图3

图：listbox小部件

在 Tcl/Tk 教程的这一部分中，我们介绍了几个 Tk 小部件。