ObjectColor (Dark Mode)

Share your advanced PureBasic knowledge/code with the community.
BarryG
Addict
Addict
Posts: 2184
Joined: Thu Apr 18, 2019 8:17 am

Re: ObjectColor (Dark Mode)

Post by BarryG »

I just tried this with my app, but it's not working with the drop-down calendar of DateGadgets, FrameGadgets, PanelGadget tab text, or OptionGadgets (see below). I'm using the following code to set the colors just before my main loop, and nothing more. Is there something else I need to do? Thanks.

Also: Is there a way to make this work with the Menu and StatusBar of a window? Because right now the top and bottom of my window don't change color due to these, which looks bad.

Code: Select all

SetDarkTheme()
; SetExplorerTheme() ; Enabled or not makes no difference.
c=RGB(20,20,20)
SetWindowColor(#win_main,c)
SetObjectColor(#PB_All,#PB_All,c)
Image
Last edited by BarryG on Fri May 06, 2022 7:28 am, edited 1 time in total.
User avatar
Caronte3D
Enthusiast
Enthusiast
Posts: 393
Joined: Fri Jan 22, 2016 5:33 pm
Location: Spain

Re: ObjectColor (Dark Mode)

Post by Caronte3D »

BarryG wrote: Fri May 06, 2022 2:41 am I just tried this with my app, but it's not working...
May be you forget to use the flags #CBS_HASSTRINGS | #CBS_OWNERDRAWFIXED ?
Take a look at the first message example :wink:
BarryG
Addict
Addict
Posts: 2184
Joined: Thu Apr 18, 2019 8:17 am

Re: ObjectColor (Dark Mode)

Post by BarryG »

Caronte3D wrote: Fri May 06, 2022 6:34 am#CBS_HASSTRINGS | #CBS_OWNERDRAWFIXED
Didn't help. It just makes my ComboBox all white:

Image
User avatar
Caronte3D
Enthusiast
Enthusiast
Posts: 393
Joined: Fri Jan 22, 2016 5:33 pm
Location: Spain

Re: ObjectColor (Dark Mode)

Post by Caronte3D »

Maybe if you post a small compilable example would be easy to help you

Anyway, try to put the SetDarkTheme() afther the whole window definition (i.e: the window color change)
BarryG
Addict
Addict
Posts: 2184
Joined: Thu Apr 18, 2019 8:17 am

Re: ObjectColor (Dark Mode)

Post by BarryG »

I got ComboBoxes working by hacking my app to work around the issue. But the other gadgets still don't work (see my first post).
User avatar
ChrisR
Enthusiast
Enthusiast
Posts: 666
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: ObjectColor (Dark Mode)

Post by ChrisR »

Hi,
Because of the maximum number of allowed characters, I uploaded the last source code in my Github space.
The link is available on the 1st post.

Let me know BarryG if you have the same problems with the latest version for frames, Panel tab text, or Option Gadgets.
The DateGadgets with its drop-down calendar is a bit special and the result is not the best. I hope it can be improved but I haven't found how to do it yet.

BarryG wrote: Fri May 06, 2022 2:41 am Also: Is there a way to make this work with the Menu and StatusBar of a window? Because right now the top and bottom of my window don't change color due to these, which looks bad.
I did not look for the Menu, Toolbar and StatusBar. I have to search and see what has already been done on the forum for them.
It's a work in progress.

Thank you all for your comments to continue to improve it :wink:
BarryG
Addict
Addict
Posts: 2184
Joined: Thu Apr 18, 2019 8:17 am

Re: ObjectColor (Dark Mode)

Post by BarryG »

I have the latest version now (thanks for the Github link). But it still doesn't work for those gadgets.

Just to confirm, is the following code meant to make all gadgets of a given window become dark?

Code: Select all

SetDarkTheme()
SetObjectColor(#Window, #PB_All, RGB(50,50,50))
Because that's what I'm doing, but it doesn't work for my windows - some gadgets are left out entirely, or you can't read the text on them. I'll try to make a standalone example.
User avatar
ChrisR
Enthusiast
Enthusiast
Posts: 666
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: ObjectColor (Dark Mode)

Post by ChrisR »

It should be good normally with SetObjectColor(#Window, #PB_All, RGB(50,50,50))
I don't see what's wrong, it works here in all my examples, in IceDesign. So if you have an example it is welcome.
BarryG
Addict
Addict
Posts: 2184
Joined: Thu Apr 18, 2019 8:17 am

Re: ObjectColor (Dark Mode)

Post by BarryG »

Here's a test code that shows the windows as in the screenshot. See how the Panel tabs have no text, and the FrameGadget and OptionGadgets have no dark background? That's just a couple of examples. Am I doing something wrong?

Image

Code: Select all

IncludeFile "ObjectColor.pbi"

Enumeration
  #win_one
  #win_two
EndEnumeration

Enumeration
  #p1
  #b1
  #f1
  #op1
  #op2
EndEnumeration

Global darkcolor=RGB(50,50,50)

Global win_one=OpenWindow(#win_one,300,300,200,100,"One",#PB_Window_SystemMenu)
SetWindowColor(#win_one,darkcolor)
Global p1=PanelGadget(#p1,10,20,180,70)
AddGadgetItem(#p1,-1,"Tab 1")
Global b1=ButtonGadget(#b1,10,10,160,25,"Click me")
AddGadgetItem(#p1,-1,"Tab 2")
CloseGadgetList()

Global win_two=OpenWindow(#win_two,530,300,200,100,"Two",#PB_Window_SystemMenu|#PB_Window_Invisible)
SetWindowColor(#win_two,darkcolor)
Global frame=FrameGadget(#f1,10,10,180,70,"Frame")
Global op1=OptionGadget(#op1,20,30,100,20,"Option 1")
Global op2=OptionGadget(#op2,20,50,100,20,"Option 2")

SetDarkTheme()
SetObjectColor(#PB_All,#PB_All,darkcolor)

Repeat
  ev=WaitWindowEvent()
  If ev=#PB_Event_Gadget
    Select EventGadget()
      Case #b1 : HideWindow(#win_two,0)
    EndSelect
  EndIf
Until ev=#PB_Event_CloseWindow
User avatar
ChrisR
Enthusiast
Enthusiast
Posts: 666
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: ObjectColor (Dark Mode)

Post by ChrisR »

I'm not at home, I'll look later,.Thanks for thé exemple.
User avatar
ChrisR
Enthusiast
Enthusiast
Posts: 666
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: ObjectColor (Dark Mode)

Post by ChrisR »

Quick look at your code , you have not defined SetWindowCallback(@winCallback())
I probably have to do it in SetObjectColor.
User avatar
ChrisR
Enthusiast
Enthusiast
Posts: 666
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: ObjectColor (Dark Mode)

Post by ChrisR »

I added SetWindowCallback(@WinCallback()) inside SetObjectColor(). it is no longer required to add it now

I also added a new function:
EnumChildColor(#Window) : For debugging purposes if needed by enumerating hierarchically the child gadgets With their colors.
With #Window : #PB_All = All Window (Default) or the Window number to use.
To be called after SetObjectColor.

Code: Select all

Enum Child Gadget of Window 1         | WindowID 922122    (Level = 0) - BackColor  RGB(8,8,32)
    Gadget 6         ParentGadget 1         | GadgetID 6165454   ParentGadgetID 922122    (Level = 1) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
    Gadget 7         ParentGadget 1         | GadgetID 1509152   ParentGadgetID 922122    (Level = 1) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
    Gadget 11        ParentGadget 1         | GadgetID 2495210   ParentGadgetID 922122    (Level = 1) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
    Gadget 22        ParentGadget 1         | GadgetID 6491406   ParentGadgetID 922122    (Level = 1) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
        Gadget 19        ParentGadget 22        | GadgetID 6230774   ParentGadgetID 6491406   (Level = 2) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
        Gadget 20        ParentGadget 22        | GadgetID 12846818  ParentGadgetID 6491406   (Level = 2) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
        Gadget 23        ParentGadget 22        | GadgetID 2887414   ParentGadgetID 6491406   (Level = 2) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
            Gadget 17        ParentGadget 23        | GadgetID 32179568  ParentGadgetID 2887414   (Level = 3) - BackMode: -3 RGB(253,255,255) - TextMode: -3 RGB(253,255,255)
            Gadget 18        ParentGadget 23        | GadgetID 8917580   ParentGadgetID 2887414   (Level = 3) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
    Gadget 25        ParentGadget 1         | GadgetID 22744430  ParentGadgetID 922122    (Level = 1) - BackMode: -2 RGB(8,8,32) - TextMode: -2 RGB(255,255,255)
    Gadget 27        ParentGadget 1         | GadgetID 1315502   ParentGadgetID 922122    (Level = 1) - BackMode: -3 RGB(253,255,255) - TextMode: -3 RGB(253,255,255)
BarryG
Addict
Addict
Posts: 2184
Joined: Thu Apr 18, 2019 8:17 am

Re: ObjectColor (Dark Mode)

Post by BarryG »

We're getting there, ChrisR - thanks for the latest updates, which solved most of my problems. Kudos! I'll separate the remaining issues with headings.

Issue #1

Your latest code still doesn't work for all my windows yet - one of them is a pop-up window (#win_popup that is between the For/Next loop below) and dark mode isn't applied to all the gadgets in it, despite doing the below. It works fine for the first window (#win_main).

Code: Select all

Global darkcolor=RGB(50,50,50)
For w=#win_main To #win_last
  SetWindowColor(w,darkcolor)
  SetObjectColor(w,#PB_All,darkcolor)
Next
Also, may I suggest that "SetWindowColor(w,darkcolor)" be done as part of SetObjectColor()?

Issue #2

I've noticed that your callback stops my own callback working - I'm not sure if a window can have more than one callback? My app loses a lot of functionality because your callback overrides mine, so I may not even be able to use your code after all due to this?

Issue #3

Do I have to pay for IceDesign to get the JellyButton code? I couldn't see the code on these forums anywhere.

Issue #4

There are no icons on Panel tabs in dark mode (see test code below). My app uses icons on every tab so I need to keep them.

Code: Select all

IncludeFile "ObjectColor.pbi"

Enumeration
  #win_one
  #win_two
EndEnumeration

Enumeration
  #p1
  #b1
  #f1
  #op1
  #op2
EndEnumeration

Global darkcolor=RGB(50,50,50)

Global win_one=OpenWindow(#win_one,300,300,200,100,"One",#PB_Window_SystemMenu)
SetWindowColor(#win_one,darkcolor)
Global p1=PanelGadget(#p1,10,20,180,70)
AddGadgetItem(#p1,-1,"Tab 1",LoadIcon_(0,#IDI_EXCLAMATION)) ; No icon in dark mode. :(
Global b1=ButtonGadget(#b1,10,10,160,25,"Click me")
AddGadgetItem(#p1,-1,"Tab 2")
CloseGadgetList()

Global win_two=OpenWindow(#win_two,530,300,200,100,"Two",#PB_Window_SystemMenu|#PB_Window_Invisible)
SetWindowColor(#win_two,darkcolor)
Global frame=FrameGadget(#f1,10,10,180,70,"Frame")
Global op1=OptionGadget(#op1,20,30,100,20,"Option 1")
Global op2=OptionGadget(#op2,20,50,100,20,"Option 2")

SetDarkTheme()
SetObjectColor(#PB_All,#PB_All,darkcolor)

Repeat
  ev=WaitWindowEvent()
  If ev=#PB_Event_Gadget
    Select EventGadget()
      Case #b1 : HideWindow(#win_two,0)
    EndSelect
  EndIf
Until ev=#PB_Event_CloseWindow
User avatar
ChrisR
Enthusiast
Enthusiast
Posts: 666
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: ObjectColor (Dark Mode)

Post by ChrisR »

Hi BarryG,
Thank you for this extensive review 8)

1) I don't really have a solution for your pop-up windows.
The code works from PB_Object_Enumerate to get the hierarchical list of All Gadgets created and by passing the parent color to its childrens.
To work, the pop-up windows should be created before calling SetObjectColor, to have All the gadgets to paint.
It could probably be done by creating all the pop-up windows with #PB_Window_Invisible or HideWindow() but it would probably be a bit heavy and not what you want.

I will implement your suggestion to do "SetWindowColor(#w,darkcolor)" if the background color parameter is set to a color "SetObjectColor(#w,#PB_All,darkcolor)".
But I will stay the same if the background parameter is #PB_Auto and get the background color of the parent window in this case via "GetWindowColor(#w)"


2) Yes of course it doesn't work if you already have your own callback. They would be replaced and I don't know if anything can be done about it.
Only one callback per window?


3) Yes, you have to pay (not very expensive, I think) to get IceDesign and the JellyButton code.
But, a workaround is to use the demo version, by adding a JellyButton and creating the code. JellyButtons.pbi will be extracted next to the generated code.


4) It is not done for AddGadgetItem() and the ImageID optional parameter for the PanelGadget.
It would be nice to add it in the future but I don't know right now how it can be done (Get Item icon, DrawIconEx), expert advice is welcome :wink:


And in 5) I noted the MenuBar and StatusBar Color and see if it is possible to improve the DateGadget.
:)
Last edited by ChrisR on Sun May 08, 2022 12:44 pm, edited 1 time in total.
BarryG
Addict
Addict
Posts: 2184
Joined: Thu Apr 18, 2019 8:17 am

Re: ObjectColor (Dark Mode)

Post by BarryG »

ChrisR wrote:To work, the pop-up windows should be created before calling SetObjectColor, to have All the gadgets to paint.
It could probably be done by creating all the pop-up windows with #PB_Window_Invisible
That's what I'm currently doing. Most windows are created invisibly at first, with all gadgets, and then I'm using SetObjectColor() on them - similar to the code I posted above. In my case, there's only a ListIconGadget() that doesn't get colored dark in that pop-up window, but its other two gadgets become dark.
ChrisR wrote:it doesn't work if you already have your own callback
Yeah, I discovered that. I started that other topic about this, so I'll update there.
ChrisR wrote:It is not done for AddGadgetItem() and the ImageID optional parameter for the PanelGadget.
It would be nice to add it in the future but I don't know right now how it can be done (Get Item icon, DrawIconEx), expert advice is welcome :wink:
Okay.
ChrisR wrote:I noted the MenuBar and StatusBar Color and see if it is possible to improve the DateGadget. :)
The DateGadget drop-down calendar is now dark, so thanks for fixing that. And thanks for the JB code.
Last edited by BarryG on Fri May 13, 2022 7:30 am, edited 1 time in total.
Post Reply