• 标题栏

    标题栏

    我们的应用程序已经用了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

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