PureBasic Forums - English

Posted: **Fri Jan 21, 2022 4:09 pm**

Hi,

I'm quit new on linux (Ubuntu, Raspberry Pi). Latest PB version 6.00 beta 2.

Trying to use some code made earlier on windows, I notice quit a difference in size of the gadgets.
Also when imported as form (.pbf).
For example the TextGadget seems to keep it's size height, but the ButtonGadget is quit double in height :

txt =TextGadget(#PB_Any, 5, 6, 198, 20, "PORT",#PB_Text_Center)
btn = ButtonGadget(#PB_Any, 210, 140, 40, 20, "Clear")

Where can I find the references about all these differences ?
Is there no Linux PB help file online (for the moment, as the PB help doesn't work) ?

Thanks

Posted: **Fri Jan 21, 2022 6:04 pm**

Under Linux, graphic objects that contain text grow according to the size of the text (height and length).
It is therefore impossible to set the size of these elements below a minimum size.

There is a way to override this "feature" in the GTK settings, but I don't know where I saw that or how to do it with cPB.

Posted: **Fri Jan 21, 2022 6:09 pm**

On linux the Button height as a minimum height of 34 pixels and as you said it's not documented anywhere. What I'm doing with the interfaces of my programs is test them on each platform and arrange them to look good. What I'm actually doing is repeating the gadgets in sections inside a CompilerSelect like this :

Code: Select all

CompilerSelect #PB_Compiler_OS
    
  CompilerCase #PB_OS_Windows ; The Interface for Windows
    
  CompilerCase #PB_OS_Linux ; The Interface for Linux
    
  CompilerCase #PB_OS_MacOS ; The Interface for MacOS
    
CompilerEndSelect

Best regards
StarBootics

Posted: **Fri Jan 21, 2022 6:13 pm**

That bothers me too, but it's because of gtk.

The sizes are not correct because of gtk css styles. The minimum sizes are stored in these. So buttons, etc. always have a minimum size.
There was a code somewhere to remove this limitation. But I can't find it again.

Posted: **Sat Jan 22, 2022 9:16 am**

mk-soft wrote: Fri Jan 21, 2022 6:13 pmThe sizes are not correct because of gtk css styles. The minimum sizes are stored in these. So buttons, etc. always have a minimum size.

Will changing the sizes in those gtk css styles have any effect when the compiled program runs on another (user) computer ?
Or does this user also have to change his/here gtk css styles ?

This place seems to be interesting (I need to study on all that, un less somebody did it before ...):
https://docs.gtk.org/gtk3/method.Widget ... quest.html

Thanks

Posted: **Sat Jan 22, 2022 6:29 pm**

@Joris - the previous comments are exactly right, it is normal behaviour with GTK3.

It should be noted that it is easier to set the gadget size using the GTK2 and QT subsystems.

I cannot recommend GTK2 for a new project as it officially at "end-of-life" status. However, I still use GTK2 for my large project which was converted from Windows when that was still the default subsystem in PureBasic. It has very many gadgets, densely arranged, and the result is pretty good IMHO. Conversion to GTK3 has not been possible so far due to this and other issues. I may try again or perhaps it will one day use QT?

Posted: **Sat Jan 22, 2022 8:25 pm**

So stupid of me,

I found it again how to adjust the GTK3 CSS styles. Also the minimum height of gadget and button padding.
The best thing is that I wrote it myself.

Update v1.01.1
- Fixed C-backend

Update v1.02.1
- Link: GTK3 Gadget CSS-Provider

Code: Select all

;-TOP

; Linux GTK CSS Gadget Style
; by      : mk-soft
; Version : v1.01.1
; Create  : 28.12.2018
; Update  : 22.01.2022

DeclareModule GtkGadgetStyle
  
  Declare AddCssProvider(Widget, StyleID, CSSData.s)
  Declare RemoveCssProvider(Widget, StyleID)
  Declare AddCssProviderForScreen(Widget, StyleID, CSSData.s)
  Declare RemoveCssProviderForScreen(Widget, StyleID)
  
  Declare.s CSSColorString(color.l)
  
EndDeclareModule

Module GtkGadgetStyle
  
  EnableExplicit
  
  CompilerIf Not Defined(PB_Compiler_Backend, #PB_Constant)
    #PB_Compiler_Backend = 0
    #PB_Backend_Asm = 0
    #PB_Backend_C = 1
  CompilerEndIf
  
  ;- Imports
  ImportC ""
    gtk_widget_get_screen(*Widget.GtkWidget)
    gtk_widget_get_style_context(*Widget.GtkWidget)
    gtk_css_provider_new()
    gtk_css_provider_load_from_data(*CSSProvider, CSSData.P-UTF8, Length, *Error.GError)
    gtk_style_context_add_provider(*CSSContext, *CSSProvider, Priority)
    gtk_style_context_remove_provider(*CSSContext, *CSSProvider)
    gtk_style_context_add_provider_for_screen(*CSSContext, *CSSProvider, Priority)
    gtk_style_context_remove_provider_for_screen(*CSSContext, *CSSProvider)
  EndImport
  
  ;- Constants
  #GTK_STYLE_PROVIDER_PRIORITY_FALLBACK = 1
  #GTK_STYLE_PROVIDER_PRIORITY_THEME = 200
  #GTK_STYLE_PROVIDER_PRIORITY_SETTINGS = 400
  #GTK_STYLE_PROVIDER_PRIORITY_APPLICATION = 600
  #GTK_STYLE_PROVIDER_PRIORITY_USER  = 800
  
  ;- Maps
  Global NewMap CSSProviderList()
  Global NewMap CSSProviderForScreenList()
  
  ; ---------------------------------------------------------------------------
  
  Procedure AddCssProvider(Widget, StyleID, CSSData.s)
    Protected CSSProvider, CSSContext
    CSSProvider = gtk_css_provider_new()
    CSSContext = gtk_widget_get_style_context(Widget)
    If FindMapElement(CSSProviderList(), Hex(Widget) + "/" + Hex(StyleID))
      gtk_style_context_remove_provider(CSSContext, CSSProviderList())
    EndIf
    CSSProviderList(Hex(Widget) + "/" + Hex(StyleID)) = CSSProvider
    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)
  EndProcedure
  
  ; ---------------------------------------------------------------------------
  
  Procedure RemoveCssProvider(Widget, StyleID)
    Protected CSSContext
    CSSContext = gtk_widget_get_style_context(Widget)
    If FindMapElement(CSSProviderList(), Hex(Widget) + "/" + Hex(StyleID))
      gtk_style_context_remove_provider(CSSContext, CSSProviderList())
      DeleteMapElement(CSSProviderList())
    EndIf
  EndProcedure
  
  ; ---------------------------------------------------------------------------
  
  Procedure AddCssProviderForScreen(Widget, StyleID, CSSData.s)
    Protected CSSProvider, CSSContext
    CSSProvider = gtk_css_provider_new()
    CSSContext = gtk_widget_get_screen(Widget)
    If FindMapElement(CSSProviderForScreenList(), Hex(Widget) + "/" + Hex(StyleID))
      gtk_style_context_remove_provider_for_screen(CSSContext, CSSProviderForScreenList())
    EndIf
    CSSProviderForScreenList(Hex(Widget) + "/" + Hex(StyleID)) = CSSProvider
    gtk_css_provider_load_from_data(CSSProvider, CSSData, -1, 0)
    gtk_style_context_add_provider_for_screen(CSSContext, CSSProvider, #GTK_STYLE_PROVIDER_PRIORITY_APPLICATION)
    g_object_unref_(CSSProvider)
  EndProcedure
  
  ; ---------------------------------------------------------------------------
  
  Procedure RemoveCssProviderForScreen(Widget, StyleID)
    Protected CSSContext
    CSSContext = gtk_widget_get_screen(Widget)
    If FindMapElement(CSSProviderForScreenList(), Hex(Widget) + "/" + Hex(StyleID))
      gtk_style_context_remove_provider_for_screen(CSSContext, CSSProviderForScreenList())
      DeleteMapElement(CSSProviderForScreenList())
    EndIf
  EndProcedure
  
  ; ---------------------------------------------------------------------------
  
  Procedure.s CSSColorString(color.l)
    CompilerIf #PB_Compiler_Backend = #PB_Backend_Asm
      !mov eax, dword [p.v_color]
      !bswap eax
      !shr eax, 8
      !mov dword [p.v_color], eax
    CompilerElse
      !v_color=__builtin_bswap32(v_color);
      !v_color=((unsigned int)v_color >> 8);
    CompilerEndIf
    ProcedureReturn "#" + RSet(Hex(Color, #PB_Long), 6, "0")
  EndProcedure
  
  ; ---------------------------------------------------------------------------
  
EndModule

; *******************************************************************************

CompilerIf #PB_Compiler_IsMainFile
  
  UseModule GtkGadgetStyle
  
  Define css_string.s, css_all.s, css_all_button.s, css_fr.s, css_bg1.s, css_bg2.s
  Define css_color.s
  
  If OpenWindow(0, 0, 0, 270, 140, "CSS-Gadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
    
    css_all = "* {min-height: 20px}"
    AddCssProviderForScreen(WindowID(0), 1, css_all) ; Gilt für alle Gadgets ab den Level
    css_all_button = "button {padding-bottom: 2px; padding-left: 8px; padding-right: 8px; padding-top: 2px}"
    AddCssProviderForScreen(WindowID(0), 2, css_all_button) ; Gilt für alle Gadgets ab den Level
    
    StringGadget(0, 10, 10, 250, 20, "StringGadget")
    ButtonGadget(1, 10, 45, 120, 20, "Toggle", #PB_Button_Toggle)  
    ButtonGadget(2, 140, 45, 120, 20, "Remove")  
    
    css_color = CSSColorString(RGB(255,255,0))
    
    css_string = "entry {color: darkred; background-color: gray} entry > selection {background-color: " + css_color + "}"
    css_fr = "button {color: blue}"
    css_bg1 = "* button {background: yellow;}"
    css_bg2 = "* button {background: green;}"
    
    AddCssProviderForScreen(WindowID(0), 3, css_fr) ; Gilt für alle Gadgets ab den Level
    
    AddCssProvider(GadgetID(0), 1, css_string)
    AddCssProvider(GadgetID(1), 2, css_bg1)
    AddCssProvider(GadgetID(2), 3, css_bg2)
    
    Repeat
      Select WaitWindowEvent()
        Case #PB_Event_CloseWindow
          Break
        Case #PB_Event_Gadget
          Select EventGadget()
            Case 1
              If GetGadgetState(1)
                AddCssProvider(GadgetID(1), 2, css_bg2)
              Else
                AddCssProvider(GadgetID(1), 2, css_bg1)
              EndIf  
            Case 2
              RemoveCssProvider(GadgetID(1), 2)
          EndSelect
      EndSelect
    ForEver
  EndIf
  
CompilerEndIf

Posted: **Sun Jan 23, 2022 10:50 am**

mk-soft,

Thanks very much.

That looks like nice sized gadgets, beautiful.
A lot of stuff to be studied and searched. I'm getting old.
aarrgghhh ....

Posted: **Sun Jan 23, 2022 11:55 am**

Linux Inspector GTK3

Activate on Terminal:
gsettings set org.gtk.Settings.Debug enable-inspector-keybinding true

Start:
- Focus on gtk3 program
- <Shift><Ctrl><i>

Inspector:
- Open tree and select GtkEntry or GtkButton or ...
- ToolBar (i)
- Combobox Detail -> CSS-Node

Posted: **Sun Jan 23, 2022 3:30 pm**

@mk-soft - - really good code and information as always - will be very useful

Joris wrote: Sun Jan 23, 2022 10:50 amA lot of stuff to be studied and searched. I'm getting old.
aarrgghhh ....

... Me too

Posted: **Mon Jan 24, 2022 10:53 am**

mk-soft wrote: Sun Jan 23, 2022 11:55 am Linux Inspector GTK3

Activate on Terminal:
gsettings set org.gtk.Settings.Debug enable-inspector-keybinding true

Start:
- Focus on gtk3 program
- <Shift><Ctrl><i>

This I can do.

mk-soft wrote: Sun Jan 23, 2022 11:55 am Inspector:
- Open tree and select GtkEntry or GtkButton or ...
- ToolBar (i)
- Combobox Detail -> CSS-Node

What or where in that program should I find this exactly (my version here on Ubuntu is in Dutch language ...)
So... which tree do you mean ? (I can open more then one but have no clue which one). Maybe this all isn't ment for my simple brain...

Posted: **Mon Jan 24, 2022 1:52 pm**

The Linux Inspector (GTK3) is already installed and only needs to be activated via Terminal.
There you can use the Inspector to check the windows and widgets from running program.
Just try out what the Inspector can display.

PureBasic Forums - English

Gadget size differents ???

Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???

Re: Gadget size differents ???