Treeview (liststore) CSS question

classic Classic list List threaded Threaded
7 messages Options
Reply | Threaded
Open this post in threaded view
|

Treeview (liststore) CSS question

Gtk+ - Apps Dev mailing list
Is it possible to set different background for a treestore, with a
liststore, for populated rows v blank area.

ie: If I have a dynamic treeview I would like to have one background colour
for the rows and another for the treestore where there are no rows

The particular example has the following tree
Grid,Notebook,grid,scrolledwindow,treeview

thanks
Mike
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: Treeview (liststore) CSS question

Gtk+ - Apps Dev mailing list
On Tue, Mar 19, 2019 at 3:01 AM Mike Martin via gtk-app-devel-list <
[hidden email]> wrote:

> Is it possible to set different background for a treestore, with a
> liststore, for populated rows v blank area.
>
> ie: If I have a dynamic treeview I would like to have one background colour
> for the rows and another for the treestore where there are no rows
>
> The particular example has the following tree
> Grid,Notebook,grid,scrolledwindow,treeview
>

Use set_cell_data_func:
https://developer.gnome.org/gtk3/stable/GtkTreeViewColumn.html#gtk-tree-view-column-set-cell-data-func

You'd have to do this for every GtkTreeViewColumn you wanted to colour.
Your callback would then fetch whatever value you want to use as a test (
ie to test whether the row is 'empty' or not ), and set the renderer's
"background' property to whatever colour you're after ( the callback get's
passed the renderer ).

Dan
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: Treeview (liststore) CSS question

Mike Martin
Its not whether the row is empty, its whether it exists

On Mon, 18 Mar 2019 at 23:25, Daniel Kasak <[hidden email]> wrote:

> On Tue, Mar 19, 2019 at 3:01 AM Mike Martin via gtk-app-devel-list <
> [hidden email]> wrote:
>
>> Is it possible to set different background for a treestore, with a
>> liststore, for populated rows v blank area.
>>
>> ie: If I have a dynamic treeview I would like to have one background
>> colour
>> for the rows and another for the treestore where there are no rows
>>
>> The particular example has the following tree
>> Grid,Notebook,grid,scrolledwindow,treeview
>>
>
> Use set_cell_data_func:
>
> https://developer.gnome.org/gtk3/stable/GtkTreeViewColumn.html#gtk-tree-view-column-set-cell-data-func
>
> You'd have to do this for every GtkTreeViewColumn you wanted to colour.
> Your callback would then fetch whatever value you want to use as a test (
> ie to test whether the row is 'empty' or not ), and set the renderer's
> "background' property to whatever colour you're after ( the callback get's
> passed the renderer ).
>
> Dan
>
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: Treeview (liststore) CSS question

Gtk+ - Apps Dev mailing list
In reply to this post by Gtk+ - Apps Dev mailing list
Its not whether the row is empty, its whether it exists

On Mon, 18 Mar 2019 at 23:25, Daniel Kasak <[hidden email]> wrote:

> On Tue, Mar 19, 2019 at 3:01 AM Mike Martin via gtk-app-devel-list <
> [hidden email]> wrote:
>
>> Is it possible to set different background for a treestore, with a
>> liststore, for populated rows v blank area.
>>
>> ie: If I have a dynamic treeview I would like to have one background
>> colour
>> for the rows and another for the treestore where there are no rows
>>
>> The particular example has the following tree
>> Grid,Notebook,grid,scrolledwindow,treeview
>>
>
> Use set_cell_data_func:
>
> https://developer.gnome.org/gtk3/stable/GtkTreeViewColumn.html#gtk-tree-view-column-set-cell-data-func
>
> You'd have to do this for every GtkTreeViewColumn you wanted to colour.
> Your callback would then fetch whatever value you want to use as a test (
> ie to test whether the row is 'empty' or not ), and set the renderer's
> "background' property to whatever colour you're after ( the callback get's
> passed the renderer ).
>
> Dan
>
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: Treeview (liststore) CSS question

Mike Martin
In reply to this post by Gtk+ - Apps Dev mailing list
Resolved my issue, turns out I needed some voodoo with properties

$widgetpage{file_scroll}->set('propagate_natural_height','1');
 $widgetpage{file_scroll}->set_vexpand(0);

On Mon, 18 Mar 2019 at 16:01, Mike Martin <[hidden email]> wrote:

> Is it possible to set different background for a treestore, with a
> liststore, for populated rows v blank area.
>
> ie: If I have a dynamic treeview I would like to have one background
> colour for the rows and another for the treestore where there are no rows
>
> The particular example has the following tree
> Grid,Notebook,grid,scrolledwindow,treeview
>
> thanks
> Mike
>
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: Treeview (liststore) CSS question

