gtk3 Frame issue

[jcfuller]

Peter,
I have just begun another foray with Linux and of course I have an issue right away.
While I love BaCon you know my preference is c++.
Using wxWidgets-3.0 on Linux Mint 17 64 cinnamon , I discovered what I think is an issue with the gtk3 frame.



At first I was not sure if it was a wxWidget or a gtk3 issue.
I tried the wxWidget-3.0 demo on Ubuntu 14.04.1 LTS and all was fine



To narrow it down I installed the latest BaCon on Mint 17 64 MATE and compiled the qix example.
Here is a screen shot.


No visible frames ?



James

[vovchik]

Dear James,

I see what you mean, but frames are working with gtk3 here and worked in gtk2 as well:

basic-converter.proboards.com/attachment/download/963

I am using mint16 (32 bit) and cinnamon.

With kind regards,
vovchik

[vovchik]

Dear James,

But you are right. All the frame options look the same. I must be missing something.


' ***********************
' COMPILER OPTIONS
' ***********************

PRAGMA OPTIONS `pkg-config --cflags gtk+-3.0`
PRAGMA LDFLAGS `pkg-config --libs gtk+-3.0`
OPTION PARSE FALSE

' ***********************
' END COMPILER OPTIONS
' ***********************


' ***********************
' INITIALIZATION
' ***********************

DECLARE *window TYPE void
DECLARE *frame1, *frame2, *frame3, *frame4 TYPE void
DECLARE *table TYPE void
CONST MY_VERSION$ = "v.01a"

' ***********************
' END INITIALIZATION
' ***********************

' ***********************
' SUB & FUNCTIONS
' ***********************

' -----------------
SUB DESTROY(NUMBER widget, void* data)
' -----------------
gtk_main_quit()
END SUB


' -----------------
SUB MK_GUI()
' -----------------
gtk_init(0, 0)
window = gtk_window_new(0)
'gtk_window_set_opacity(window, 0.5)
gtk_window_set_position(window, 0)
gtk_window_set_default_size(window, 250, 250)
gtk_window_set_title(window, CONCAT$("Gtk3 Frame - ", MY_VERSION$))
gtk_container_set_border_width(window, 10)
table = gtk_table_new(2, 2, TRUE)
gtk_table_set_row_spacings(table, 10)
gtk_table_set_col_spacings(table, 10)
gtk_container_add(window, table)
frame1 = gtk_frame_new("Shadow In")
gtk_frame_set_shadow_type(frame1, 1)
frame2 = gtk_frame_new("Shadow Out")
gtk_frame_set_shadow_type(frame2, 2)
frame3 = gtk_frame_new("Shadow Etched In")
gtk_frame_set_shadow_type(frame3, 3)
frame4 = gtk_frame_new("Shadow Etched Out")
gtk_frame_set_shadow_type(frame4, 4)
gtk_table_attach_defaults(table, frame1, 0, 1, 0, 1)
gtk_table_attach_defaults(table, frame2, 0, 1, 1, 2)
gtk_table_attach_defaults(table, frame3, 1, 2, 0, 1)
gtk_table_attach_defaults(table, frame4, 1, 2, 1, 2)
g_signal_connect_data(window, "destroy", ADDRESS(DESTROY), 0, 0, 0)
gtk_widget_show_all(window)
END SUB

' ***********************
' END SUBS & FUNCTIONS
' ***********************


' ***********************
' MAIN
' ***********************

MK_GUI()
gtk_main()

' ***********************
' END MAIN
' ***********************


Woth kind regards,
vovchik

[jcfuller]

They show but are all flat.



I don't know why the qix ones are not showing at all?


James

[Pjot]

Hi James,

This is not a bug but a result of the GTK theme you are using.

If you go to the settings panel and change the GTK theme to, for example, "Redmond", then the frames will show.

BR
Peter

[vovchik]

Dear James and Peter,

