Gtk Button Theming 'suggested-action' and 'destructive-action'

Post

Posted
Rating:
#1 (In Topic #1087)
Regular
JumpyVB is in the usergroup ‘Regular’
 In Gambas, how do I define a button to be themed as 'destructive-action' or 'suggested-action'? They should be of different color.
Online now: No Back to the top

Post

Posted
Rating:
#2
Avatar
Guru
cogier is in the usergroup ‘Guru’
In Gambas, how do I define a button to be themed as 'destructive-action' or 'suggested-action'? They should be of different color.

The best way is to make your own bespoke button. Run this code in a new Graphical Application.

Code (gambas)

  1. PanelButton As Panel
  2. Label1 As Label
  3.  
  4. Public Sub Form_Open()
  5.  
  6.   With Me
  7.     .Center
  8.     .Y = 250
  9.     .Height = 75
  10.     .Width = 300
  11.  
  12.   With PanelButton = New Panel(Me) As "PanelButton"
  13.     .Height = 56
  14.     .Width = 100
  15.     .Arrangement = Arrange.Vertical
  16.     .Background = Color.Yellow
  17.     .Border = Border.Raised
  18.  
  19.   With Label1 = New Label(PanelButton) As "Label1"
  20.     .Expand = True
  21.     .Font.Size = 18
  22.     .Font.Bold = True
  23.     .Foreground = Color.Red
  24.     .Alignment = Align.Center
  25.     .Text = "Destructive-action!!"
  26.  
  27.  
  28. Public Sub Label1_MouseDown()
  29.  
  30.   PanelButton.Border = Border.Sunken
  31.  
  32.  
  33. Public Sub Label1_MouseUp()
  34.  
  35.   Message.Warning("This computer will now crash in a fountain of your code!", "OK")
  36.   PanelButton.Border = Border.Raised
  37.  
  38.  
Online now: No Back to the top

Post

Posted
Rating:
#3
Regular
JumpyVB is in the usergroup ‘Regular’
I appreaciate the humour :D
Online now: No Back to the top

Post

Posted
Rating:
#4
Regular
vuott is in the usergroup ‘Regular’

JumpyVB said

In Gambas, how do I define a button to be themed as 'destructive-action' or 'suggested-action'? They should be of different color.
Forgive me, but :? I do not quite understand what you want to achieve.

Europaeus sum !

<COLOR color="#FF8000">Amare memorentes atque deflentes ad mortem silenter labimur.</COLOR>
Online now: No Back to the top

Post

Posted
Rating:
#5
Regular
JumpyVB is in the usergroup ‘Regular’
Here's a screenshot illustrating the use of suggested-action style class. On the screenshot I am closing an unsaved document in the xed text editor and the program highlights the "Save As…" button. Gtk Inspector reveals that the button has a suggested-action css style class associated to it. The color in this case is defined in /usr/share/themes/Mint-Yz-Base-Purple/gtk-3.0/gtk.css
Image

(Click to enlarge)

I wan't a specific button on my gambas app to be styled like this. I don't want to hardcode the background. I want the appearance to follow which ever theme the user has specified on their gnu/linux.

PS: I'm using Linux Mint and SebastJava/mint-yz-theme here.

PSS: Maybe this could be achieved in QT as well as in Gtk. I can change my app to using QT. I know you vuott are using QT if I remember correctly from an earlier post.
Online now: No Back to the top

Post

Posted
Rating:
#6
Guru
BruceSteers is in the usergroup ‘Guru’
 You can set a buttons Cancel or Default Boolean properties.

btnSaveAs.Default = True
btnExit.Cancel = True
Online now: No Back to the top

Post

Posted
Rating:
#7
Regular
JumpyVB is in the usergroup ‘Regular’

BruceSteers said

You can set a buttons Cancel or Default Boolean properties.
btnSaveAs.Default = True
btnExit.Cancel = True

I tried default and cancel but they don't change the appearance - At least on my setup.

I will post a new question about theming QT apps.
Online now: No Back to the top

Post

Posted
Rating:
#8
Guru
BruceSteers is in the usergroup ‘Guru’
 It's down to the theme config.

You have to code it yourself if you want it guaranteed.
Online now: No Back to the top

Post