Gtk+ - Apps Dev mailing list
In reply to this post by Gtk+ - Apps Dev mailing list
 
Hi Mike,

Have you tried

gtk_widget_set_vexpand(tree, FALSE);

on the treeview? This might work to show a different background color on the unused space of the treeview.

I don't know if this is of any help but also remember that you can set individual row colors in a treeview by having a color column. That way you can add some logic into what color the row is. Also, a selection color is easy to set with CSS.

Eric

  
//gcc -Wall stripe_list1.c -o stripe_list1 `pkg-config --cflags --libs gtk+-3.0`

#include<gtk/gtk.h>

enum
{
   ID,
   PROGRAM,
   COLOR,
   COLUMNS
};

int main(int argc, char *argv[])
  {
    gtk_init(&argc, &argv);

    GtkWidget *window=gtk_window_new(GTK_WINDOW_TOPLEVEL);
    gtk_window_set_title(GTK_WINDOW(window), "Stripes");
    gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
    gtk_window_set_default_size(GTK_WINDOW(window), 300, 300);
    gtk_widget_set_name(window, "main_window");
    g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);

    GtkTreeIter iter;
    GtkListStore *store=gtk_list_store_new(COLUMNS, G_TYPE_UINT, G_TYPE_STRING, G_TYPE_STRING);
    gtk_list_store_append(store, &iter);
    gtk_list_store_set(store, &iter, ID, 0, PROGRAM, "Gedit", COLOR, "cyan",  -1);
    gtk_list_store_append(store, &iter);
    gtk_list_store_set(store, &iter, ID, 1, PROGRAM, "Gimp", COLOR,  "yellow", -1);
    gtk_list_store_append(store, &iter);
    gtk_list_store_set(store, &iter, ID, 2, PROGRAM, "Inkscape", COLOR, "cyan", -1);
    gtk_list_store_append(store, &iter);
    gtk_list_store_set(store, &iter, ID, 3, PROGRAM, "Firefox", COLOR, "yellow", -1);
    gtk_list_store_append(store, &iter);
    gtk_list_store_set(store, &iter, ID, 4, PROGRAM, "Calculator", COLOR, "cyan", -1);
    gtk_list_store_append(store, &iter);
    gtk_list_store_set(store, &iter, ID, 5, PROGRAM, "Devhelp", COLOR, "yellow", -1);

    GtkWidget *tree=gtk_tree_view_new_with_model(GTK_TREE_MODEL(store));
    gtk_widget_set_name(tree, "tree_select");
    gtk_widget_set_hexpand(tree, TRUE);
    gtk_widget_set_vexpand(tree, FALSE);

    GtkCellRenderer *renderer1=gtk_cell_renderer_text_new();
    g_object_set(renderer1, "editable", FALSE, NULL);
  
    //Bind the COLOR column to the "cell-background" property.
    GtkTreeViewColumn *column1 = gtk_tree_view_column_new_with_attributes("ID", renderer1, "text", ID, "cell-background", COLOR, NULL);
    gtk_tree_view_append_column(GTK_TREE_VIEW(tree), column1);   
    GtkTreeViewColumn *column2 = gtk_tree_view_column_new_with_attributes("Program", renderer1, "text", PROGRAM, "cell-background", COLOR, NULL);
    gtk_tree_view_append_column(GTK_TREE_VIEW(tree), column2);
  
    GtkWidget *grid=gtk_grid_new();
    gtk_grid_attach(GTK_GRID(grid), tree, 0, 0, 1, 1);
    gtk_container_add(GTK_CONTAINER(window), grid);

    GError *css_error=NULL;
    gchar css_string[]="#main_window{background: purple;} #tree_select:selected{background: green;}";
    GtkCssProvider *provider = gtk_css_provider_new();
    GdkDisplay *display = gdk_display_get_default();
    GdkScreen *screen = gdk_display_get_default_screen(display);
    gtk_style_context_add_provider_for_screen(screen, GTK_STYLE_PROVIDER(provider), GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
    gtk_css_provider_load_from_data(provider, css_string, -1, &css_error);
    if(css_error!=NULL) g_print("CSS loader error %s\n", css_error->message);
    g_object_unref(provider);
  
    gtk_widget_show_all(window);
    gtk_main();
    return 0;  
  }

_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: Treeview (liststore) CSS question

Gtk+ - Apps Dev mailing list
apologies I did resolve my issue , posted as wrong person

Resolved my issue, turns out I needed some voodoo with properties

$widgetpage{file_scroll}->set('propagate_natural_height','1');
 $widgetpage{file_scroll}->set_vexpand(0);