All of my frames are also flat in GTK3 - no matter what theme I choose - Mint standard or one of the 6 others I have installed. I think it may indeed be a bug in GTK3..or oversight on the part of the theme designers. GTK2 does show the various types of frame.

With kind regards,
vovchik

[jcfuller]

Sept 2, 2014 20:03:11 GMT 1 Pjot said:

Hi James,

This is not a bug but a result of the GTK theme you are using.

If you go to the settings panel and change the GTK theme to, for example, "Redmond", then the frames will show.

BR
Peter

Sheeese!!
I don't want to use another theme. I love the way Mint 17 64 cinnamon looks.
To me it IS A BUG not to have all the base widgets available in the default theme.

Peter, you are the wizard of Linux so whip us up a theme exactly the same as the default but with visible frames

James

[vovchik]

Dear James,

Theming gtk3 is not a simple or trivial proposition. It is painstaking work and requires the assembly of lots of css files (css is now used for gtk3). And the resulting theme may not suit other people. It has little to do with Linux and BaCon but is a choice made by the developers of gtk3 to abandon the gtk2 way of doing things and to use css exclusively. The latest discussions relating the gtk3 theming and BaCon are here (last pages):

basic-converter.proboards.com/threads/recent/703

You will see, and as Joe and I have discovered, that things are not that easy. I cannot, to this day, paint backgrounds of main windows using base64-encoded pixmaps. I did manage to load pixmaps from files and to get css gradients to work as backgrounds and got gtk_layout to work with pixbufs. And I managed to customize buttons. But that is special-purpose stuff intended for specific applications. It seems to me that the enum that contains the different values for frame styles has no particular effect in gtk3, although the function for changing frame styles has not been deprecated yet.

I think that is simply life with gtk3. Some frustrated developers, such as the guys who do the music player audacious, are moving back to gtk2.

With kind regards,
vovchik

PS. I have managed to use wx-widgets and BaCon. experimental-coding.freeforums.net/thread/37/bacon-wxwidgets-working

[jcfuller]

I dumped MATE and went back to cinnamon.
The theme dialog has an "other settings" tab where I changed controls to Adwaita.
Not really what I want but I now have frames.

James

[vovchik]

Dear James,

This is what the GNOME people have to say about frames:

mail.gnome.org/archives/gtk-list/2012-September/msg00035.html

and more info here:

stackoverflow.com/questions/13001990/why-is-there-no-a-border-on-this-gtkframe

So the user or theme designer has to provide the appropriate css stuff for them to show.

With kind regards,
vovchik

PS. Thanks for bringing up this subject. I learned something about gtk3 in the process of investigating this problem.

[jcfuller]

It looks like we might get a fix??
Mint Forum Post

James

[vovchik]

Dear James,

Here is a little home-made fix:


' ***********************
' COMPILER OPTIONS
' ***********************

PRAGMA OPTIONS `pkg-config --cflags gtk+-3.0`
PRAGMA LDFLAGS `pkg-config --libs gtk+-3.0`
OPTION PARSE FALSE

' ***********************
' END COMPILER OPTIONS
' ***********************


' ***********************
' INITIALIZATION
' ***********************

DECLARE *window TYPE void
DECLARE *frame1, *frame2, *frame3, *frame4 TYPE void
DECLARE *table TYPE void
CONST MY_VERSION$ = "v.01a"

' ***********************
' END INITIALIZATION
' ***********************

' ***********************
' SUB & FUNCTIONS
' ***********************

' -----------------
SUB DESTROY(NUMBER widget, void* data)
' -----------------
gtk_main_quit()
END SUB

