UI xml文件中的Gtk HeaderBar ActionBar pack_start pack_end

时间:2018-02-02 10:51:58

标签: gtk3 glade vala gnome-3 genie

我们正在尝试使用Gnome-Builder / Meson / Glade / Flatpak开发应用程序用户界面Gtk3 / Vala / Genie。虽然Vala和其他Gtk文档中有许多Gtk.HeaderBar.pack_start( ... )Gtk.ActionBar.pack_start( ... )的示例,但我们无法在xml ui文件中找到使用示例。

所以问题是:如何将pack_start / pack_end与ui xml文件一起使用?是否有生成的xml ui文件的示例或如何在Glade中生成?它会作为HeaderBar / ActionBar的属性/属性/子项输入吗?这会是什么样的 - 一般结构是什么?如果它不是GtkChild,那么如何在Vala / Genie源文件中访问它?

提供以下简单的xml文件MainApplication.ui,例如,一个pack_startpack_end GtkColorButton如何GtkHeaderBar

<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated with glade 3.20.2 -->
<interface>
  <requires lib="gtk+" version="3.20"/>
  <template class="MainWindow" parent="GtkApplicationWindow">
    <property name="can_focus">False</property>
    <property name="default_width">1024</property>
    <property name="default_height">768</property>
    <child type="titlebar">
      <object class="GtkHeaderBar" id="header_bar">
        <property name="visible">True</property>
        <property name="can_focus">False</property>
        <property name="title">Test Application</property>
        <property name="subtitle">gnome.org</property>
        <property name="show_close_button">True</property>
      </object>
    </child>
    <child>
      <object class="GtkBox" id="content_box">
        <property name="visible">True</property>
        <property name="can_focus">False</property>
        <property name="orientation">vertical</property>
        <child>
          <placeholder/>
        </child>
        <child>
          <object class="GtkActionBar" id="action_bar">
            <property name="visible">True</property>
            <property name="can_focus">False</property>
          </object>
          <packing>
            <property name="expand">False</property>
            <property name="fill">True</property>
            <property name="position">1</property>
          </packing>
        </child>
      </object>
    </child>
  </template>
</interface>

这在源文件MainApplication.gs中使用如下:

[GtkTemplate (ui = "/org/gnome/application/ui/MainApplication.ui")]
class MainWindow : Gtk.ApplicationWindow

    [GtkChild]
    header_bar:Gtk.HeaderBar

    [GtkChild]
    action_bar:Gtk.ActionBar

    construct ( application:Gtk.Application )

        GLib.Object( application: application )

class MainApplication:Gtk.Application

    construct( id:string, flags:GLib.ApplicationFlags )

        /* set locale: ALL, "" */
        Intl.setlocale()

        /* set properties */
        set_application_id( id )
        set_flags( flags )

3 个答案:

答案 0 :(得分:6)

行。仅仅为了完成目的,在使用Glade之后我已经为ui xml文件生成了这个结构,该文件说明了如何在HeaderBar中打包。我根本找不到任何这样的例子,也无法在ui文件中找到任何包含此内容的源代码 - 大量以编程方式执行 - 但到目前为止还没有将其显示为xml。当<packing></packing>标记表明position(基于零)作为子元素的一部分包含在内时,就会出现魔术,即:

<packing>
  <property name="position">2</property>
</packing> 

似乎没有必要为第一个零索引子项包含打包标记。

对于最终打包,通过使用pack_type属性来实现神奇:

<packing>
  <property name="pack_type">end</property>
  <property name="position">1</property>
</packing>

因此,程序化pack_startpack_end的等效xml是pack_type属性。

在完整上下文中,以下说明了在包含GtkHeaderBar的标题栏中的使用:

