[gnome-software/gnome-3-10] Add a loading icon to empty tiles

From: Richard Hughes <rhughes src gnome org>
To: commits-list gnome org
Cc:
Subject: [gnome-software/gnome-3-10] Add a loading icon to empty tiles
Date: Mon, 14 Oct 2013 12:31:02 +0000 (UTC)
commit ae89c113306a6ef1e79af226139fc91b44ce3b41
Author: Matthias Clasen <mclasen redhat com>
Date:   Sat Oct 5 00:59:21 2013 -0400

    Add a loading icon to empty tiles
    
    Show a content-loading icon while we are waiting for initial
    content to appear.

 src/app-tile.ui       |    9 +++++
 src/feature-tile.ui   |   84 +++++++++++++++++++++++++++++--------------------
 src/gs-app-tile.c     |    4 ++
 src/gs-feature-tile.c |    4 ++
 src/gs-popular-tile.c |    4 ++
 src/popular-tile.ui   |   63 ++++++++++++++++++++++--------------
 6 files changed, 110 insertions(+), 58 deletions(-)
---
diff --git a/src/app-tile.ui b/src/app-tile.ui
index 7a7c86d..3f3ca83 100644
--- a/src/app-tile.ui
+++ b/src/app-tile.ui
@@ -17,6 +17,15 @@
             <property name="halign">fill</property>
             <property name="valign">fill</property>
             <child type="overlay">
+              <object class="GtkImage" id="waiting">
+                <property name="visible">True</property>
+                <property name="halign">center</property>
+                <property name="valign">center</property>
+                <property name="pixel-size">16</property>
+                <property name="icon-name">content-loading-symbolic</property>
+              </object>
+            </child>
+            <child type="overlay">
               <object class="GtkEventBox" id="eventbox">
                 <property name="no_show_all">True</property>
                 <property name="visible_window">True</property>
diff --git a/src/feature-tile.ui b/src/feature-tile.ui
index 77c70aa..4c4d02e 100644
--- a/src/feature-tile.ui
+++ b/src/feature-tile.ui
@@ -11,57 +11,73 @@
           <class name="featured-tile"/>
         </style>
         <child>
-          <object class="GsBox" id="box">
+          <object class="GtkOverlay" id="overlay">
             <property name="visible">True</property>
-            <property name="hexpand">True</property>
-            <child>
-              <object class="GtkEventBox" id="image">
+            <property name="halign">fill</property>
+            <property name="valign">fill</property>
+            <child type="overlay">
+              <object class="GtkImage" id="waiting">
                 <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="visible_window">True</property>
-                <property name="height_request">240</property>
-                <style>
-                  <class name="featured-image"/>
-                </style>
+                <property name="halign">center</property>
+                <property name="valign">center</property>
+                <property name="pixel-size">16</property>
+                <property name="icon-name">content-loading-symbolic</property>
               </object>
-              <packing>
-                <property name="relative_size">1.0</property>
-              </packing>
             </child>
             <child>
-              <object class="GtkBox" id="box2">
+              <object class="GsBox" id="box">
                 <property name="visible">True</property>
-                <property name="orientation">vertical</property>
-                <property name="margin">40</property>
+                <property name="hexpand">True</property>
                 <child>
-                  <object class="GtkLabel" id="title">
+                  <object class="GtkEventBox" id="image">
                     <property name="visible">True</property>
-                    <property name="xalign">0</property>
-                    <property name="halign">start</property>
-                    <property name="valign">end</property>
-                    <property name="wrap">True</property>
-                    <attributes>
-                      <attribute name="scale" value="2.5"/>
-                      <attribute name="weight" value="700"/>
-                    </attributes>
+                    <property name="can_focus">False</property>
+                    <property name="visible_window">True</property>
+                    <property name="height_request">240</property>
+                    <style>
+                      <class name="featured-image"/>
+                    </style>
                   </object>
                   <packing>
-                    <property name="expand">True</property>
+                    <property name="relative_size">1.0</property>
                   </packing>
                 </child>
                 <child>
-                  <object class="GtkLabel" id="subtitle">
+                  <object class="GtkBox" id="box2">
                     <property name="visible">True</property>
