[gnome-contacts] Make the address book windows adaptive



commit 34d701749fa83ec8c6e3eff19969fe451b7da1d0
Author: Adrien Plazas <kekun plazas laposte net>
Date:   Wed Jan 16 18:19:35 2019 +0100

    Make the address book windows adaptive
    
    Make the setup window and the address book selection dialog adaptive so
    they can fit in smaller screens.
    
    This also adapts the AccountsList to drop the included scrolled window.

 data/ui/contacts-accounts-list.ui | 25 +++----------
 data/ui/contacts-setup-window.ui  | 74 +++++++++++++++++++++++++--------------
 src/contacts-accounts-list.vala   | 18 ++++------
 src/contacts-app.vala             | 45 +++++++++++++++++-------
 src/contacts-setup-window.vala    |  4 +--
 5 files changed, 93 insertions(+), 73 deletions(-)
---
diff --git a/data/ui/contacts-accounts-list.ui b/data/ui/contacts-accounts-list.ui
index 2cfa2c3..555d791 100644
--- a/data/ui/contacts-accounts-list.ui
+++ b/data/ui/contacts-accounts-list.ui
@@ -1,26 +1,11 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
   <!-- interface-requires gtk+ 3.22 -->
-  <template class="ContactsAccountsList" parent="GtkBox">
+  <template class="ContactsAccountsList" parent="GtkListBox">
     <property name="visible">True</property>
-    <property name="orientation">vertical</property>
-    <property name="spacing">12</property>
-    <property name="width_request">420</property>
-    <child>
-      <object class="GtkScrolledWindow" id="scrolled">
-        <property name="visible">True</property>
-        <property name="min_content_height">210</property>
-        <property name="shadow_type">in</property>
-        <property name="hscrollbar_policy">never</property>
-        <property name="vscrollbar_policy">automatic</property>
-        <child>
-          <object class="GtkListBox" id="accounts_view">
-            <property name="visible">True</property>
-            <property name="selection_mode">none</property>
-            <property name="width_request">372</property>
-          </object>
-        </child>
-      </object>
-    </child>
+    <property name="selection_mode">none</property>
+    <style>
+      <class name="frame"/>
+    </style>
   </template>
 </interface>
diff --git a/data/ui/contacts-setup-window.ui b/data/ui/contacts-setup-window.ui
index f4f1b71..d78fd6b 100644
--- a/data/ui/contacts-setup-window.ui
+++ b/data/ui/contacts-setup-window.ui
@@ -57,36 +57,56 @@
       </object>
     </child>
     <child>
-      <object class="GtkGrid" id="content">
+      <object class="GtkScrolledWindow">
         <property name="visible">True</property>
-        <property name="valign">center</property>
-        <property name="halign">center</property>
-        <property name="border_width">12</property>
-        <property name="row_spacing">24</property>
-        <property name="orientation">vertical</property>
+        <property name="hscrollbar_policy">never</property>
+        <property name="propagate_natural_height">True</property>
         <child>
-          <object class="GtkLabel">
+          <object class="HdyColumn">
             <property name="visible">True</property>
-            <property name="halign">center</property>
-            <property name="label" translatable="yes">Welcome</property>
-            <attributes>
-              <attribute name="scale" value="3.5"/>
-            </attributes>
-          </object>
-        </child>
-        <child>
-          <object class="GtkLabel">
-            <property name="visible">True</property>
-            <property name="halign">center</property>
-            <property name="wrap">True</property>
-            <property name="max_width_chars">55</property>
-            <property name="label" translatable="yes">Please select your main address book: this is where 
new contacts will be added. If you keep your contacts in an online account, you can add them using the online 
accounts settings.</property>
-          </object>
-        </child>
-        <child>
-          <object class="GtkListBox" id="providers_list">
-            <property name="visible">True</property>
-            <property name="halign">center</property>
+            <property name="maximum_width">600</property>
+            <property name="linear_growth_width">400</property>
+            <property name="margin_top">32</property>
+            <property name="margin_bottom">32</property>
+            <property name="margin_start">12</property>
+            <property name="margin_end">12</property>
+            <child>
+              <object class="GtkGrid">
+                <property name="visible">True</property>
+                <property name="valign">center</property>
+                <property name="halign">center</property>
+                <property name="border_width">12</property>
+                <property name="row_spacing">24</property>
+                <property name="orientation">vertical</property>
+                <child>
+                  <object class="GtkLabel">
+                    <property name="visible">True</property>
+                    <property name="halign">center</property>
+                    <property name="ellipsize">end</property>
+                    <property name="label" translatable="yes">Welcome</property>
+                    <attributes>
+                      <attribute name="scale" value="3.5"/>
+                    </attributes>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkLabel">
+                    <property name="visible">True</property>
+                    <property name="halign">start</property>
+                    <property name="wrap">True</property>
+                    <property name="xalign">0</property>
+                    <property name="label" translatable="yes">Please select your main address book: this is 
where new contacts will be added. If you keep your contacts in an online account, you can add them using the 
online accounts settings.</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="HdyColumn" id="content">
+                    <property name="visible">True</property>
+                    <property name="maximum_width">400</property>
+                    <property name="linear_growth_width">400</property>
+                  </object>
+                </child>
+              </object>
+            </child>
           </object>
         </child>
       </object>
diff --git a/src/contacts-accounts-list.vala b/src/contacts-accounts-list.vala
index 0341a69..fb896b1 100644
--- a/src/contacts-accounts-list.vala
+++ b/src/contacts-accounts-list.vala
@@ -20,10 +20,7 @@ using Hdy;
 using Folks;
 
 [GtkTemplate (ui = "/org/gnome/Contacts/ui/contacts-accounts-list.ui")]