' -----------------
SUB FIX_FRAME(STRING bg$, STRING border$, int size, int pad, int radius, int style)
' -----------------
' use #xxxxxx or named color in quotes
' plus thickness, pad, radius and style as int
LOCAL provider TYPE void*
LOCAL display TYPE void*
LOCAL screen TYPE void*
LOCAL data$, style$ TYPE STRING
' The border-style property accepts the 'none', 'solid',
' 'inset' and 'outset' keywords.
SELECT style
CASE 0
style$ = "none"
CASE 1
style$ = "solid"
CASE 2
style$ = "inset"
CASE 3
style$ = "outset"
END SELECT
data$ = ".frame{" & \
"background-color:" & bg$ &  ";" & \
"border:" & STR$(size) & "px solid " & border$ & ";" & \
"padding:" & STR$(pad) & "px;" & \
"border-radius:" & STR$(radius) & "px;" \
"border-style:" & style$ & ";" & \
" }"
provider = gtk_css_provider_new()
display = gdk_display_get_default()
screen = gdk_display_get_default_screen(display)
gtk_style_context_add_provider_for_screen (screen, provider, 600)
gtk_css_provider_load_from_data(provider, data$, -1, NULL)
g_object_unref(provider)
END SUB

' -----------------
SUB MK_GUI()
' -----------------
LOCAL shadow TYPE int
gtk_init(0, 0)
window = gtk_window_new(0)
'gtk_window_set_opacity(window, 0.5)
gtk_window_set_position(window, 0)
gtk_window_set_default_size(window, 250, 250)
gtk_window_set_title(window, CONCAT$("Gtk3 Frame - ", MY_VERSION$))
gtk_container_set_border_width(window, 10)
table = gtk_table_new(2, 2, TRUE)
gtk_table_set_row_spacings(table, 10)
gtk_table_set_col_spacings(table, 10)
gtk_container_add(window, table)
frame1 = gtk_frame_new("Shadow In")
gtk_frame_set_shadow_type(frame1, 1)
frame2 = gtk_frame_new("Shadow Out")
gtk_frame_set_shadow_type(frame2, 2)
frame3 = gtk_frame_new("Etched In")
gtk_frame_set_shadow_type(frame3, 3)
frame4 = gtk_frame_new("Etched Out")
gtk_frame_set_shadow_type(frame4, 4)
gtk_table_attach_defaults(table, frame1, 0, 1, 0, 1)
gtk_table_attach_defaults(table, frame2, 0, 1, 1, 2)
gtk_table_attach_defaults(table, frame3, 1, 2, 0, 1)
gtk_table_attach_defaults(table, frame4, 1, 2, 1, 2)
g_signal_connect_data(window, "destroy", ADDRESS(DESTROY), 0, 0, 0)
' use #xxxxxx or named colors in quotes for bg and border,
' plus thickness, pad, radius and style as int
FIX_FRAME("pink", "dimgray", 3, 4, 8, 3)
gtk_widget_show_all(window)
END SUB

' ***********************
' END SUBS & FUNCTIONS
' ***********************


' ***********************
' MAIN
' ***********************

MK_GUI()
gtk_main()

' ***********************
' END MAIN
' ***********************


I hope it works for you.

With kind regards,
vovchik

PS. I still have to learn how to do this on a per-widget basis. The line colours could be expressed as gradient fills to achieve the sunken or protruded effect we used to have. I relied on this for info:

thegnomejournal.wordpress.com/2011/03/15/styling-gtk-with-css/

PPS. And pretty insane stuff is possible, too, with css and frames:


' ***********************
' COMPILER OPTIONS
' ***********************

PRAGMA OPTIONS `pkg-config --cflags gtk+-3.0`
PRAGMA LDFLAGS `pkg-config --libs gtk+-3.0`
OPTION PARSE FALSE

' ***********************
' END COMPILER OPTIONS
' ***********************


' ***********************
' INITIALIZATION
' ***********************

DECLARE *window TYPE void
DECLARE *frame1, *frame2, *frame3, *frame4 TYPE void
DECLARE *table TYPE void
CONST MY_VERSION$ = "v.01a"

' ***********************
' END INITIALIZATION
' ***********************

' ***********************
' SUB & FUNCTIONS
' ***********************

