search-view: update UI to match upstream

Latest GNOME applications follow a clear style of
searching and displaying results, with a no results
page.

To create a coherent usage between GNOME applications,
add the No results page to search popover.
This commit is contained in:
Georges Basile Stavracas Neto
2015-07-17 02:19:44 -03:00
parent 2aabc2615a
commit d644cbc8bf
2 changed files with 100 additions and 86 deletions
+78 -74
View File
@@ -1,55 +1,18 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated with glade 3.18.1 -->
<interface>
<requires lib="gtk+" version="3.10"/>
<requires lib="gtk+" version="3.16"/>
<template class="GcalSearchView" parent="GtkPopover">
<property name="visible">False</property>
<property name="can_focus">True</property>
<property name="width_request">600</property>
<property name="height_request">300</property>
<property name="can_focus">True</property>
<property name="border_width">12</property>
<property name="modal">False</property>
<child>
<object class="GtkGrid" id="grid">
<object class="GtkStack" id="stack">
<property name="visible">True</property>
<child>
<object class="GtkGrid" id="no_results_grid">
<property name="halign">center</property>
<property name="valign">center</property>
<property name="hexpand">True</property>
<property name="vexpand">True</property>
<property name="row_spacing">24</property>
<child>
<object class="GtkImage" id="image">
<property name="visible">True</property>
<property name="halign">center</property>
<property name="valign">center</property>
<property name="pixel_size">48</property>
<property name="icon_name">face-sad-symbolic</property>
</object>
<packing>
<property name="left_attach">0</property>
<property name="top_attach">0</property>
</packing>
</child>
<child>
<object class="GtkLabel" id="label">
<property name="visible">True</property>
<property name="halign">center</property>
<property name="valign">center</property>
<property name="label" translatable="yes">No results found</property>
</object>
<packing>
<property name="left_attach">0</property>
<property name="top_attach">1</property>
</packing>
</child>
</object>
<packing>
<property name="left_attach">0</property>
<property name="top_attach">0</property>
</packing>
</child>
<property name="can_focus">False</property>
<property name="transition_type">crossfade</property>
<child>
<object class="GtkScrolledWindow" id="scrolled_window">
<property name="visible">True</property>
@@ -60,46 +23,87 @@
<child>
<object class="GtkViewport" id="viewport">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="shadow_type">none</property>
<child>
<object class="GtkListBox" id="listbox">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="selection_mode">none</property>
<signal name="row-activated" handler="open_event" object="GcalSearchView" swapped="no"/>
</object>
</child>
<style>
<class name="search-viewport"/>
</style>
<child>
<object class="GtkGrid" id="search_grid">
<property name="visible">True</property>
<property name="hexpand">True</property>
<property name="vexpand">True</property>
<child>
<object class="GtkLabel" id="empty_search_label">
<property name="visible" bind-source="listbox" bind-property="visible" bind-flags="invert-boolean | bidirectional"/>
<property name="hexpand">True</property>
<property name="vexpand">True</property>
<property name="label" translatable="yes">Use the entry above to search for events.</property>
</object>
<packing>
<property name="left_attach">0</property>
<property name="top_attach">1</property>
</packing>
</child>
<child>
<object class="GtkListBox" id="listbox">
<property name="visible">True</property>
<property name="selection_mode">none</property>
<signal name="row-activated" handler="open_event" object="GcalSearchView" swapped="no"/>
</object>
<packing>
<property name="left_attach">0</property>
<property name="top_attach">1</property>
</packing>
</child>
</object>
</child>
</object>
</child>
</object>
<packing>
<property name="left_attach">0</property>
<property name="top_attach">1</property>
<property name="name">results</property>
</packing>
</child>
<child>
<object class="GtkBox" id="box">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="halign">center</property>
<property name="valign">center</property>
<property name="hexpand">True</property>
<property name="vexpand">True</property>
<property name="orientation">vertical</property>
<property name="spacing">12</property>
<child>
<object class="GtkImage" id="image">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="pixel_size">72</property>
<property name="icon_name">edit-find-symbolic</property>
<style>
<class name="dim-label"/>
</style>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">0</property>
</packing>
</child>
<child>
<object class="GtkLabel" id="title_label">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="label" translatable="yes">No results found</property>
<attributes>
<attribute name="weight" value="bold"/>
<attribute name="scale" value="1.44"/>
</attributes>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">1</property>
</packing>
</child>
<child>
<object class="GtkLabel" id="subtitle_label">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="label" translatable="yes">Try a different search</property>
<style>
<class name="dim-label"/>
</style>
</object>
<packing>
<property name="expand">False</property>
<property name="fill">True</property>
<property name="position">2</property>
</packing>
</child>
</object>
<packing>
<property name="name">no_results</property>
<property name="position">1</property>
</packing>
</child>
</object>
+22 -12
View File
@@ -35,8 +35,7 @@ typedef struct
typedef struct
{
GtkWidget *listbox;
GtkWidget *scrolled_window;
GtkWidget *no_results_grid;
GtkWidget *stack;
/* Since the user can have (literally)
* thousands of events, the usage of
@@ -279,8 +278,10 @@ show_no_results_page (GcalSearchView *view)
priv = gcal_search_view_get_instance_private (view);
priv->no_results_timeout_id = 0;
gtk_widget_set_visible (priv->scrolled_window, priv->num_results != 0);
gtk_widget_set_visible (priv->no_results_grid, priv->num_results == 0);
if (priv->query)
gtk_stack_set_visible_child_name (GTK_STACK (priv->stack), priv->num_results != 0 ? "results" : "no_results");
else
gtk_stack_set_visible_child_name (GTK_STACK (priv->stack), "results");
return G_SOURCE_REMOVE;
}
@@ -512,8 +513,7 @@ gcal_search_view_class_init (GcalSearchViewClass *klass)
/* bind things for/from the template class */
gtk_widget_class_set_template_from_resource (GTK_WIDGET_CLASS (klass), "/org/gnome/calendar/search-view.ui");
gtk_widget_class_bind_template_child_private (GTK_WIDGET_CLASS (klass), GcalSearchView, no_results_grid);
gtk_widget_class_bind_template_child_private (GTK_WIDGET_CLASS (klass), GcalSearchView, scrolled_window);
gtk_widget_class_bind_template_child_private (GTK_WIDGET_CLASS (klass), GcalSearchView, stack);
gtk_widget_class_bind_template_child_private (GTK_WIDGET_CLASS (klass), GcalSearchView, listbox);
gtk_widget_class_bind_template_callback (GTK_WIDGET_CLASS (klass), open_event);
@@ -539,6 +539,8 @@ static void
gcal_search_view_constructed (GObject *object)
{
GcalSearchViewPrivate *priv;
GtkWidget *placeholder_label;
priv = gcal_search_view_get_instance_private (GCAL_SEARCH_VIEW (object));
/* make the listbox sorted */
@@ -550,6 +552,18 @@ gcal_search_view_constructed (GObject *object)
/* don't fill the list with all events on startup */
gcal_search_view_search (GCAL_SEARCH_VIEW (object), NULL, NULL);
/* "type to search" label */
placeholder_label = g_object_new (GTK_TYPE_LABEL,
"label", _("Use the entry above to search for events."),
"expand", TRUE,
"valign", GTK_ALIGN_CENTER,
"halign", GTK_ALIGN_CENTER,
"visible", TRUE,
NULL);
gtk_style_context_add_class (gtk_widget_get_style_context (placeholder_label), "dim-label");
gtk_list_box_set_placeholder (GTK_LIST_BOX (priv->listbox), placeholder_label);
}
static void
@@ -798,8 +812,6 @@ gcal_search_view_search (GcalSearchView *view,
priv->query = g_strdup (query);
priv->field = g_strdup (field);
gtk_widget_show (priv->scrolled_window);
gtk_widget_hide (priv->no_results_grid);
/* Only perform search on valid non-empty strings */
if (query && g_utf8_strlen (query, -1) > 0)
@@ -817,16 +829,14 @@ gcal_search_view_search (GcalSearchView *view,
priv->current_utc_date = time (NULL);
gcal_manager_set_query (priv->manager, search_query);
gtk_widget_show (priv->listbox);
update_view (view);
g_free (search_query);
}
else
{
g_hash_table_remove_all (priv->uuid_to_event);
gtk_widget_hide (priv->listbox);
}
update_view (view);
}