标题栏

我们的应用程序已经用了GtkHeaderBar，但至今它仍然只在顶端显示一个‘正常’的window titlebar。这有点多余，我们现在要用header bar 来替代titlebar。为了达到目的，我们将header bar移到窗口的直接子成员中，并把它设为titlebar。

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <interface>
  3.   <!-- interface-requires gtk+ 3.8 -->
  4.   <template class="ExampleAppWindow" parent="GtkApplicationWindow">
  5.     <property name="title" translatable="yes">Example Application</property>
  6.     <property name="default-width">600</property>
  7.     <property name="default-height">400</property>
  8.         <child type="titlebar">
  9.           <object class="GtkHeaderBar" id="header">
  10.             <property name="visible">True</property>
  11.             <property name="show-close-button">True</property>
  12.             <child>
  13.               <object class="GtkLabel" id="lines_label">
  14.                 <property name="visible">False</property>
  15.                 <property name="label" translatable="yes">Lines:</property>
  16.               </object>
  17.               <packing>
  18.                 <property name="pack-type">start</property>
  19.               </packing>
  20.             </child>
  21.             <child>
  22.               <object class="GtkLabel" id="lines">
  23.                 <property name="visible">False</property>
  24.               </object>
  25.               <packing>
  26.                 <property name="pack-type">start</property>
  27.               </packing>
  28.             </child>
  29.             <child type="title">
  30.               <object class="GtkStackSwitcher" id="tabs">
  31.                 <property name="visible">True</property>
  32.                 <property name="margin">6</property>
  33.                 <property name="stack">stack</property>
  34.               </object>
  35.             </child>
  36.             <child>
  37.               <object class="GtkToggleButton" id="search">
  38.                 <property name="visible">True</property>
  39.                 <property name="sensitive">False</property>
  40.                 <style>
  41.                   <class name="image-button"/>
  42.                 </style>
  43.                 <child>
  44.                   <object class="GtkImage" id="search-icon">
  45.                     <property name="visible">True</property>
  46.                     <property name="icon-name">edit-find-symbolic</property>
  47.                     <property name="icon-size">1</property>
  48.                   </object>
  49.                 </child>
  50.               </object>
  51.               <packing>
  52.                 <property name="pack-type">end</property>
  53.               </packing>
  54.             </child>
  55.             <child>
  56.               <object class="GtkMenuButton" id="gears">
  57.                 <property name="visible">True</property>
  58.                 <property name="direction">none</property>
  59.                 <property name="use-popover">True</property>
  60.                 <style>
  61.                   <class name="image-button"/>
  62.                 </style>
  63.               </object>
  64.               <packing>
  65.                 <property name="pack-type">end</property>
  66.               </packing>
  67.             </child>
  68.           </object>
  69.         </child>
  70.     <child>
  71.       <object class="GtkBox" id="content_box">
  72.         <property name="visible">True</property>
  73.         <property name="orientation">vertical</property>
  74.         <child>
  75.           <object class="GtkSearchBar" id="searchbar">
  76.             <property name="visible">True</property>
  77.             <child>
  78.               <object class="GtkSearchEntry" id="searchentry">
  79.                 <signal name="search-changed" handler="search_text_changed"/>
  80.                 <property name="visible">True</property>
  81.               </object>
  82.             </child>
  83.           </object>
  84.         </child>
  85.         <child>
  86.           <object class="GtkBox" id="hbox">
  87.             <property name="visible">True</property>
  88.             <child>
  89.               <object class="GtkRevealer" id="sidebar">
  90.                 <property name="visible">True</property>
  91.                 <property name="transition-type">slide-right</property>
  92.                 <child>
  93.                  <object class="GtkScrolledWindow" id="sidebar-sw">
  94.                    <property name="visible">True</property>
  95.                    <property name="hscrollbar-policy">never</property>
  96.                    <property name="vscrollbar-policy">automatic</property>
  97.                    <child>
  98.                      <object class="GtkListBox" id="words">
  99.                        <property name="visible">True</property>
  100.                        <property name="selection-mode">none</property>
  101.                      </object>
  102.                    </child>
  103.                  </object>
  104.                 </child>
  105.               </object>
  106.             </child>
  107.             <child>
  108.               <object class="GtkStack" id="stack">
  109.                 <signal name="notify::visible-child" handler="visible_child_changed"/>
  110.                 <property name="visible">True</property>
  111.               </object>
  112.             </child>
  113.           </object>
  114.         </child>
  115.       </object>
  116.     </child>
  117.   </template>
  118. </interface>

使用header bar的一个额外的好处是我们免费得到了一个回退项。如果这回退应用了，我们的应用程序将如下显示。

getting-started-app10.png

如果我们为窗口设定了图标，那么菜单按钮就是设定好的图标，而不是你现在看到的样子。