' -----------------
SUB DESTROY(NUMBER widget, void* data)
' -----------------
gtk_main_quit()
END SUB

' -----------------
SUB FRAME_GRAD(int size, int pad, int radius, int style)
' -----------------
' colors hard-coded at the moment
' thickness, pad, radius and style as int
LOCAL provider TYPE void*
LOCAL display TYPE void*
LOCAL screen TYPE void*
LOCAL data$, style$ TYPE STRING
' The border-style property accepts the 'none', 'solid',
' 'inset' and 'outset' keywords.
SELECT style
CASE 0
style$ = "none"
CASE 1
style$ = "solid"
CASE 2
style$ = "inset"
CASE 3
style$ = "outset"
END SELECT
data$ = ".frame{" & \
"border-color: shade(mix(rgb(36, 100, 90), red, 0.5), 0.9);" & \
"background-image: -gtk-gradient (linear, left top, " & \
"left bottom, from (pink), " & \
"color-stop (0.5, darker (maroon)), " & \
"to (orange)); " & \
"padding:" & STR$(pad) & "px;" & \
"border-radius:" & STR$(radius) & "px;" \
"border-style:" & style$ & ";" & \
" }"
provider = gtk_css_provider_new()
display = gdk_display_get_default()
screen = gdk_display_get_default_screen(display)
gtk_style_context_add_provider_for_screen (screen, provider, 600)
gtk_css_provider_load_from_data(provider, data$, -1, NULL)
g_object_unref(provider)
END SUB

' -----------------
SUB MK_GUI()
' -----------------
LOCAL shadow TYPE int
gtk_init(0, 0)
window = gtk_window_new(0)
gtk_window_set_position(window, 0)
gtk_window_set_default_size(window, 250, 250)
gtk_window_set_title(window, CONCAT$("Gtk3 Frame - ", MY_VERSION$))
gtk_container_set_border_width(window, 10)
table = gtk_table_new(2, 2, TRUE)
gtk_table_set_row_spacings(table, 10)
gtk_table_set_col_spacings(table, 10)
gtk_container_add(window, table)
frame1 = gtk_frame_new("Shadow In")
gtk_frame_set_shadow_type(frame1, 1)
frame2 = gtk_frame_new("Shadow Out")
gtk_frame_set_shadow_type(frame2, 2)
frame3 = gtk_frame_new("Etched In")
gtk_frame_set_shadow_type(frame3, 3)
frame4 = gtk_frame_new("Etched Out")
gtk_frame_set_shadow_type(frame4, 4)
gtk_table_attach_defaults(table, frame1, 0, 1, 0, 1)
gtk_table_attach_defaults(table, frame2, 0, 1, 1, 2)
gtk_table_attach_defaults(table, frame3, 1, 2, 0, 1)
gtk_table_attach_defaults(table, frame4, 1, 2, 1, 2)
g_signal_connect_data(window, "destroy", ADDRESS(DESTROY), 0, 0, 0)
' colors hard-coded at the moment
' thickness, pad, radius and style as int
FRAME_GRAD(3, 4, 8, 3)
gtk_widget_show_all(window)
END SUB

' ***********************
' END SUBS & FUNCTIONS
' ***********************


' ***********************
' MAIN
' ***********************

MK_GUI()
gtk_main()

' ***********************
' END MAIN
' ***********************


Attachments:

[jcfuller]

vovchik,
Not much of a fix here with Mint 17 64 cinnamon.
It translates and compiles fine but takes 30-45 secs when run to show. Then it appears to be eating most cpu cycles ??

I have the fix I need for my continuing UbxWx research.
I tried hard at the beginning of BaCon to persuade Peter to come over to the dark side (g++) but to no avail

I use BaCon to primarily test issues like the one found here.

Continue the good work gentlemen!

James

[bigbass]

Hey vovchik

that's a great work around for gtk3 and css!