-                    <property name="wrap">True</property>
-                    <property name="xalign">0</property>
-                    <property name="halign">start</property>
-                    <property name="valign">start</property>
+                    <property name="orientation">vertical</property>
+                    <property name="margin">40</property>
+                    <child>
+                      <object class="GtkLabel" id="title">
+                        <property name="visible">True</property>
+                        <property name="xalign">0</property>
+                        <property name="halign">start</property>
+                        <property name="valign">end</property>
+                        <property name="wrap">True</property>
+                        <attributes>
+                          <attribute name="scale" value="2.5"/>
+                          <attribute name="weight" value="700"/>
+                        </attributes>
+                      </object>
+                      <packing>
+                        <property name="expand">True</property>
+                      </packing>
+                    </child>
+                    <child>
+                      <object class="GtkLabel" id="subtitle">
+                        <property name="visible">True</property>
+                        <property name="wrap">True</property>
+                        <property name="xalign">0</property>
+                        <property name="halign">start</property>
+                        <property name="valign">start</property>
+                      </object>
+                    </child>
                   </object>
+                  <packing>
+                    <property name="relative_size">1.0</property>
+                  </packing>
                 </child>
               </object>
-              <packing>
-                <property name="relative_size">1.0</property>
-              </packing>
             </child>
           </object>
         </child>
diff --git a/src/gs-app-tile.c b/src/gs-app-tile.c
index 6ba86f6..9d27e9a 100644
--- a/src/gs-app-tile.c
+++ b/src/gs-app-tile.c
@@ -34,6 +34,7 @@ struct _GsAppTilePrivate
        GtkWidget       *name;
        GtkWidget       *summary;
        GtkWidget       *eventbox;
+       GtkWidget       *waiting;
 };
 
 G_DEFINE_TYPE_WITH_PRIVATE (GsAppTile, gs_app_tile, GTK_TYPE_BIN)
@@ -112,6 +113,8 @@ gs_app_tile_set_app (GsAppTile *tile, GsApp *app)
                return;
        priv->app = g_object_ref (app);
 
+       gtk_widget_hide (priv->waiting);
+
         g_signal_connect (priv->app, "notify::state",
                           G_CALLBACK (app_state_changed), tile);
         app_state_changed (priv->app, NULL, tile);
@@ -180,6 +183,7 @@ gs_app_tile_class_init (GsAppTileClass *klass)
        gtk_widget_class_bind_template_child_private (widget_class, GsAppTile, name);
        gtk_widget_class_bind_template_child_private (widget_class, GsAppTile, summary);
         gtk_widget_class_bind_template_child_private (widget_class, GsAppTile, eventbox);
+        gtk_widget_class_bind_template_child_private (widget_class, GsAppTile, waiting);
 }
 
 GtkWidget *
diff --git a/src/gs-feature-tile.c b/src/gs-feature-tile.c
index e8076ed..f621ccf 100644
--- a/src/gs-feature-tile.c
+++ b/src/gs-feature-tile.c
@@ -33,6 +33,7 @@ struct _GsFeatureTilePrivate
        GtkWidget       *image;
        GtkWidget       *title;
        GtkWidget       *subtitle;
+       GtkWidget       *waiting;
        GtkCssProvider  *provider;
 };
 
@@ -105,6 +106,8 @@ gs_feature_tile_set_app (GsFeatureTile *tile, GsApp *app)
 
        priv->app = g_object_ref (app);
 
+       gtk_widget_hide (priv->waiting);
+
         g_signal_connect (priv->app, "notify::state",
                           G_CALLBACK (app_state_changed), tile);
         app_state_changed (priv->app, NULL, tile);
@@ -202,6 +205,7 @@ gs_feature_tile_class_init (GsFeatureTileClass *klass)
        gtk_widget_class_bind_template_child_private (widget_class, GsFeatureTile, image);
        gtk_widget_class_bind_template_child_private (widget_class, GsFeatureTile, title);
        gtk_widget_class_bind_template_child_private (widget_class, GsFeatureTile, subtitle);
+       gtk_widget_class_bind_template_child_private (widget_class, GsFeatureTile, waiting);
 }
 
 GtkWidget *
