用 Red 语言制作 GUI 对象

Question

我有以下简单的小面板代码：

view [
    t: text "label"
    f: field
    button "Click here" [t/text: f/text]    ]

但我必须制作 2 个并将它们放在一个窗口上。我想创建单个对象类并从中制作 2 个对象。我看到可以按如下方式创建对象：

obj: object [
    view [
        t: text "label"
        f: field
        button "Click here" [t/text: f/text] ]  ]

view [
    obj
    obj     ]

但我收到以下错误：

*** Script Error: VID - invalid syntax at: [obj obj]
*** Where: do
*** Stack: view layout cause-error 

如何做到这一点？谢谢你的帮助。

编辑：我尝试使用 do，但只能使用 does 进行管理：

  myview: object [
      show: does [view[
        below
        t: text "1st time"
        f: field "Enter value"
        button "Click here" [f/text "clicked"]
        area] ] ]

  myview/show

  print "READY TO SHOW 2nd OBJECT: "
  myview2: copy myview
  myview2/show

Answer 1

我想创建单个对象类并从中制作 2 个对象。

Red 中没有对象class 系统，因此在尝试更复杂的 GUI 构造之前，您应该首先尝试掌握基本的 Red 概念。 Red 是一种非常灵活的面向数据的语言，因此您可以利用它来发挥自己的优势，例如，构建参数化的块模板，并将它们组装成正确的 VID 代码块。这是一个例子：

make-row: func [label [string!] but-label [string!]][
    compose [
        t: text (label)
        f: field
        b: button (but-label) [face/extra/1/text: face/extra/2/text]
        do [b/extra: reduce [t f]]
    ]
]

view compose [
    (make-row "label" "Click") return
    (make-row "label2" "Click2")
]

了解人脸树（类似于 HTML DOM，只是简单得多），是掌握 Red 的 GUI 系统的重要部分。由于目前还没有太多文档（您可以从http://docs.red-lang.org开始），欢迎您在red/helpGitter room 提出实时问题。

Answer 2

要使用 objects 而不是 VID 方言，请将 view 替换为 layout：

lay: layout [
    t: text "label"
    f: field
    button "Click here" [t/text: f/text]
]

view lay

然后您可以像检查任何其他对象一样检查它：?? lay。

例如，用pane访问lay的内容：

>> ? lay/pane/1

不过，更有用的函数可能是dump-face：

>> dump-face lay
 Type: window Style: none Offset: 833x548 Size: 270x45 Text: "Red: untitled"
     Type: text Style: text Offset: 10x10 Size: 80x24 Text: "label"
     Type: field Style: field Offset: 100x10 Size: 80x24 Text: none
     Type: button Style: button Offset: 190x9 Size: 70x25 Text: "Click here"
== make object! [
    type: 'window
    offset: 833x548
 ...

panels 可用于将对象组合在一起：

>> dump-face blay: layout [p: panel button "hi"]
 Type: window Style: none Offset: none Size: 292x220 Text: none
     Type: panel Style: panel Offset: 10x10 Size: 200x200 Text: none
     Type: button Style: button Offset: 220x9 Size: 62x25 Text: "hi"
== make object! [
    type: 'window
    offset: none
    ...

但首先使用带有compose 的VID 方言可能更容易构建东​​西。

另见this question

Answer 3

我猜您正在寻找的是样式而不是对象来创建布局。到目前为止，Red 中还没有官方的风格化功能。但是您可以像这样动态创建布局

view repeat i 2 [
    tname: to-word rejoin ['t i]
    fname: to-word rejoin ['f i]
    append v: [] compose/deep [ 
        (to-set-word tname) text "label"
        (to-set-word fname) field
        button "click here"   [
          (to-set-path  compose [(tname) text])  
          (to-path  compose [(fname) text])
        ] 
    ] 
]

您可以将预定义的单词块多次附加到要查看的块中，您将获得重复的元素。

 txt_btn: [
    t: text "label"
    f: field
    button "Click here" [t/text: f/text] 
 ] 
 view append append [] txt_btn txt_btn

当您在块中引用命名元素时，就会出现问题。但是一个词不能指向重复元素中的多个元素，因此在完整的解决方案中使用 compose 以创建唯一的名称。

也许 Red 有一个错误，因为我认为 compose/deep 也会在里面做括号，不需要更多的 compose –