I thought also to take a swing at this problem
because we will need some simple demos ported to BaCon

from gtk2 to gtk3

sadly gtk3 went though many changes and porting code
requires some detective work
it shouldn't be that way but it is

using this C source as the reference

www.dlhoffman.com/publiclibrary/software/gtk+-html-docs/gtk_tut-8.html

/* aspectframe.c */


there are several pitfalls you have to overcome first and I documented them all

compile like this

gcc aframe.c -o aframe `pkg-config --cflags --libs "gtk+-3.0"`

*all the terminal output errors are in blue

aframe.c:(.text+0x59): undefined reference to `GTK_SIGNAL_FUNC'
-------------------------------------------------------------------
now fixed the GTK_SIGNAL_FUNC error by replacing with G_CALLBACK
-----------------------------------------------------------------



aframe.c:(.text+0x58): undefined reference to `GTK_OBJECT'

now fixed the GTK_OBJECT error by replacing with G_OBJECT



aframe.c:(.text+0x78): undefined reference to `gtk_signal_connect'
------------------------------------------------------------------
now fixed the GTK_OBJECT error by replacing with g_signal_connect
-----------------------------------------------------------------



aframe.c:(.text+0x9d): undefined reference to `gtk_container_border_width'

replaced this gtk2
gtk_container_border_width (GTK_CONTAINER (window), 10);

with this gtk3
------------------------------------------------------------
gtk_container_set_border_width (GTK_CONTAINER (window), 10);
------------------------------------------------------------