-public class Contacts.AccountsList : Box {
-  [GtkChild]
-  private ListBox accounts_view;
-
+public class Contacts.AccountsList : ListBox {
   private ListBoxRow last_selected_row;
 
   private Store contacts_store;
@@ -36,11 +33,10 @@ public class Contacts.AccountsList : Box {
     this.contacts_store = contacts_store;
     this.selected_store = null;
 
-    this.accounts_view.set_header_func (add_separator);
-    this.accounts_view.row_activated.connect (row_activated);
+    this.set_header_func (add_separator);
   }
 
-  private void row_activated (ListBoxRow? row) {
+  public override void row_activated (ListBoxRow row) {
     if (row == null)
       return;
 
@@ -66,7 +62,7 @@ public class Contacts.AccountsList : Box {
   }
 
   public void update_contents (bool select_active) {
-    foreach (var child in accounts_view.get_children ()) {
+    foreach (var child in get_children ()) {
       child.destroy ();
     }
 
@@ -113,7 +109,7 @@ public class Contacts.AccountsList : Box {
                      "hexpand", true);
       row.add_action (checkmark);
       row.set_data ("checkmark", checkmark);
-      accounts_view.add (row);
+      add (row);
 
       if (select_active &&
           persona_store == this.contacts_store.aggregator.primary_store) {
@@ -136,13 +132,13 @@ public class Contacts.AccountsList : Box {
                      "hexpand", true);
       local_row.add_action (checkmark);
       local_row.set_data ("checkmark", checkmark);
-      accounts_view.add (local_row);
+      add (local_row);
       if (select_active &&
           local_store == this.contacts_store.aggregator.primary_store) {
         row_activated (local_row);
       }
     }
 
-    accounts_view.show_all ();
+    show_all ();
   }
 }
diff --git a/src/contacts-app.vala b/src/contacts-app.vala
index 056350b..b0205b4 100644
--- a/src/contacts-app.vala
+++ b/src/contacts-app.vala
@@ -16,6 +16,7 @@
  */
 
 using Gtk;
+using Hdy;
 using Folks;
 
 public class Contacts.App : Gtk.Application {
@@ -113,24 +114,42 @@ public class Contacts.App : Gtk.Application {
   }
 
   public void change_address_book () {
-    var dialog = new Gtk.Dialog.with_buttons (_("Change Address Book"),
-                                         (Window) window,
-                                         DialogFlags.MODAL |
-                                         DialogFlags.DESTROY_WITH_PARENT |
-                                         DialogFlags.USE_HEADER_BAR,
-                                         _("Change"), ResponseType.OK,
-                                         _("Cancel"), ResponseType.CANCEL,
-                                         null);
+    var dialog = new Hdy.Dialog ((Window) window);
+    dialog.title = _("Change Address Book");
+    dialog.add_buttons (_("Change"), ResponseType.OK,
+                        _("Cancel"), ResponseType.CANCEL,
+                        null);
+
+    var content_area = dialog.get_content_area () as Box;
+    content_area.border_width = 0;
 
     var ok_button = dialog.get_widget_for_response (ResponseType.OK);
     ok_button.sensitive = false;
     ok_button.get_style_context ().add_class ("suggested-action");
-    dialog.set_resizable (false);
-    dialog.set_border_width (12);
+
+    var scrolled_window = new ScrolledWindow (null, null);
+    scrolled_window.expand = true;
+    scrolled_window.hscrollbar_policy = PolicyType.NEVER;
+    scrolled_window.propagate_natural_height = true;
+    content_area.add (scrolled_window);
+
+    var column = new Column ();
+    column.margin_top = 32;
+    column.margin_bottom = 32;
+    column.margin_start = 12;
+    column.margin_end = 12;
+    column.maximum_width = 400;
+    column.linear_growth_width = 400;
+    scrolled_window.add (column);
+
+    var box = new Box (Orientation.VERTICAL, 12);
+    box.valign = Align.START;
+    column.add (box);
 
     var explanation_label = new Label (_("New contacts will be added to the selected address book.\nYou are 
able to view and edit contacts from other address books."));
-    (dialog.get_content_area () as Box).add (explanation_label);
-    (dialog.get_content_area () as Box).set_spacing (12);
+    explanation_label.xalign = 0;
+    explanation_label.wrap = true;
+    box.add (explanation_label);
 
     var acc = new AccountsList (this.contacts_store);
     acc.update_contents (true);
@@ -145,7 +164,7 @@ public class Contacts.App : Gtk.Application {
        acc.update_contents (true);
       });
 
-    (dialog.get_content_area () as Box).add (acc);
+    box.add (acc);
 
     dialog.show_all ();
     dialog.response.connect ( (response) => {
diff --git a/src/contacts-setup-window.vala b/src/contacts-setup-window.vala
index 596fb2a..9a427f7 100644
--- a/src/contacts-setup-window.vala
+++ b/src/contacts-setup-window.vala
@@ -17,12 +17,13 @@
 
 using Gee;
 using Gtk;
+using Hdy;
 using Folks;
 
 [GtkTemplate (ui = "/org/gnome/Contacts/ui/contacts-setup-window.ui")]
 public class Contacts.SetupWindow : Gtk.ApplicationWindow {
   [GtkChild]
-  private Grid content;
+  private Column content;
 
   [GtkChild]
   private Button setup_done_button;
@@ -38,7 +39,6 @@ public class Contacts.SetupWindow : Gtk.ApplicationWindow {
     Object (application: app);
     this.setup_accounts_list = new AccountsList (store);
     this.setup_accounts_list.hexpand = true;
-    this.setup_accounts_list.halign = Align.CENTER;
     this.setup_accounts_list.show ();
     this.content.add (this.setup_accounts_list);
 


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]