diff --git a/src/gs-popular-tile.c b/src/gs-popular-tile.c
index c272d48..c5df049 100644
--- a/src/gs-popular-tile.c
+++ b/src/gs-popular-tile.c
@@ -33,6 +33,7 @@ struct _GsPopularTilePrivate
        GtkWidget       *label;
        GtkWidget       *image;
        GtkWidget       *eventbox;
+       GtkWidget       *waiting;
 };
 
 G_DEFINE_TYPE_WITH_PRIVATE (GsPopularTile, gs_popular_tile, GTK_TYPE_BIN)
@@ -107,6 +108,8 @@ gs_popular_tile_set_app (GsPopularTile *tile, GsApp *app)
                return;
        priv->app = g_object_ref (app);
 
+        gtk_widget_hide (priv->waiting);
+
        g_signal_connect (priv->app, "notify::state",
                          G_CALLBACK (app_state_changed), tile);
        app_state_changed (priv->app, NULL, tile);
@@ -171,6 +174,7 @@ gs_popular_tile_class_init (GsPopularTileClass *klass)
        gtk_widget_class_bind_template_child_private (widget_class, GsPopularTile, label);
        gtk_widget_class_bind_template_child_private (widget_class, GsPopularTile, image);
        gtk_widget_class_bind_template_child_private (widget_class, GsPopularTile, eventbox);
+       gtk_widget_class_bind_template_child_private (widget_class, GsPopularTile, waiting);
 }
 
 GtkWidget *
diff --git a/src/popular-tile.ui b/src/popular-tile.ui
index 8443489..8479435 100644
--- a/src/popular-tile.ui
+++ b/src/popular-tile.ui
@@ -26,6 +26,15 @@
                 <property name="halign">fill</property>
                 <property name="valign">fill</property>
                 <child type="overlay">
+                  <object class="GtkImage" id="waiting">
+                    <property name="visible">True</property>
+                    <property name="halign">center</property>
+                    <property name="valign">center</property>
+                    <property name="pixel-size">16</property>
+                    <property name="icon-name">content-loading-symbolic</property>
+                  </object>
+                </child>
+                <child type="overlay">
                   <object class="GtkEventBox" id="eventbox">
                     <property name="no_show_all">True</property>
                     <property name="visible_window">True</property>
@@ -48,34 +57,40 @@
                   </object>
                 </child>
                 <child>
-                  <object class="GtkBox" id="box">
+                  <object class="GtkEventBox" id="eboxbox">
                     <property name="visible">True</property>
-                    <property name="orientation">vertical</property>
-                    <property name="valign">fill</property>
-                    <property name="margin">12</property>
-                    <child>
-                      <object class="GtkImage" id="image">
-                        <property name="visible">True</property>
-                        <property name="valign">center</property>
-                      </object>
-                      <packing>
-                        <property name="expand">True</property>
-                        <property name="fill">True</property>
-                      </packing>
-                    </child>
                     <child>
-                      <object class="GtkLabel" id="label">
+                      <object class="GtkBox" id="box">
                         <property name="visible">True</property>
-                        <property name="valign">end</property>
-                        <property name="margin">6</property>
-                        <property name="ellipsize">end</property>
-                        <property name="width_chars">10</property>
-                        <property name="max_width_chars">15</property>
+                        <property name="orientation">vertical</property>
+                        <property name="halign">fill</property>
+                        <property name="valign">fill</property>
+                        <property name="margin">12</property>
+                        <child>
+                          <object class="GtkImage" id="image">
+                            <property name="visible">True</property>
+                            <property name="valign">center</property>
+                          </object>
+                          <packing>
+                            <property name="expand">True</property>
+                            <property name="fill">True</property>
+                          </packing>
+                        </child>
+                        <child>
+                          <object class="GtkLabel" id="label">
+                            <property name="visible">True</property>
+                            <property name="valign">end</property>
+                            <property name="margin">6</property>
+                            <property name="ellipsize">end</property>
+                            <property name="width_chars">10</property>
+                            <property name="max_width_chars">15</property>
+                          </object>
+                          <packing>
+                            <property name="expand">False</property>
+                            <property name="fill">True</property>
+                          </packing>
+                        </child>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                      </packing>
                     </child>
                   </object>
                 </child>
[Date Prev][Date Next] [Thread Prev][Thread Next] [Thread Index] [Date Index] [Author Index]