aframe.c:(.text+0x126): undefined reference to `gtk_widget_set_usize'
collect2: error: ld returned 1 exit status

replaced this gtk2
instead gtk_widget_set_usize()

with this gtk3
-----------------------------------------------------------------
gtk_widget_set_size_request()
----------------------------------------------------------------



fixed sources for gtk3 without css

/* aframe.c */

#include <gtk-3.0/gtk/gtk.h>

int
main (int argc, char *argv[])
{
   GtkWidget *window;
   GtkWidget *aspect_frame;
   GtkWidget *drawing_area;
   gtk_init (&argc, &argv);
 
   window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
   gtk_window_set_title (GTK_WINDOW (window), "Aspect Frame");
   g_signal_connect (G_OBJECT (window), "destroy",
   G_CALLBACK (gtk_main_quit), NULL);
   gtk_container_set_border_width (GTK_CONTAINER (window), 10);

 
   /* Create an aspect_frame and add it to our toplevel window */
 
   aspect_frame = gtk_aspect_frame_new ("2x1", /* label */
                                        0.5, /* center x */
                                        0.5, /* center y */
                                        2, /* xsize/ysize = 2 */
                                        FALSE /* ignore child's aspect */);
 
   gtk_container_add (GTK_CONTAINER(window), aspect_frame);
   gtk_widget_show (aspect_frame);
 
   /* Now add a child widget to the aspect frame */
 
   drawing_area = gtk_drawing_area_new ();
 
   /* Ask for a 200x200 window, but the AspectFrame will give us a 200x100
    * window since we are forcing a 2x1 aspect ratio */
gtk_widget_set_size_request (drawing_area, 200, 200);
   gtk_container_add (GTK_CONTAINER(aspect_frame), drawing_area);
   gtk_widget_show (drawing_area);
 
   gtk_widget_show (window);
   gtk_main ();
   return 0;
}  



[vovchik]

Dear Joe,

Thanks for aspect frame. Great find. I didn't know it existed. That may actually be the easier, but less pretty, way of doing simple frames. Here is something using css that looks somewhat like the old etched frames (the background could be made transparent, too):


' ***********************
' COMPILER OPTIONS
' ***********************

PRAGMA OPTIONS `pkg-config --cflags gtk+-3.0`
PRAGMA LDFLAGS `pkg-config --libs gtk+-3.0`
OPTION PARSE FALSE

' ***********************
' END COMPILER OPTIONS
' ***********************


' ***********************
' INITIALIZATION
' ***********************

DECLARE *window TYPE void
DECLARE *frame1, *frame2, *frame3, *frame4 TYPE void
DECLARE *table TYPE void
CONST MY_VERSION$ = "v.01a"

' ***********************
' END INITIALIZATION
' ***********************

' ***********************
' SUB & FUNCTIONS
' ***********************

' -----------------
SUB DESTROY(NUMBER widget, void* data)
' -----------------
gtk_main_quit()
END SUB

' -----------------
SUB FIX_FRAME(STRING bg$, STRING border$, int size, int pad, int radius, int style)
' -----------------
' use #xxxxxx or named color in quotes
' plus thickness, pad, radius and style as int
LOCAL provider TYPE void*
LOCAL display TYPE void*
LOCAL screen TYPE void*
LOCAL data$, style$ TYPE STRING
' The border-style property accepts the 'none', 'solid',
' 'inset' and 'outset' keywords.
SELECT style
CASE 0
style$ = "none"
CASE 1
style$ = "solid"
CASE 2
style$ = "inset"
CASE 3
style$ = "outset"
END SELECT
data$ = ".frame{" & \
"background-color:" & bg$ &  ";" & \
"border-color: shade (mix (rgb (14, 15, 10), " & border$ & ", 0.5), 0.9);" & \
"padding:" & STR$(pad) & "px;" & \
"border-radius:" & STR$(radius) & "px;" \
"border-style:" & style$ & ";" & \
" }"
provider = gtk_css_provider_new()
display = gdk_display_get_default()
screen = gdk_display_get_default_screen(display)
gtk_style_context_add_provider_for_screen (screen, provider, 600)
gtk_css_provider_load_from_data(provider, data$, -1, NULL)
g_object_unref(provider)
END SUB

' -----------------
SUB MK_GUI()
' -----------------
LOCAL shadow TYPE int
gtk_init(0, 0)
window = gtk_window_new(0)
'gtk_window_set_opacity(window, 0.5)
gtk_window_set_position(window, 0)
gtk_window_set_default_size(window, 250, 250)
gtk_window_set_title(window, CONCAT$("Gtk3 Frame - ", MY_VERSION$))
gtk_container_set_border_width(window, 10)
table = gtk_table_new(2, 2, TRUE)
gtk_table_set_row_spacings(table, 10)
gtk_table_set_col_spacings(table, 10)
gtk_container_add(window, table)
frame1 = gtk_frame_new("Shadow In")
gtk_frame_set_shadow_type(frame1, 1)
frame2 = gtk_frame_new("Shadow Out")
gtk_frame_set_shadow_type(frame2, 2)
frame3 = gtk_frame_new("Etched In")
gtk_frame_set_shadow_type(frame3, 3)
frame4 = gtk_frame_new("Etched Out")
gtk_frame_set_shadow_type(frame4, 4)
gtk_table_attach_defaults(table, frame1, 0, 1, 0, 1)
gtk_table_attach_defaults(table, frame2, 0, 1, 1, 2)
gtk_table_attach_defaults(table, frame3, 1, 2, 0, 1)
gtk_table_attach_defaults(table, frame4, 1, 2, 1, 2)
g_signal_connect_data(window, "destroy", ADDRESS(DESTROY), 0, 0, 0)
' use #xxxxxx or named colors in quotes for bg and border,
' plus thickness, pad, radius and style as int
FIX_FRAME("#cacaca", "white", 9, 4, 8, 3)
gtk_widget_show_all(window)
END SUB

' ***********************
' END SUBS & FUNCTIONS
' ***********************


' ***********************
' MAIN
' ***********************

MK_GUI()
gtk_main()

' ***********************
' END MAIN
' ***********************


It's nice that we have some options and can do fancy things if need be and simple ones where that is required or desired. I will experiment with aspect frames now. I'll bet they also support css enhancement.

With kind regards,
vovchik