When trying the Gnome health app on the pinephone there are a few noticeable problems as of release 0.93.3. The first one is the add data button. The problem with this is that the dialog box takes 600 units wide. This is more than can fit on the pinephone’s screen at the default 200% scaling factor. This means that the save and cancel buttons are hidden.
The first component that was needed to fix was the resizable property. This was set to 0 by default which means that resizing is disabled. Then next field that needed to be modified was the AdwViewSwitcherTitle object has to have a title property that needs to be bound to the title string property of the window HealthDataAddDialog. This allowed the title of the window to appear when Switcher can not fit on the screen.
The next part was to get the Switcher bar to appear on the bottom of the screen. This was done by creating a AdwViewSwitcherBar object. This should be on the lower part of the screen so it belongs below the rest of the main parts of the window. This was achieved by adding it bellow the AdwViewSwitcherBar object with the id of stack. The first property of this object was the stack property which was set to stack. This was done because the id of the stack that needs to be switched was stack. How i figured this out was because there was only one stack in this window and also because the AdwViewSwitcherTitle’s stack property was also called stack. The second property that needed to be set was the reveal property. This needed to be bound to the AdwViewSwitcherTitle object with the property that it binds to being called title-visible.
1--- a/data/ui/data_add_dialog.ui
2+++ b/data/ui/data_add_dialog.ui
3@@ -23,9 +23,9 @@
4 <template class="HealthDataAddDialog" parent="GtkDialog">
5 <property name="default-width">600</property>
6 <property name="default-height">300</property>
7- <property name="title" translatable="yes">Health Preferences</property>
8+ <property name="title" translatable="yes">Health add data</property>
9 <property name="modal">1</property>
10- <property name="resizable">0</property>
11+ <property name="resizable">1</property>
12 <child type="action">
13 <object class="GtkButton" id="button_cancel">
14 <property name="label" translatable="yes">_Cancel</property>
15@@ -47,6 +47,7 @@
16 <child type="title">
17 <object class="AdwViewSwitcherTitle" id="view_switcher_title">
18 <property name="stack">stack</property>
19+ <property name="title" bind-source="HealthDataAddDialog" bind-property="title" bind-flags="sync-create"/>
20 </object>
21 </child>
22 </object>
23@@ -57,6 +58,12 @@
24 <child>
25 <object class="AdwViewStack" id="stack"/>
26 </child>
27+ <child>
28+ <object class="AdwViewSwitcherBar" id="switcher_bar">
29+ <property name="stack">stack</property>
30+ <property name="reveal" bind-source="view_switcher_title" bind-property="title-visible" bind-flags="sync-create"/>
31+ </object>
32+ </child>
33 </object>
34 </child>
35 </template>