Subscribe for automatic updates: RSS icon RSS

Login icon Sign in for full access | Help icon Help
Advanced search

Pages: [1]
  Reply  |  Print  
Author Topic: How to style GDC buttons  (Read 6321 times)
Huy H.
Posts: 45


« on: April 24, 2017, 04:16:44 pm »

I am trying to create a night-time theme for our application.  The one thing we are having trouble with is trying to style the buttons and the folder tabs (see attached).  Does anyone know how to style these elements?  Or is it even possible?


* Capture.JPG (20.97 KB, 383x191 - viewed 1263 times.)
Lionel F.
Four Js
Posts: 82


« Reply #1 on: April 24, 2017, 06:04:45 pm »

Hi Huy,

Unfortunately, for some items, it's not possible to override the default system style (it may also depend on the OS). For example, on Windows 10, if you specify a background color for Pages of a Folder....

Code
  1. <Style name="Page">
  2.     <StyleAttribute name="backgroundColor" value="yellow" />
  3. </Style>
  4.  

....the color will be applied inside the Page but not on the header (because the Qt library we're using doesn't allow it). It's the same for buttons : if you apply a background-color, you'll only see a small border of the color you applied around the button. The same case can be also observed for Topmenus, Toolbars or for Group titles....unfortunately we cannot make all elements fully customizable if we want to stay in concordance with the system style.

Best Regards,
Lionel
Leo S.
Four Js
Posts: 126


« Reply #2 on: April 25, 2017, 01:03:52 am »

Hi Huy, normally if you switch your desktop to a "night theme" (high contrast) GDC will follow that theme and buttons. foldertabs should follow too.
Did you try that ?
Regards, Leo
Reuben B.
Four Js
Posts: 1046


« Reply #3 on: April 25, 2017, 02:04:32 am »

Leo's advice will work best if you don't have any generic or RGB colour definitions in your .4st.  To be theme proof you should restrict yourself to System Colour Names http://4js.com/online_documentation/fjs-fgl-manual-html/#c_fgl_presentation_styles_015.html.  (too often in my travels I see generic or RGB colour definitions in .4st's, when system colours will make your .4st more robust in different themes/front-ends)

I'll throw two more suggestions at you.  For BUTTONS, use IMAGE with ACTION attributes as introduced in 3.00, then your "BUTTON" can look like anything you want.  You can use two different images to represent the button being pressed/unpressed. 

The second I'm not sure I should mention as it was an experimental feature in 2.20 that I don't think went far, and I'm not sure if the code is still in the more recent GDC's, and if it is I would not guarantee it staying,  but have a look at http://4js.com/online_documentation/fjs-gdc-manual-html/#c_gdc_NewFeatures220_experimental_features_look_and_feel.html.

Reuben




Product Consultant (Asia Pacific)
Developer Relations Manager (Worldwide)
Author of https://4js.com/ask-reuben
Contributor to https://github.com/FourjsGenero
Pages: [1]
  Reply  |  Print  
 
Jump to:  

Powered by SMF 1.1.21 | SMF © 2015, Simple Machines