It is currently Fri Aug 07, 2020 2:51 am

All times are UTC + 1 hour




Post new topic Reply to topic  [ 11 posts ] 
Author Message
 Post subject: GTK3 Front and Backcolor
PostPosted: Sun Dec 23, 2018 9:21 pm 
Offline
Addict
Addict
User avatar

Joined: Fri May 12, 2006 6:51 pm
Posts: 2604
Location: Germany
Set front and back color not work correctly...

PB-Version v5.6x and v5.70
PB-IDE v5.70 Toolbox user colors not work.

OS: Linux Ubuntu 18.04 (Gnome), Ubuntu 18.10 (Gnome), Ubuntu 18.04 (Budgie), Linux Mint 19
Code:
If OpenWindow(0, 0, 0, 270, 140, "ListViewGadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  ListViewGadget(0, 10, 10, 250, 120)
  For a = 1 To 12
    AddGadgetItem (0, -1, "Item " + Str(a) + " of the Listview") ; define listview content
  Next
  SetGadgetColor(0, #PB_Gadget_BackColor, $424236)
  SetGadgetColor(0, #PB_Gadget_FrontColor, $EAEBE1)
 
  SetGadgetState(0, 9) ; set (beginning with 0) the tenth item as the active one
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf

_________________
My Projects ThreadToGUI / OOP-BaseClass / OOP-BaseClassDispatch / EventDesigner V3
PB v3.30 / v5.70 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Mon Dec 24, 2018 11:20 am 
Offline
User
User

Joined: Sat Jun 23, 2018 5:21 pm
Posts: 99
Here is my bug solution at Christmas

Code:
ImportC ""
  gdk_rgba_parse(*rgba, spec.p-utf8)
  gtk_widget_override_background_color(*widget.GtkWidget, state, color)
EndImport

Structure GdkRGBA
  red.d
  green.d
  blue.d
  alpha.d
EndStructure

Enumeration GtkStateFlags
  #GTK_STATE_FLAG_NORMAL      = 0
  #GTK_STATE_FLAG_ACTIVE      = 1 << 0
  #GTK_STATE_FLAG_PRELIGHT    = 1 << 1
  #GTK_STATE_FLAG_SELECTED    = 1 << 2
  #GTK_STATE_FLAG_INSENSITIVE = 1 << 3
  #GTK_STATE_FLAG_INCONSISTENT= 1 << 4
  #GTK_STATE_FLAG_FOCUSED     = 1 << 5
  #GTK_STATE_FLAG_BACKDROP    = 1 << 6
  #GTK_STATE_FLAG_DIR_LTR     = 1 << 7
  #GTK_STATE_FLAG_DIR_RTL     = 1 << 8
  #GTK_STATE_FLAG_LINK        = 1 << 9
  #GTK_STATE_FLAG_VISITED     = 1 << 10
  #GTK_STATE_FLAG_CHECKED     = 1 << 11
EndEnumeration

Global bgcolor.GdkRGBA

If OpenWindow(0, 0, 0, 270, 140, "ListViewGadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  ListViewGadget(0, 10, 10, 250, 120)
  For a = 1 To 12
    AddGadgetItem (0, -1, "Item " + Str(a) + " of the Listview") ; define listview content
  Next
  ;SetGadgetColor(0, #PB_Gadget_BackColor, $424236)
 
  gdk_rgba_parse(@bgcolor, "rgb(0,255,0)")
  gtk_widget_override_background_color(GadgetID(0), #GTK_STATE_FLAG_SELECTED, bgcolor)
  gdk_rgba_parse(@bgcolor, "#424236")
  gtk_widget_override_background_color(GadgetID(0), #GTK_STATE_FLAG_NORMAL, bgcolor)
 
  SetGadgetColor(0, #PB_Gadget_FrontColor, $EAEBE1)
 
  SetGadgetState(0, 9) ; set (beginning with 0) the tenth item as the active one
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Mon Dec 24, 2018 4:03 pm 
Offline
Enthusiast
Enthusiast

Joined: Thu Jun 26, 2014 9:17 am
Posts: 312
Location: Germany
Hi!
Same problem is reported here: https://www.purebasic.fr/english/viewtopic.php?f=23&t=71032.
Only newer Gtk3 are affected. It works with PB5.62 on older Ubuntus e.g. 14.04.

@ccode: Guess what? :wink:
Quote:
gtk_widget_modify_bg() has been deprecated since version 3.0 and should not be used in newly-written code.
Use gtk_widget_override_background_color() instead
Same doku page:
Quote:
gtk_widget_override_background_color() has been deprecated since version 3.16 ...
But it still should work for a while.

Merry Christmas, Charly

_________________
PureBasic 5.4-5.7, Linux: (X/L/K)Ubuntus+Mint - Windows XP (32Bit)
PureBasic Linux-API-Library & Viewer: http://www.chabba.de


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Mon Dec 24, 2018 10:28 pm 
Offline
Addict
Addict
User avatar

Joined: Fri May 12, 2006 6:51 pm
Posts: 2604
Location: Germany
I have the same solution in progress at the moment.
But there are still problems with editable gadgets with the marked text.

Let's see if I can find the solution...

_________________
My Projects ThreadToGUI / OOP-BaseClass / OOP-BaseClassDispatch / EventDesigner V3
PB v3.30 / v5.70 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Tue Dec 25, 2018 10:27 am 
Offline
Addict
Addict
User avatar

Joined: Fri May 12, 2006 6:51 pm
Posts: 2604
Location: Germany
Quote:
gtk_widget_override_background_color() has been deprecated since version 3.16 ...

The fact that GTK3 is constantly changing something doesn't make things easy for app developers or Fred either.

At least GTK's documentation is relatively good.

Let's see how it works with the GtkCssProviders.
Seems to be the only method at this time...

_________________
My Projects ThreadToGUI / OOP-BaseClass / OOP-BaseClassDispatch / EventDesigner V3
PB v3.30 / v5.70 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Tue Dec 25, 2018 12:59 pm 
Offline
User
User

Joined: Sat Jun 23, 2018 5:21 pm
Posts: 99
Quote:
Let's see how it works with the GtkCssProviders.


Solution:
Code:
ImportC ""
  gtk_css_provider_load_from_data(*css_provider, data_.p-utf8, length, *error.GError)
  gtk_css_provider_new()
  gtk_style_context_add_provider(*context, *provider, priority)
  gtk_style_context_remove_provider(*context, *provider)
  gtk_widget_get_style_context(*widget.GtkWidget)
EndImport

; *{..} = All
; entry{..} = Exactly the widget-type
; entry:selected, *:selected ,....(selection, hover, ...)

Procedure SetBackgroundColor(Gadget, bgcolor)
  Protected *gProvider= gtk_css_provider_new()
  Protected.s BGCSS = "*{background: rgb("+Red(bgcolor)+","+Green(bgcolor)+","+Blue(bgcolor)+")}"
 
  gtk_css_provider_load_from_data(*gProvider, BGCSS, -1, #Null)
  gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), *gProvider, 600)
  g_object_unref_(*gProvider)
EndProcedure

Procedure SetForegroundColor(Gadget, fgcolor)
  Protected *gProvider= gtk_css_provider_new()
  Protected.s BGCSS = "*{color: rgb("+Red(fgcolor)+","+Green(fgcolor)+","+Blue(fgcolor)+")}"
 
  gtk_css_provider_load_from_data(*gProvider, BGCSS, -1, #Null)
  gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), *gProvider, 600)
  g_object_unref_(*gProvider)
EndProcedure

Procedure SetMarkingColor(Gadget, fgcolor, bgcolor = 0)
  Protected *gProvider= gtk_css_provider_new()
  Protected.s BGCSS = "*selection{color: rgb("+Red(fgcolor)+","+Green(fgcolor)+","+Blue(fgcolor)+"); background-color: rgb("+Red(bgcolor)+","+Green(bgcolor)+","+Blue(bgcolor)+")}"
 
  gtk_css_provider_load_from_data(*gProvider, BGCSS, -1, #Null)
  gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), *gProvider, 600)
  g_object_unref_(*gProvider)
EndProcedure

Procedure SetSelectedColor(Gadget, fgcolor, bgcolor = 0)
  Protected *gProvider= gtk_css_provider_new()
  Protected.s BGCSS = "*:selected{color: rgb("+Red(fgcolor)+","+Green(fgcolor)+","+Blue(fgcolor)+"); background-color: rgb("+Red(bgcolor)+","+Green(bgcolor)+","+Blue(bgcolor)+")}"
 
  gtk_css_provider_load_from_data(*gProvider, BGCSS, -1, #Null)
  gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), *gProvider, 600)
  g_object_unref_(*gProvider)
EndProcedure

Procedure SetCursorColor(Gadget, ccolor)
  Protected *gProvider= gtk_css_provider_new()
  Protected.s BGCSS = "*{caret-color: rgb("+Red(ccolor)+","+Green(ccolor)+","+Blue(ccolor)+")}"
 
  gtk_css_provider_load_from_data(*gProvider, BGCSS, -1, #Null)
  gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), *gProvider, 600)
  g_object_unref_(*gProvider)
EndProcedure


If OpenWindow(0, 0, 0, 270, 140, "ListViewGadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
 
  ListViewGadget(0, 10, 10, 250, 120)
  For a = 1 To 12
    AddGadgetItem (0, -1, "Item " + Str(a) + " of the Listview") ; define listview content
  Next
 
  ;StringGadget(0, 10, 10, 250, 30, "Hello!")
 
  ;SetGadgetColor(0, #PB_Gadget_FrontColor, $EAEBE1)
  SetBackgroundColor(0, RGB(255,255,0))
  SetForegroundColor(0, RGB(0,200,0))
  SetMarkingColor(0, RGB(255,0,255), RGB(0,0,0))
  SetSelectedColor(0, RGB(255,0,255), RGB(0,0,0)) ;ListView, ...
  SetCursorColor(Gadget, RGB(255,0,0))
 
  SetGadgetState(0, 9) ; set (beginning with 0) the tenth item as the active one
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf


Last edited by ccode on Wed Dec 26, 2018 1:16 am, edited 1 time in total.

Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Tue Dec 25, 2018 11:13 pm 
Offline
User
User

Joined: Sat Jun 23, 2018 5:21 pm
Posts: 99
GTK-CSS color functions are supposed to be future-proof for the time being.

It would be a great thing.


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Wed Dec 26, 2018 1:47 am 
Offline
Addict
Addict
User avatar

Joined: Fri May 12, 2006 6:51 pm
Posts: 2604
Location: Germany
Not perfect, but ...

works with all (most) gadgets except the ScintiallaGadget.

TreeView with CSS I didn't get to run and took the old function "gtk_widget_override_*".

Code:
...


New Topic for Teamwork
Link: viewtopic.php?f=15&t=71992

_________________
My Projects ThreadToGUI / OOP-BaseClass / OOP-BaseClassDispatch / EventDesigner V3
PB v3.30 / v5.70 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace


Last edited by mk-soft on Wed Dec 26, 2018 4:31 pm, edited 1 time in total.

Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Wed Dec 26, 2018 9:22 am 
Offline
Enthusiast
Enthusiast

Joined: Thu Jun 26, 2014 9:17 am
Posts: 312
Location: Germany
@ccode & mk-soft
Nice solutions! Thanks.

@mk-soft,
I've added a CSS implementation to your solution (in your way) for the following gadget types: #PB_GadgetType_ListIcon, #PB_GadgetType_ListView, #PB_GadgetType_Tree.
Tested on Xubuntu 14.04 + PB5.46/PB5.62 and Xubuntu 18.04 + PB5.70B3 but without guarantee for generally correct function :wink: .

For CSS it is also necessary to change the color for selected items (or to find an automated solution!) ...
For my suggestion, you have to define own constants like these (suitable for modularity):
#My_Gadget_SelBackgroundColor= 126
#My_Gadget_SelForegroundColor= 127

and add both calls ...
SetGadgetColor(0, #My_Gadget_SelForegroundColor, $FF0000)
SetGadgetColor(0, #My_Gadget_SelBackgroundColor, $00FFFF)

... or find another implementation.

If you wanna try it, change your procedure to ...
Code:
  Procedure GtkSetGadgetColor(Gadget, ColorType, Color)
    Protected *GdKColor.GdkRGBA
    Protected widget
   
    Protected CSSContext
    Protected CSSProvider
    Protected CSSColor.s
    Protected CSSData.s
   
    With *GdkColor
      Select GadgetType(Gadget)
        Case #PB_GadgetType_Editor
          CSSColor = "#" + RSet(Hex(Red(Color)), 2, "0") + RSet(Hex(Green(Color)), 2, "0") + RSet(Hex(Blue(Color)), 2, "0")
          Select ColorType
            Case #PB_Gadget_FrontColor
              CSSData = "* text {color: " + CSSColor + "};"
            Case #PB_Gadget_BackColor
              CSSData = "* text {background-color: " + CSSColor + "};"
            Default
              ProcedureReturn PB(SetGadgetColor)(Gadget, ColorType, Color)
          EndSelect
          CSSProvider = gtk_css_provider_new()
          CSSContext = gtk_widget_get_style_context(GadgetID(Gadget))
          gtk_css_provider_load_from_data(CSSProvider, CSSData, -1, 0)
          gtk_style_context_add_provider(CSSContext, CSSProvider, #GTK_STYLE_PROVIDER_PRIORITY_USER)
          g_object_unref_(CSSProvider)
       
        Case #PB_GadgetType_String
          CSSColor = "#" + RSet(Hex(Red(Color)), 2, "0") + RSet(Hex(Green(Color)), 2, "0") + RSet(Hex(Blue(Color)), 2, "0")
          Select ColorType
            Case #PB_Gadget_FrontColor
              CSSData = "* entry {color: " + CSSColor + "};"
            Case #PB_Gadget_BackColor
              CSSData = "* entry {background-color: " + CSSColor + "};"
            Default
               ProcedureReturn PB(SetGadgetColor)(Gadget, ColorType, Color)
          EndSelect
          CSSProvider = gtk_css_provider_new()
          CSSContext = gtk_widget_get_style_context(GadgetID(Gadget))
          gtk_css_provider_load_from_data(CSSProvider, CSSData, -1, 0)
          gtk_style_context_add_provider(CSSContext, CSSProvider, #GTK_STYLE_PROVIDER_PRIORITY_USER)
          g_object_unref_(CSSProvider)
         
        Case #PB_GadgetType_Scintilla
           ;TODO
           PB(SetGadgetColor)(Gadget, ColorType, Color)
           
        Case #PB_GadgetType_ListIcon, #PB_GadgetType_ListView, #PB_GadgetType_Tree
           Select ColorType
              Case #PB_Gadget_FrontColor
                 CSSData = "* .view {color: " +"#" + RSet(Hex(Red(Color)), 2, "0") + RSet(Hex(Green(Color)), 2, "0") + RSet(Hex(Blue(Color)), 2, "0") + ";}"
                 CSSProvider = gtk_css_provider_new()
                 gtk_css_provider_load_from_data(CSSProvider, CSSData, -1, 0)
                 gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), CSSProvider, #GTK_STYLE_PROVIDER_PRIORITY_APPLICATION)
                 g_object_unref_(CSSProvider)
              Case #PB_Gadget_BackColor
                 CSSData = "* .view {background-color: " +"#" + RSet(Hex(Red(Color)), 2, "0") + RSet(Hex(Green(Color)), 2, "0") + RSet(Hex(Blue(Color)), 2, "0") + ";}"
                 CSSProvider = gtk_css_provider_new()
                 gtk_css_provider_load_from_data(CSSProvider, CSSData, -1, 0)
                 gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), CSSProvider, #GTK_STYLE_PROVIDER_PRIORITY_APPLICATION)
                 g_object_unref_(CSSProvider)
              Case #My_Gadget_SelForegroundColor
                 CSSData = "* .view:selected " +
                           "{color: " +"#" + RSet(Hex(Red(Color)), 2, "0") + RSet(Hex(Green(Color)), 2, "0") + RSet(Hex(Blue(Color)), 2, "0") + ";}"
                 CSSProvider = gtk_css_provider_new()
                 gtk_css_provider_load_from_data(CSSProvider, CSSData, -1, 0)
                 gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), CSSProvider, #GTK_STYLE_PROVIDER_PRIORITY_APPLICATION)
                 g_object_unref_(CSSProvider)
              Case #My_Gadget_SelBackgroundColor
                 CSSData = "* .view:selected " +
                           "{background-color: " +"#" + RSet(Hex(Red(Color)), 2, "0") + RSet(Hex(Green(Color)), 2, "0") + RSet(Hex(Blue(Color)), 2, "0") + ";}"
                 CSSProvider = gtk_css_provider_new()
                 gtk_css_provider_load_from_data(CSSProvider, CSSData, -1, 0)
                 gtk_style_context_add_provider(gtk_widget_get_style_context(GadgetID(Gadget)), CSSProvider, #GTK_STYLE_PROVIDER_PRIORITY_APPLICATION)
                 g_object_unref_(CSSProvider)
           EndSelect
         
        Default
          *GdKColor = AllocateStructure(GdkRGBA)
          \red = (1.0/255.) * Red(Color)
          \green = (1.0/255.0) * Green(Color)
          \blue = (1.0/255.0) * Blue(Color)
          \alpha = 1.0
          Select ColorType
            Case #PB_Gadget_FrontColor
              gtk_widget_override_color(GadgetID(Gadget), #GTK_STATE_FLAG_NORMAL, *GdKColor)
            Case #PB_Gadget_BackColor
              gtk_widget_override_background_color(GadgetID(Gadget), #GTK_STATE_FLAG_NORMAL, *GdKColor)
              \red = 0.0
              \green = 0.0
              \blue = 1.0
              \alpha = 0.5
              gtk_widget_override_background_color(GadgetID(Gadget), #GTK_STATE_FLAG_SELECTED, *GdKColor)
            Default
              PB(SetGadgetColor)(Gadget, ColorType, Color)
          EndSelect
          FreeStructure(*GDKColor)
      EndSelect
    EndWith
  EndProcedure

Regards, Charly

ps:
Has anyone already found a list (old and/or new, the Gtk-CSS syntax has of course changed again) in which the used CSS terms for the GtkWidgets are defined?

_________________
PureBasic 5.4-5.7, Linux: (X/L/K)Ubuntus+Mint - Windows XP (32Bit)
PureBasic Linux-API-Library & Viewer: http://www.chabba.de


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Wed Dec 26, 2018 10:17 am 
Offline
User
User

Joined: Sat Jun 23, 2018 5:21 pm
Posts: 99
Hello!

I hope when the development of GTK+ 3 is complete, only minimal changes should occur in the Api. Or bug fixes.
The future is GTK+ 4.
GTK+ 2 is finished and should be stable.

https://developer.gnome.org/references
https://developer.gnome.org/gtk3/stable/chap-css-overview.html

Does anyone know better descriptions?


Top
 Profile  
Reply with quote  
 Post subject: Re: GTK3 Front and Backcolor
PostPosted: Wed Dec 26, 2018 4:30 pm 
Offline
Addict
Addict
User avatar

Joined: Fri May 12, 2006 6:51 pm
Posts: 2604
Location: Germany
Thanks Oma

i have open a new topic for teamwork... :wink:
Link viewtopic.php?f=15&t=71992

_________________
My Projects ThreadToGUI / OOP-BaseClass / OOP-BaseClassDispatch / EventDesigner V3
PB v3.30 / v5.70 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace


Top
 Profile  
Reply with quote  
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 11 posts ] 

All times are UTC + 1 hour


Who is online

Users browsing this forum: No registered users and 3 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum

Search for:
Jump to:  

 


Powered by phpBB © 2008 phpBB Group
subSilver+ theme by Canver Software, sponsor Sanal Modifiye