On Tue, 19 Mar 2019 at 18:53, <[hidden email]> wrote:

>
> Hi Mike,
>
> Have you tried
>
> gtk_widget_set_vexpand(tree, FALSE);
>
> on the treeview? This might work to show a different background color on
> the unused space of the treeview.
>
> I don't know if this is of any help but also remember that you can set
> individual row colors in a treeview by having a color column. That way you
> can add some logic into what color the row is. Also, a selection color is
> easy to set with CSS.
>
> Eric
>
>
> //gcc -Wall stripe_list1.c -o stripe_list1 `pkg-config --cflags --libs
> gtk+-3.0`
>
> #include<gtk/gtk.h>
>
> enum
> {
>    ID,
>    PROGRAM,
>    COLOR,
>    COLUMNS
> };
>
> int main(int argc, char *argv[])
>   {
>     gtk_init(&argc, &argv);
>
>     GtkWidget *window=gtk_window_new(GTK_WINDOW_TOPLEVEL);
>     gtk_window_set_title(GTK_WINDOW(window), "Stripes");
>     gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
>     gtk_window_set_default_size(GTK_WINDOW(window), 300, 300);
>     gtk_widget_set_name(window, "main_window");
>     g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);
>
>     GtkTreeIter iter;
>     GtkListStore *store=gtk_list_store_new(COLUMNS, G_TYPE_UINT,
> G_TYPE_STRING, G_TYPE_STRING);
>     gtk_list_store_append(store, &iter);
>     gtk_list_store_set(store, &iter, ID, 0, PROGRAM, "Gedit", COLOR,
> "cyan",  -1);
>     gtk_list_store_append(store, &iter);
>     gtk_list_store_set(store, &iter, ID, 1, PROGRAM, "Gimp", COLOR,
> "yellow", -1);
>     gtk_list_store_append(store, &iter);
>     gtk_list_store_set(store, &iter, ID, 2, PROGRAM, "Inkscape", COLOR,
> "cyan", -1);
>     gtk_list_store_append(store, &iter);
>     gtk_list_store_set(store, &iter, ID, 3, PROGRAM, "Firefox", COLOR,
> "yellow", -1);
>     gtk_list_store_append(store, &iter);
>     gtk_list_store_set(store, &iter, ID, 4, PROGRAM, "Calculator", COLOR,
> "cyan", -1);
>     gtk_list_store_append(store, &iter);
>     gtk_list_store_set(store, &iter, ID, 5, PROGRAM, "Devhelp", COLOR,
> "yellow", -1);
>
>     GtkWidget *tree=gtk_tree_view_new_with_model(GTK_TREE_MODEL(store));
>     gtk_widget_set_name(tree, "tree_select");
>     gtk_widget_set_hexpand(tree, TRUE);
>     gtk_widget_set_vexpand(tree, FALSE);
>
>     GtkCellRenderer *renderer1=gtk_cell_renderer_text_new();
>     g_object_set(renderer1, "editable", FALSE, NULL);
>
>     //Bind the COLOR column to the "cell-background" property.
>     GtkTreeViewColumn *column1 =
> gtk_tree_view_column_new_with_attributes("ID", renderer1, "text", ID,
> "cell-background", COLOR, NULL);
>     gtk_tree_view_append_column(GTK_TREE_VIEW(tree), column1);
>     GtkTreeViewColumn *column2 =
> gtk_tree_view_column_new_with_attributes("Program", renderer1, "text",
> PROGRAM, "cell-background", COLOR, NULL);
>     gtk_tree_view_append_column(GTK_TREE_VIEW(tree), column2);
>
>     GtkWidget *grid=gtk_grid_new();
>     gtk_grid_attach(GTK_GRID(grid), tree, 0, 0, 1, 1);
>     gtk_container_add(GTK_CONTAINER(window), grid);
>
>     GError *css_error=NULL;
>     gchar css_string[]="#main_window{background: purple;}
> #tree_select:selected{background: green;}";
>     GtkCssProvider *provider = gtk_css_provider_new();
>     GdkDisplay *display = gdk_display_get_default();
>     GdkScreen *screen = gdk_display_get_default_screen(display);
>     gtk_style_context_add_provider_for_screen(screen,
> GTK_STYLE_PROVIDER(provider), GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
>     gtk_css_provider_load_from_data(provider, css_string, -1, &css_error);
>     if(css_error!=NULL) g_print("CSS loader error %s\n",
> css_error->message);
>     g_object_unref(provider);
>
>     gtk_widget_show_all(window);
>     gtk_main();
>     return 0;
>   }
>
>
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list