[gnome-software] Improve layout of the overview page
- From: Matthias Clasen <matthiasc src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-software] Improve layout of the overview page
- Date: Fri, 23 Aug 2013 02:44:24 +0000 (UTC)
commit 749aa90f5526dc882b5c225c2d6acca1801117c1
Author: Matthias Clasen <mclasen redhat com>
Date: Thu Aug 22 22:43:21 2013 -0400
Improve layout of the overview page
Simplify the widgetry, by removing unnecessary alignments, replace
a 1-row grid by a box, and make the popular tiles grow, so they
line up with the categories.
src/gnome-software.ui | 87 ++++++++++++----------------------------------
src/gs-shell-overview.c | 19 ++++++----
2 files changed, 35 insertions(+), 71 deletions(-)
---
diff --git a/src/gnome-software.ui b/src/gnome-software.ui
index 62876cd..687599e 100644
--- a/src/gnome-software.ui
+++ b/src/gnome-software.ui
@@ -303,21 +303,16 @@
<property name="can_focus">False</property>
<property name="orientation">vertical</property>
<child>
- <object class="GtkAlignment" id="alignment1">
+ <object class="GtkLabel" id="label5">
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="left_padding">20</property>
+ <property name="xalign">0</property>
+ <property name="margin-left">20</property>
+ <property name="margin-right">20</property>
+ <property name="label" translatable="yes">Featured</property>
<style>
<class name="index-title-alignment-software"/>
</style>
- <child>
- <object class="GtkLabel" id="label5">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="xalign">0</property>
- <property name="label" translatable="yes">Featured</property>
- </object>
- </child>
</object>
<packing>
<property name="expand">False</property>
@@ -333,6 +328,8 @@
<property name="receives_default">False</property>
<property name="halign">center</property>
<property name="relief">none</property>
+ <property name="margin_left">12</property>
+ <property name="margin_right">12</property>
<child>
<object class="GtkImage" id="featured_image">
<property name="visible">True</property>
@@ -349,22 +346,17 @@
</packing>
</child>
<child>
- <object class="GtkAlignment" id="alignment2">
+ <object class="GtkLabel" id="label1">
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="top_padding">10</property>
- <property name="left_padding">20</property>
+ <property name="xalign">0</property>
+ <property name="label" translatable="yes">Picks</property>
+ <property name="margin-top">10</property>
+ <property name="margin-left">20</property>
+ <property name="margin-right">20</property>
<style>
<class name="index-title-alignment-software"/>
</style>
- <child>
- <object class="GtkLabel" id="label1">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="xalign">0</property>
- <property name="label" translatable="yes">Picks</property>
- </object>
- </child>
</object>
<packing>
<property name="expand">False</property>
@@ -374,42 +366,14 @@
</packing>
</child>
<child>
- <object class="GtkGrid" id="grid_popular">
+ <object class="GtkBox" id="box_popular">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="margin_left">12</property>
<property name="margin_right">12</property>
- <property name="row_spacing">12</property>
- <property name="column_spacing">12</property>
- <property name="row_homogeneous">True</property>
- <property name="column_homogeneous">True</property>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
- <child>
- <placeholder/>
- </child>
+ <property name="spacing">12</property>
+ <property name="homogeneous">True</property>
+ <property name="valign">start</property>
</object>
<packing>
<property name="expand">False</property>
@@ -418,22 +382,17 @@
</packing>
</child>
<child>
- <object class="GtkAlignment" id="alignment3">
+ <object class="GtkLabel" id="label6">
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="top_padding">10</property>
- <property name="left_padding">20</property>
+ <property name="xalign">0</property>
+ <property name="label" translatable="yes">Categories</property>
+ <property name="margin-top">10</property>
+ <property name="margin-left">20</property>
+ <property name="margin-right">20</property>
<style>
<class name="index-title-alignment-software"/>
</style>
- <child>
- <object class="GtkLabel" id="label6">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="xalign">0</property>
- <property name="label" translatable="yes">Categories</property>
- </object>
- </child>
</object>
<packing>
<property name="expand">False</property>
diff --git a/src/gs-shell-overview.c b/src/gs-shell-overview.c
index e88e879..b2eea9c 100644
--- a/src/gs-shell-overview.c
+++ b/src/gs-shell-overview.c
@@ -87,23 +87,28 @@ create_popular_tile (GsShellOverview *shell_overview, GsApp *app)
GtkWidget *button, *frame, *box, *image, *label;
GtkWidget *f;
- f = gtk_aspect_frame_new (NULL, 0.5, 0.5, 1, FALSE);
+ f = gtk_aspect_frame_new (NULL, 0.5, 0, 1, FALSE);
+ gtk_widget_set_valign (f, GTK_ALIGN_START);
gtk_frame_set_shadow_type (GTK_FRAME (f), GTK_SHADOW_NONE);
+ gtk_widget_set_size_request (f, -1, 200);
button = gtk_button_new ();
gtk_button_set_relief (GTK_BUTTON (button), GTK_RELIEF_NONE);
frame = gtk_aspect_frame_new (NULL, 0.5, 1, 1, FALSE);
gtk_frame_set_shadow_type (GTK_FRAME (frame), GTK_SHADOW_IN);
gtk_style_context_add_class (gtk_widget_get_style_context (frame), "view");
+ gtk_widget_set_halign (frame, GTK_ALIGN_FILL);
+ gtk_widget_set_valign (frame, GTK_ALIGN_FILL);
box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0);
gtk_container_add (GTK_CONTAINER (frame), box);
+ gtk_widget_set_valign (box, GTK_ALIGN_FILL);
image = gtk_image_new_from_pixbuf (gs_app_get_pixbuf (app));
+ gtk_widget_set_valign (image, GTK_ALIGN_CENTER);
g_object_set (box, "margin", 12, NULL);
- gtk_box_pack_start (GTK_BOX (box), image, FALSE, TRUE, 0);
+ gtk_box_pack_start (GTK_BOX (box), image, TRUE, TRUE, 0);
label = gtk_label_new (gs_app_get_name (app));
+ gtk_widget_set_valign (label, GTK_ALIGN_END);
g_object_set (label, "margin", 6, NULL);
gtk_box_pack_start (GTK_BOX (box), label, FALSE, TRUE, 0);
- gtk_widget_set_halign (frame, GTK_ALIGN_FILL);
- gtk_widget_set_valign (frame, GTK_ALIGN_FILL);
gtk_container_add (GTK_CONTAINER (button), frame);
gtk_container_add (GTK_CONTAINER (f), button);
gtk_widget_show_all (f);
@@ -143,11 +148,11 @@ gs_shell_overview_get_popular_cb (GObject *source_object,
goto out;
}
- grid = GTK_WIDGET (gtk_builder_get_object (priv->builder, "grid_popular"));
+ grid = GTK_WIDGET (gtk_builder_get_object (priv->builder, "box_popular"));
for (l = list, i = 0; l != NULL; l = l->next, i++) {
app = GS_APP (l->data);
tile = create_popular_tile (shell_overview, app);
- gtk_grid_attach (GTK_GRID (grid), tile, i, 0, 1, 1);
+ gtk_box_pack_start (GTK_BOX (grid), tile, TRUE, TRUE, 0);
}
out:
return;
@@ -441,7 +446,7 @@ gs_shell_overview_refresh (GsShellOverview *shell_overview, GCancellable *cancel
gtk_grid_attach (GTK_GRID (grid), tile, i % 3, i / 3, 1, 1);
}
- grid = GTK_WIDGET (gtk_builder_get_object (priv->builder, "grid_popular"));
+ grid = GTK_WIDGET (gtk_builder_get_object (priv->builder, "box_popular"));
container_remove_all (GTK_CONTAINER (grid));
/* get popular apps */
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