Posted
Rating:
#9
Regular
JumpyVB is in the usergroup ‘Regular’

BruceSteers said

It's down to the theme config.

How should I theme config for a Gambas app?

There seems to be something odd with naming convention of gtk ui elements in Gambas. Here's a screenshot showcasing my image viewer prototype made in Gambas as a GTK+3 Application. For example Gtk Inspector reveals that the proggressbar is called GtkFixed - Which makes it impossible to be themed? I would have expected it to be called GtkProggressBar and have the name ProgressBar1 shown aswell - As compared to gtk3-widget-factory on the right side on the screenshot. Is it possible that proggressbar is not a native gtk component in Gambas?

Image

(Click to enlarge)

Online now: No Back to the top

Post

Posted
Rating:
#10
Guru
BruceSteers is in the usergroup ‘Guru’
You'd have to ask Benoit about that level of internal detail.

Personally i think it would be easier to just make your own buttons like cogier first suggested.

I'd probably do something like this….

Save this code in my projects .src folder as Form.class

Code (gambas)

  1. ' Gambas class file
  2.  
  3.  
  4. Public Sub Show()
  5.  
  6.   SetButtonColors
  7.   Super.Show()
  8.  
  9.  
  10. Public Sub ShowModal() As Integer
  11.  
  12.   SetButtonColors
  13.   Return Super.ShowModal()
  14.  
  15.  
  16. Private Sub SetButtonColors()
  17.  
  18.   For Each c As Control In Me.Controls
  19.     If c Is Button Then
  20.       b = c
  21.       If b.Default Then b.Background = Color.SetAlpha(Color.Green, 220)
  22.       If b.Cancel Then b.Background = Color.SetAlpha(Color.Red, 220)
  23.     Endif
  24.   Next
  25.  
  26.  
  27.  

That will make ALL your programs windows buttons (including modal windows like Message.class) show a hint of green if Default or a hint of red if Cancel.

of course you can change the color to your own liking

PS. you need to explicitly use Me.Show in your startup forms Form_Open() method as it does not seem to run Show() itself.
Online now: No Back to the top

Post

Posted
Rating:
#11
Regular
JumpyVB is in the usergroup ‘Regular’

cogier said

The best way is to make your own bespoke button.
Okay, I'll have a go with this. I will need to wrap this in to a custom control to keep the source code of FMain ungluttered. Let's leave out the label for now to make things more simple. So far I have created a "NiceButton.class":

Code (gambas)

  1. ' Gambas class file
  2.  
  3.  
  4. Public Sub _New()
  5.   Me.Background = Color.Black
  6.  
  7. Private Sub Me_MouseDown()
  8.   Me.Background = Color.Red
  9.  
  10. Private Sub Me_Enter()
  11.   Me.Background = Color.Yellow
  12.  
  13. Private Sub Me_Leave()
  14.   Me.Background = Color.Black
  15.  
  16. Private Sub Me_MouseUp()
  17.   Me.Background = Color.Black
  18.  
  19. Private Sub Me_GotFocus()
  20.   Me.Border = Border.Dashed
  21.  
  22. Private Sub Me_LostFocus()
  23.   Me.Border = Border.None

I have this in a new Graphical application with a single VBox on the FMain to populate my buttons (or a single button now for starters):

Code (gambas)

  1. Public Sub Form_Open()
  2.   PopulateGUI()
  3.  
  4. Private Button_Refresh As NiceButton
  5. Private Sub PopulateGUI()
  6.   With Button_Refresh = New NiceButton(VBox1) As "Button_Refresh"
  7.     .Height = 28
  8.     .Width = 120
  9. Public Procedure Button_Refresh_Click()
  10.   Me.Text = "It works!"
Only hovering the mouse cursor over my nice panel button or clicking it has no effect :( What am I doing wrong here?
Online now: No Back to the top

Post

Posted
Rating:
#12
Avatar
Guru
cogier is in the usergroup ‘Guru’
Have a look at ColButton that's on the farm and here.
Online now: No Back to the top

Post

Posted
Rating:
#13
Regular
JumpyVB is in the usergroup ‘Regular’

cogier said

Have a look at ColButton that's on the farm and here.
 Exactly what I needed. Thank you very much.
Online now: No Back to the top
1 guest and 0 members have just viewed this.