ListIconGadget (GtkTreeView) - row height

mdp · **Joined:** Mon Apr 18, 2005 8:28 pm **Posts:** 83

Can anyone change the padding (or, in gtk+ terms, the "vertical-separator" property) in a ListIconGadget as GtkTreeView? (There are several examples around for the Windows equivalent.)
I see it is a read-only property (so maybe we cannot use 'g_object_set'?) and, following the scarce material I found, my bet is some

Code:

gtk_rc_parse_string ( " style "+#DQUOTE$+"updated_style"+#DQUOTE$+" { GtkTreeView::vertical-separator=0 }"+
    " widget "+#DQUOTE$+"*.somehowmytreeview"+#DQUOTE$+" style "+#DQUOTE$+"updated_style"+#DQUOTE$)

But I would not know how to identify the ListIconGadget (as "somehowmytreeview" above)...

EDIT: even deciding a fixed column height will be good, and examples for both solutions appreciated.

Shardik · **Posted:** Wed May 01, 2013 7:54 pm

Sorry, but I don't understand fully what you want to achieve. Do you want to change the padding, i.e. the indentation of text in a cell or column or do you simply want to change the height of a row, like in the following example?

Code:

OpenWindow(0, 200, 100, 420, 220, "Change ListIcon's row height")
ListIconGadget(0, 10, 10, WindowWidth(0) - 20, WindowHeight(0) - 20, "Name", 100, #PB_ListIcon_GridLines)
AddGadgetColumn(0, 1, "Address", GadgetWidth(0) - GetGadgetItemAttribute(0, 0, #PB_ListIcon_ColumnWidth) - 30)
AddGadgetItem(0, -1, "Harry Rannit" + #LF$ + "12 Parliament Way, Battle Street, By the Bay")
AddGadgetItem(0, -1, "Ginger Brokeit" + #LF$ + "130 PureBasic Road, BigTown, CodeCity")
AddGadgetItem(0, -1, "Didi Foundit" + #LF$ + "321 Logo Drive, Mouse House, Downtown")

*Column.GtkTreeViewColumn = gtk_tree_view_get_column_(GadgetID(0), 0)

If *Column
  *CellRenderer.GtkCellRenderer = gtk_cell_renderer_text_new_()
  gtk_tree_view_column_pack_start_(*Column, *CellRenderer, #False)
  *CellRenderer\height = 55
EndIf

Repeat
Until WaitWindowEvent() = #PB_Event_CloseWindow

mdp · **Joined:** Mon Apr 18, 2005 8:28 pm **Posts:** 83

Thank you Shardik, you example is most interesting.
To clarify - there might be (at least) two ways to set the row height of a grid:
-- you set the height directly, as you did with your *CellRenderer\height
-- you set it indirectly, by setting the top and bottom padding for the cell, which in gtk+ terms is called, I understand, vertical-separator and is a style attribute of a GtkTreeView - but it is also a GtkCellRenderer\ypad.
The default of such padding is 2 pixels. So, if your text is eg. 18 px tall, your default cell will be 22 px tall.

The problem with GtkCellRenderer\height is: you can increase the row height with that, but not decrease it (it would not work, if in your example you put *CellRenderer\height = 10).

NOW, if I increase a GtkCellRenderer\ypad ('ypad' can be replaced to 'height' in the example from Shardik), the row becomes taller, but how is it that if I try to zero that GtkCellRenderer\ypad, nothing happens?

[By the way - I believe I wrote 'column' instead of 'row' in the post title. Sorry...]

Shardik · **Posted:** Thu May 02, 2013 2:10 pm

The following code example demonstrates how to obtain the property "vertical-separator" of a ListIconGadget:

Code:

#G_TYPE_INT = 6 << 2

ImportC ""
  gtk_style_get_style_property(*Style.GtkStyle, WidgetType.I, PropertyName.S, *Value.GValue)
EndImport

OpenWindow(0, 200, 100, 420, 120, "Get property 'vertical-separator' of TreeView")
ListIconGadget(0, 10, 10, WindowWidth(0) - 20, WindowHeight(0) - 20, "Name", 100, #PB_ListIcon_GridLines)
AddGadgetColumn(0, 1, "Address", GadgetWidth(0) - GetGadgetItemAttribute(0, 0, #PB_ListIcon_ColumnWidth) - 30)
AddGadgetItem(0, -1, "Harry Rannit" + #LF$ + "12 Parliament Way, Battle Street, By the Bay")
AddGadgetItem(0, -1, "Ginger Brokeit" + #LF$ + "130 PureBasic Road, BigTown, CodeCity")
AddGadgetItem(0, -1, "Didi Foundit" + #LF$ + "321 Logo Drive, Mouse House, Downtown")

*Style.GtkStyle = gtk_rc_get_style_(GadgetID(0))
VerticalSeparator.GValue
VerticalSeparator\g_type = #G_TYPE_INT

If *Style
  gtk_style_get_style_property(*Style, gtk_tree_view_get_type_(), "vertical-separator", @VerticalSeparator)
  Debug "Vertical separator = " + Str(g_value_get_int_(VerticalSeparator))
EndIf

Repeat
Until WaitWindowEvent() = #PB_Event_CloseWindow

mdp · **Joined:** Mon Apr 18, 2005 8:28 pm **Posts:** 83

Thanks,
but I am not sure it is working properly. The above example returns '0', while the expected would be '2'.

Still fiddling with gtk, another, maybe simpler solution to get the value would be using gtk_widget_style_get, as per below:

Code:

OpenWindow(0, 200, 100, 420, 120, "Get property 'vertical-separator' of TreeView")
ListIconGadget(0, 10, 10, WindowWidth(0) - 20, WindowHeight(0) - 20, "Name", 100, #PB_ListIcon_GridLines)
AddGadgetColumn(0, 1, "Address", GadgetWidth(0) - GetGadgetItemAttribute(0, 0, #PB_ListIcon_ColumnWidth) - 30)
AddGadgetItem(0, -1, "Harry Rannit" + #LF$ + "12 Parliament Way, Battle Street, By the Bay")
AddGadgetItem(0, -1, "Ginger Brokeit" + #LF$ + "130 PureBasic Road, BigTown, CodeCity")
AddGadgetItem(0, -1, "Didi Foundit" + #LF$ + "321 Logo Drive, Mouse House, Downtown")

h.l = 123
gtk_widget_style_get_( GadgetID(0), "separator-height", @h, #Null)
Debug h

But:
-- with gtk_widget_style_get_( GadgetID(0), "separator-height", @h) , without the final parameter set to NULL (that would close the succession of property names and pointers to destination variables), the there is some internal error ("no property named [garbage][garbage][garbage]")
-- with gtk_widget_style_get_( GadgetID(0), "separator-height", @h, #Null) , the number of parameters is stated to be incorrect
-- prepending ImportC "" : gtk_widget_style_get(*widget.GtkWidget, property_name.s, *value, null.l) : EndImport and using gtk_widget_style_get( GadgetID(0), "separator-height", @h, #Null) , imported (function without trailing '_'), returns 0.

In order to instead set the style value, again I found information that it is to be set through a RC file, which you load using gtk_rc_parse(). Can anyone provide an example?

Shardik · **Posted:** Thu May 02, 2013 8:15 pm

mdp wrote:

Thanks,
but I am not sure it is working properly. The above example returns '0', while the expected would be '2'.

I have tested my example code on 5 different distributions:

- andLinux/Kubuntu 9.04 x86 / KDE: 2
- Fedora 18 x86 / Gnome 3: 4
- Kubuntu 12.04 x64 / KDE: 0
- Lubuntu 12.10 x86 / LXDE: 2
- Ubuntu 12.04 x64 / Unity: 0

3 out of 5 distros return a "vertical-separator" value other than 0, so the example code seems to be OK...

Your use of gtk_widget_style_get() returns the same result as my code example from above. I took your example from above and changed your "separator-height" against "vertical-separator" (the GTK2 documentation for the GtkTreeView doesn't list a style property named "separator-height"). This modified and corrected example works:

Code:

ImportC ""
  gtk_widget_style_get(*Widget.GtkWidget, PropertyName.S, *Value, Null)
EndImport

OpenWindow(0, 200, 100, 420, 120, "Get property 'vertical-separator' of TreeView")
ListIconGadget(0, 10, 10, WindowWidth(0) - 20, WindowHeight(0) - 20, "Name", 100, #PB_ListIcon_GridLines)
AddGadgetColumn(0, 1, "Address", GadgetWidth(0) - GetGadgetItemAttribute(0, 0, #PB_ListIcon_ColumnWidth) - 30)
AddGadgetItem(0, -1, "Harry Rannit" + #LF$ + "12 Parliament Way, Battle Street, By the Bay")
AddGadgetItem(0, -1, "Ginger Brokeit" + #LF$ + "130 PureBasic Road, BigTown, CodeCity")
AddGadgetItem(0, -1, "Didi Foundit" + #LF$ + "321 Logo Drive, Mouse House, Downtown")

gtk_widget_style_get(GadgetID(0), "vertical-separator", @VerticalSeparator, 0)
Debug VerticalSeparator

Unfortunately I currently don't have the time to delve deeper into styles and rc files to modify row height but at the weekend I will give it a try (if you won't have beaten me until then... :wink:

)

Shardik · **Posted:** Wed May 15, 2013 5:41 pm

Sorry, but the solution took me much longer than I previously had estimated. Nevertheless I found a very simple solution which doesn't require to mess around with GtkSettings or rc styles. The following example code allows you to dynamically change the height of rows in a ListIconGadget (tested in Ubuntu 12.04 x64 with KDE and Unity):

Code:

EnableExplicit

ImportC ""
  gtk_scale_add_mark(*TrackBar.GtkScale, Value.D, Position.I, *MarkupText)
  gtk_tree_view_column_get_cell_renderers(*Column.GtkTreeViewColumn)
EndImport

Define *CellRenderer.GtkCellRenderer
Define CellRendererList.I
Define Column.I
Define i.I
Define OldRowHeight.L
Define RowHeight.L
Define RowWidth.L
Define TickMarkLabel.S
Define WindowEvent.I
Define xOffset.L
Define yOffset.L

OpenWindow(0, 200, 100, 418, 200, "Change ListIcon's row height")
ListIconGadget(0, 10, 10, WindowWidth(0) - 20, 94, "Name", 110, #PB_ListIcon_GridLines)
AddGadgetColumn(0, 1, "Address", GadgetWidth(0) - GetGadgetItemAttribute(0, 0, #PB_ListIcon_ColumnWidth) - 30)
AddGadgetItem(0, -1, "Harry Rannit" + #LF$ + "12 Parliament Way, Battle Street, By the Bay")
AddGadgetItem(0, -1, "Ginger Brokeit" + #LF$ + "130 PureBasic Road, BigTown, CodeCity")
AddGadgetItem(0, -1, "Didi Foundit" + #LF$ + "321 Logo Drive, Mouse House, Downtown")

Frame3DGadget(1, 10, GadgetY(0) + GadgetHeight(0) + 10, WindowWidth(0) - 20, 90, "Row height:")
TrackBarGadget(2, GadgetX(1) + 10, GadgetY(1) + 20, GadgetWidth(1) - 20, 55, 18, 40, #PB_TrackBar_Ticks)

; ----- Draw even tick marks with labels

For i = 18 To 40 Step 2
  TickMarkLabel = Str(i)
  gtk_scale_add_mark(GadgetID(2), i, #GTK_POS_BOTTOM, @TickMarkLabel)
Next i

; ----- Draw uneven tick marks without labels

For i = 19 To 39 Step 2
  gtk_scale_add_mark(GadgetID(2), i, #GTK_POS_BOTTOM, 0)
Next i

; ----- Get column 0
Column = gtk_tree_view_get_column_(GadgetID(0), 0)

If Column
  ; ----- Get list of cell renderers for column 0
  CellRendererList = gtk_tree_view_column_get_cell_renderers(Column)
  
  If CellRendererList
    ; ----- Get 2nd cell renderer from list to obtain current row height
    *CellRenderer = g_list_nth_data_(CellRendererList, 1)

    ; ----- Get current row height and display it in TrackBar
    gtk_cell_renderer_get_size_(*CellRenderer, GadgetID(0), 0, @xOffset, @yOffset, @RowWidth, @RowHeight)
    SetGadgetState(2, RowHeight)
    OldRowHeight = RowHeight

    ; ----- Get 1st cell renderer from list for changing row height
    *CellRenderer = g_list_nth_data_(CellRendererList, 0)
  EndIf
EndIf

Repeat
  WindowEvent = WaitWindowEvent()

  Select WindowEvent
    Case #PB_Event_CloseWindow
      Break
    Case #PB_Event_Gadget
      If EventGadget() = 2
        ; ----- Set new row height
        RowHeight = GetGadgetState(2)

        If RowHeight <> OldRowHeight
          *CellRenderer\height = RowHeight
          gtk_tree_view_column_clear_attributes_(Column, *CellRenderer)
          OldRowHeight = RowHeight
        EndIf
      EndIf
  EndSelect
ForEver

It's not possible to reduce a row's height below a specific minimum value (19 pixels in Ubuntu 12.04 x64 with KDE).

mdp wrote:

NOW, if I increase a GtkCellRenderer\ypad ('ypad' can be replaced to 'height' in the example from Shardik), the row becomes taller, but how is it that if I try to zero that GtkCellRenderer\ypad, nothing happens?

I presume that you don't get the function of ypad correctly. I have written a second example code which lets you dynamically change the value of ypad and see the resulting effect: beginning with a ypad value of 8 (in KDE) the text is vertically moved down in a column until it is only partly visible. You can't move it upwards. The row's height never changes when changing the ypad value:

Code:

EnableExplicit

ImportC ""
  gtk_scale_add_mark(*TrackBar.GtkScale, Value.D, Position.I, *MarkupText)
  gtk_tree_view_column_get_cell_renderers(*Column.GtkTreeViewColumn)
EndImport

Procedure ChangeVerticalTextAlignment(NewYPad.L)
  Protected *CellRenderer.GtkCellRenderer
  Protected CellRendererList.I
  Protected Column.I

  ; ----- Get column 0
  Column = gtk_tree_view_get_column_(GadgetID(0), 0)

  ; ----- Get 2nd cell renderer from list of cell renderers of column 0
  If Column
    CellRendererList = gtk_tree_view_column_get_cell_renderers(Column)

    If CellRendererList
      *CellRenderer = g_list_nth_data_(CellRendererList, 1)
      g_list_free_(CellRendererList)
      *CellRenderer\height = 30 
      *CellRenderer\ypad = NewYPad 
    EndIf

    gtk_widget_queue_draw_(GadgetID(0))
  EndIf
EndProcedure

Define i.I
Define TickMarkLabel.S
Define NewYPad.L
Define OldYPad.L

OpenWindow(0, 200, 100, 413, 240, "Change vertical text position in column 0")
ListIconGadget(0, 10, 10, WindowWidth(0) - 20, 124, "Name", 110, #PB_ListIcon_GridLines)
AddGadgetColumn(0, 1, "Address", GadgetWidth(0) - GetGadgetItemAttribute(0, 0, #PB_ListIcon_ColumnWidth) - 30)
AddGadgetItem(0, -1, "Harry Rannit" + #LF$ + "12 Parliament Way, Battle Street, By the Bay")
AddGadgetItem(0, -1, "Ginger Brokeit" + #LF$ + "130 PureBasic Road, BigTown, CodeCity")
AddGadgetItem(0, -1, "Didi Foundit" + #LF$ + "321 Logo Drive, Mouse House, Downtown")

NewYPad = 2
OldYPad = 2
ChangeVerticalTextAlignment(NewYPad)

Frame3DGadget(1, 10, GadgetY(0) + GadgetHeight(0) + 10, WindowWidth(0) - 20, 90, "Vertical text alignment in column 0:")
TrackBarGadget(2, GadgetX(1) + 10, GadgetY(1) + 20, GadgetWidth(1) - 20, 55, 0, 20, #PB_TrackBar_Ticks)

For i = 0 To 20 Step 2
  TickMarkLabel = Str(i)
  gtk_scale_add_mark(GadgetID(2), i, #GTK_POS_BOTTOM, @TickMarkLabel)
Next i

For i = 1 To 19 Step 2
  gtk_scale_add_mark(GadgetID(2), i, #GTK_POS_BOTTOM, 0)
Next i

SetGadgetState(2, NewYPad)

Repeat
  Select WaitWindowEvent()
    Case #PB_Event_CloseWindow
      Break
    Case #PB_Event_Gadget
      If EventGadget() = 2
        ; ----- Set new vertical text position in row
        NewYPad = GetGadgetState(2)

        If NewYPad <> OldYPad
          ChangeVerticalTextAlignment(NewYPad)
          OldYPad = NewYPad
        EndIf
      EndIf
  EndSelect
ForEver

PureBasic Forum

ListIconGadget (GtkTreeView) - row height

Who is online