<child type="titlebar">
  <object class="GtkHeaderBar" id="header_bar">
    <property name="visible">True</property>
    <property name="can_focus">False</property>
    <property name="title">Test Application</property>
    <property name="subtitle">gnome.org</property>
    <property name="show_close_button">True</property>
    <child>
      <object class="GtkButton">
        <property name="label">gtk-justify-fill</property>
        <property name="visible">True</property>
        <property name="can_focus">True</property>
        <property name="receives_default">True</property>
        <property name="use_stock">True</property>
        <property name="always_show_image">True</property>
      </object>
    </child>
    <child>
      <object class="GtkButton">
        <property name="label">gtk-edit</property>
        <property name="visible">True</property>
        <property name="can_focus">True</property>
        <property name="receives_default">True</property>
        <property name="use_stock">True</property>
        <property name="always_show_image">True</property>
      </object>
      <packing>
        <property name="position">1</property>
      </packing>
    </child>
    <child>
      <object class="GtkButton">
        <property name="label">gtk-find</property>
        <property name="visible">True</property>
        <property name="can_focus">True</property>
        <property name="receives_default">True</property>
        <property name="use_stock">True</property>
      </object>
      <packing>
        <property name="position">2</property>
      </packing>
    </child>
  </object>
</child>

答案 1 :(得分:3)

  

如何将pack_start / pack_end与ui xml文件一起使用?

你没有。这些方法用于以编程方式将子窗口小部件添加到容器窗口小部件。使用glade做到这一点可以避免使用代码进行操作。

  

是否有生成的xml ui文件的示例或如何生成   在格莱德内?

我不确定我在这里理解这个问题。 Glade生成xml ui定义文件。将它们与GtkBuilder一起使用将实例化您可以使用Gtk.Builder get_object方法检索的小部件。您正在使用另一个选项,称为Gtk复合模板。这允许您在glade中创建复合窗口小部件并将窗口小部件映射到您的代码类/类属性/字段,这将加速编码过程。你可以read more here

  

是否会将其作为属性/属性/子项输入   HeaderBar /动作条?

它足够灵活,可以将一个带有标题栏的Window类作为属性/字段,标题栏中的小部件也可以是窗口的属性或单独的关注点,并将标题栏作为复合小部件然后添加标题酒吧到窗口。对于最后一个选项,您需要以编程方式将标题栏设置为窗口,除非您已准备好处理glade窗口小部件目录,从而允许您在林间空地的左窗口小部件选项板上使用自己的标题栏复合窗口小部件。

  

这会是什么样的 - 一般结构是什么?如果它   不是GtkChild,那么如何在Vala / Genie中访问它   源文件?

如果它不是孩子,我们会认为它不在林间定义中,或者不在任何地方生活,所以它必须以编程方式实例化并添加到具有Gtk.Container add方法或特定容器添加的容器中pack_start/end等方法

  

提供以下简单的xml文件MainApplication.ui,for   怎么会有一个pack_start和pack_end给一个GtkColorButton   GtkHeaderBar?

您可以添加带有glade的GtkColorButton,命名它,将其设置为GtkChild并检索它。它将是您的复合窗口小部件的字段(假设您的代码和模板的使用)。

如果没有,那么您将创建一个新的Gtk.ColorButton实例,并将其以编程方式添加到Gtk.HeaderBar。由于Gtk.HeaderBar是一个容器(继承自Gtk.Container抽象类),因此您可以使用一些方法向其中添加子项:

  1. Gtk.HeaderBar pack_startpack_end
  2. Gtk.Container methods(add,add_with_properties ...)
  3. 示例,在Vala中,使用1和2添加Gtk.ColorButton

    1. header_bar.pack_start (new Gtk.ColorButton ());
    2. header_bar.add (new Gtk.ColorButton ());

答案 2 :(得分:0)

在 Glade 中使用“位置”选项卡也是完全可行的。

查看附加图片并注意我将第三个按钮放置在标题栏的右端。选择按钮,点击位置标签,选择“结束”作为位置。

Screenshot of Glade showing the position tab

Glade 预览还呈现最后打包的第三个按钮,就像在代码中调用 pack_end() 一样。

Screenshot of Glade preview