"draw" icon with string

classic Classic list List threaded Threaded
13 messages Options
Reply | Threaded
Open this post in threaded view
|

"draw" icon with string

Gtk+ - Apps Dev mailing list
I want to use my own drag-icon in a Gtk.TreeView where this is set as
an instance of GdkPixbuf.Pixbuf.

I can I create/draw a pixbuf and create Text, background and border
color in it?
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Chris Moller-3
You probably can't do that--GTK has gotten just about impossible to
customise--but if you can do it at all, you'll probably have to use CSS.

On 01/09/18 17:20, c.buhtz--- via gtk-app-devel-list wrote:

> I want to use my own drag-icon in a Gtk.TreeView where this is set as
> an instance of GdkPixbuf.Pixbuf.
>
> I can I create/draw a pixbuf and create Text, background and border
> color in it?
> _______________________________________________
> gtk-app-devel-list mailing list
> [hidden email]
> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
>
>

_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
In reply to this post by Gtk+ - Apps Dev mailing list
On Sat, 1 Sep 2018 at 22:20, c.buhtz--- via gtk-app-devel-list <
[hidden email]> wrote:

> I want to use my own drag-icon in a Gtk.TreeView where this is set as
> an instance of GdkPixbuf.Pixbuf.
>
> I can I create/draw a pixbuf and create Text, background and border
> color in it?
>

Typically, GtkTreeView will call gtk_tree_view_create_row_drag_icon() for
the default drag surface — a box with the contents of the row.

https://developer.gnome.org/gtk3/stable/GtkTreeView.html#gtk-tree-view-create-row-drag-icon

If you want to override that, you should call gtk_drag_set_icon_surface(),
using a Cairo surface you created:

https://developer.gnome.org/gtk3/stable/gtk3-Drag-and-Drop.html#gtk-drag-set-icon-surface

The GtkTreeView uses the default handler of the GtkWidget::drag-begin
signal to set the drag icon; you want your own handler to be called after
that, so you can override the drag icon with your own. To do that, you can:

 - call gtk_tree_view_unset_model_drag_source() or
gtk_tree_view_unset_model_drag_dest() and implement your own drag and drop
handling
 - call g_signal_stop_emission_by_name() in your drag-begin callback to
stop the signal emission chain, and prevent the default handler from running
 - use g_signal_connect_after() to connect your callback, and have your
handler run after the default one
 - subclass GtkTreeView and override the drag_begin() virtual function
without chaining up, to implement your own handler

Ciao,
 Emmanuele.

--
https://www.bassi.io
[@] ebassi [@gmail.com]
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
In reply to this post by Chris Moller-3
On Sun, 2 Sep 2018 at 02:02, Chris Moller <[hidden email]> wrote:

> You probably can't do that--GTK has gotten just about impossible to
> customise--but if you can do it at all, you'll probably have to use CSS.
>

Please, avoid this kind of unhelpful reply in the future.

Ciao,
 Emmanuele.

On 01/09/18 17:20, c.buhtz--- via gtk-app-devel-list wrote:

> > I want to use my own drag-icon in a Gtk.TreeView where this is set as
> > an instance of GdkPixbuf.Pixbuf.
> >
> > I can I create/draw a pixbuf and create Text, background and border
> > color in it?
> > _______________________________________________
> > gtk-app-devel-list mailing list
> > [hidden email]
> > https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
> >
> >
>
> _______________________________________________
> gtk-app-devel-list mailing list
> [hidden email]
> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
>


--
https://www.bassi.io
[@] ebassi [@gmail.com]
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
In reply to this post by Gtk+ - Apps Dev mailing list
Dear Emmanuele,

you describe how to set a drag icon. I know how to do this.
https://stackoverflow.com/q/51975256/4865723

But the question is how do I create my icon?

e.g. TreeView create it's own one, too. It is based on the row content.
I can I do the same? e.g. I only want the content of the second
column/cell and not the complete row?

 On 2018-09-02 02:33 Emmanuele Bassi
<[hidden email]> wrote:

> On Sat, 1 Sep 2018 at 22:20, c.buhtz--- via gtk-app-devel-list <
> [hidden email]> wrote:
>
> > I want to use my own drag-icon in a Gtk.TreeView where this is set
> > as an instance of GdkPixbuf.Pixbuf.
> >
> > I can I create/draw a pixbuf and create Text, background and border
> > color in it?
> >  
>
> Typically, GtkTreeView will call gtk_tree_view_create_row_drag_icon()
> for the default drag surface — a box with the contents of the row.
>
> https://developer.gnome.org/gtk3/stable/GtkTreeView.html#gtk-tree-view-create-row-drag-icon
>
> If you want to override that, you should call
> gtk_drag_set_icon_surface(), using a Cairo surface you created:
>
> https://developer.gnome.org/gtk3/stable/gtk3-Drag-and-Drop.html#gtk-drag-set-icon-surface
>
> The GtkTreeView uses the default handler of the GtkWidget::drag-begin
> signal to set the drag icon; you want your own handler to be called
> after that, so you can override the drag icon with your own. To do
> that, you can:
>
>  - call gtk_tree_view_unset_model_drag_source() or
> gtk_tree_view_unset_model_drag_dest() and implement your own drag and
> drop handling
>  - call g_signal_stop_emission_by_name() in your drag-begin callback
> to stop the signal emission chain, and prevent the default handler
> from running
>  - use g_signal_connect_after() to connect your callback, and have
> your handler run after the default one
>  - subclass GtkTreeView and override the drag_begin() virtual function
> without chaining up, to implement your own handler
>
> Ciao,
>  Emmanuele.
>

_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
On Tue, 4 Sep 2018 at 00:09, c.buhtz--- via gtk-app-devel-list <
[hidden email]> wrote:

> Dear Emmanuele,
>
> you describe how to set a drag icon. I know how to do this.
> https://stackoverflow.com/q/51975256/4865723
>
> But the question is how do I create my icon?
>

That's what I wrote in my email:

> If you want to override that, you should call
> gtk_drag_set_icon_surface(), using a Cairo surface you created:
>
>
https://developer.gnome.org/gtk3/stable/gtk3-Drag-and-Drop.html#gtk-drag-set-icon-surface
>
> The GtkTreeView uses the default handler of the GtkWidget::drag-begin
> signal to set the drag icon; you want your own handler to be called
> after that, so you can override the drag icon with your own.

Icons are Cairo surfaces; this means you need to create a Cairo surface and
render on it using the Cairo API.


> e.g. TreeView create it's own one, too. It is based on the row content.
> I can I do the same? e.g. I only want the content of the second
> column/cell and not the complete row?
>

You can get the contents of the model and render them as you wish, using
the gtk_render_* API.

Ciao,
 Emmanuele.

 On 2018-09-02 02:33 Emmanuele Bassi

> <[hidden email]> wrote:
> > On Sat, 1 Sep 2018 at 22:20, c.buhtz--- via gtk-app-devel-list <
> > [hidden email]> wrote:
> >
> > > I want to use my own drag-icon in a Gtk.TreeView where this is set
> > > as an instance of GdkPixbuf.Pixbuf.
> > >
> > > I can I create/draw a pixbuf and create Text, background and border
> > > color in it?
> > >
> >
> > Typically, GtkTreeView will call gtk_tree_view_create_row_drag_icon()
> > for the default drag surface — a box with the contents of the row.
> >
> >
> https://developer.gnome.org/gtk3/stable/GtkTreeView.html#gtk-tree-view-create-row-drag-icon
> >
> > If you want to override that, you should call
> > gtk_drag_set_icon_surface(), using a Cairo surface you created:
> >
> >
> https://developer.gnome.org/gtk3/stable/gtk3-Drag-and-Drop.html#gtk-drag-set-icon-surface
> >
> > The GtkTreeView uses the default handler of the GtkWidget::drag-begin
> > signal to set the drag icon; you want your own handler to be called
> > after that, so you can override the drag icon with your own. To do
> > that, you can:
> >
> >  - call gtk_tree_view_unset_model_drag_source() or
> > gtk_tree_view_unset_model_drag_dest() and implement your own drag and
> > drop handling
> >  - call g_signal_stop_emission_by_name() in your drag-begin callback
> > to stop the signal emission chain, and prevent the default handler
> > from running
> >  - use g_signal_connect_after() to connect your callback, and have
> > your handler run after the default one
> >  - subclass GtkTreeView and override the drag_begin() virtual function
> > without chaining up, to implement your own handler
> >
> > Ciao,
> >  Emmanuele.
> >
>
> _______________________________________________
> gtk-app-devel-list mailing list
> [hidden email]
> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list



--
https://www.bassi.io
[@] ebassi [@gmail.com]
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
On 2018-09-04 00:26 Emmanuele Bassi <[hidden email]> wrote:
> this means you need to create a Cairo
> surface and render on it using the Cairo API.

It is unclear to me how to create a cairo.Surface instance.

<https://pycairo.readthedocs.io/en/latest/reference/surfaces.html#cairo.Surface>
Also help(cairo.Surface) doesn't help here.
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
On 2018-09-09 23:01 "c.buhtz--- via gtk-app-devel-list"
<[hidden email]> wrote:
> It is unclear to me how to create a cairo.Surface instance.
> <https://pycairo.readthedocs.io/en/latest/reference/surfaces.html#cairo.Surface>

And I can not see any text/string drawing methods in the surface class.
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Chris Moller-3
Here's a sample I came across some time ago.. Basically, you need to do
all the drawing using cairo primitives.


/*
     Test drawing on a toggle button.

     gcc -Wall cairobutton.c -o cairobutton `pkg-config --cflags --libs
gtk+-3.0`

     C. Eric Cashon
*/

#include <gtk/gtk.h>

gboolean
draw_button1 (GtkWidget *widget, cairo_t *cr, gpointer user_data)
{
   guint width = gtk_widget_get_allocated_width(GTK_WIDGET(widget));
   guint height = gtk_widget_get_allocated_height(GTK_WIDGET(widget));

   if (gtk_toggle_button_get_active(GTK_TOGGLE_BUTTON(widget))) {
     cairo_set_source_rgb (cr, 1.0, 0.0, 0.0);
     cairo_paint (cr);
   }
   else {
     cairo_set_source_rgb (cr, 0.1, 0.1, 0.1);
     cairo_paint (cr);
   }

   //Draw rectangle around the button.
   cairo_set_line_width (cr, 10.0);
   cairo_set_source_rgb (cr, 0.0, 0.0, 0.0);
   cairo_rectangle (cr, 0, 0, width, height);
   cairo_stroke (cr);

   //Add the text.
   cairo_set_source_rgb (cr, 1.0, 1.0, 0.0);
   cairo_text_extents_t extents;
   cairo_select_font_face (cr, "Courier", CAIRO_FONT_SLANT_NORMAL,
               CAIRO_FONT_WEIGHT_BOLD);
   cairo_set_font_size (cr, 20);
   cairo_text_extents (cr, "Cairo Toggle!", &extents);
   cairo_move_to (cr, width/2 - extents.width/2, height/2 +
extents.height/2);
   cairo_show_text (cr, "Cairo Toggle!");

   return TRUE;
}

int
main (int argc, char **argv)
{
   gtk_init (&argc, &argv);

   GtkWidget *window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
   gtk_window_set_position (GTK_WINDOW(window), GTK_WIN_POS_CENTER);
   gtk_window_set_default_size (GTK_WINDOW (window), 200, 100);
   gtk_window_set_title (GTK_WINDOW (window), "Toggle Button");
   g_signal_connect (window, "destroy", G_CALLBACK (gtk_main_quit), NULL);

   GtkWidget *button1 = gtk_toggle_button_new ();
   gtk_widget_set_app_paintable (button1, TRUE);
   gtk_widget_set_hexpand (button1, TRUE);
   gtk_widget_set_vexpand (button1, TRUE);
   g_signal_connect (button1, "draw", G_CALLBACK (draw_button1), NULL);

   GtkWidget *grid = gtk_grid_new ();
   gtk_container_set_border_width (GTK_CONTAINER (grid), 10);
   gtk_grid_attach (GTK_GRID (grid), button1, 0, 0, 1, 1);

   gtk_container_add (GTK_CONTAINER (window), grid);

   gtk_widget_show_all (window);
   gtk_main ();
   return 0;
}


On 09/09/18 17:14, c.buhtz--- via gtk-app-devel-list wrote:

> On 2018-09-09 23:01 "c.buhtz--- via gtk-app-devel-list"
> <[hidden email]> wrote:
>> It is unclear to me how to create a cairo.Surface instance.
>> <https://pycairo.readthedocs.io/en/latest/reference/surfaces.html#cairo.Surface>
> And I can not see any text/string drawing methods in the surface class.
> _______________________________________________
> gtk-app-devel-list mailing list
> [hidden email]
> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
>
>

_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
In reply to this post by Gtk+ - Apps Dev mailing list
 
Give this a try. It creates a surface, draws on it and then returns the surface so that it can be put in an image widget.


import gi
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk, Gdk
import cairo

class MainWindow(Gtk.Window):
    def __init__(self):
        Gtk.Window.__init__(self)
        self.set_title("Surface")
        self.set_default_size(400, 400)
        self.set_position(Gtk.WindowPosition.CENTER)

        surface = self.get_surface()

        image = Gtk.Image()
        image.set_from_surface(surface)
        image.set_vexpand(True)
        image.set_hexpand(True)

        grid = Gtk.Grid()
        grid.attach(image, 0, 0, 1, 1)
        self.add(grid)

    def get_surface(self):
        surface = cairo.ImageSurface(cairo.FORMAT_ARGB32, 200, 200)
        cr = cairo.Context(surface)
       
        cr.set_source_rgb(0.8, 0.8, 0.8)
        cr.paint()

        cr.set_source_rgb(0.0, 1.0, 0.0)
        cr.set_line_width(6)
        cr.rectangle(0, 0, 200.0, 200.0)
        cr.stroke()
        cr.set_source_rgb(0.0, 0.0, 1.0)
        cr.set_line_width(3)
        cr.move_to(0.0, 100.0)
        cr.line_to(200.0, 100.0)
        cr.stroke()
        cr.move_to(100.0, 0.0)
        cr.line_to(100.0, 200.0)
        cr.stroke()

        cr.set_source_rgb(1.0, 0.0, 1.0)
        cr.select_font_face("Arial", cairo.FONT_SLANT_NORMAL, cairo.FONT_WEIGHT_BOLD)
        cr.set_font_size(40)
        (x, y, width, height, dx, dy) = cr.text_extents("Cairo")
        cr.move_to(200/2 - width/2, 200/2 + height/2)    
        cr.show_text("Cairo")

        cr.set_source_rgb(0.0, 0.0, 0.0)
        cr.set_line_width(1)
        cr.rectangle(200/2-width/2, 200/2 - height/2, width, height)
        cr.stroke()

        return surface

win = MainWindow()
win.connect("delete-event", Gtk.main_quit)
win.show_all()
Gtk.main()
  
 
 
-----Original Message-----
From: c.buhtz--- via gtk-app-devel-list <[hidden email]>
To: c.buhtz--- via gtk-app-devel-list <[hidden email]>
Cc: c.buhtz <[hidden email]>
Sent: Sun, Sep 9, 2018 2:14 pm
Subject: Re: "draw" icon with string

On 2018-09-09 23:01 "c.buhtz--- via gtk-app-devel-list"
<[hidden email]> wrote:
> It is unclear to me how to create a cairo.Surface instance.
> <https://pycairo.readthedocs.io/en/latest/reference/surfaces.html#cairo.Surface>

And I can not see any text/string drawing methods in the surface class.
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
In reply to this post by Chris Moller-3
Thanks Chris for your example code.

But I am not able to map your C code to Pycairo.
Even the doc of Pycairo is not helpfull. No examples, no class trees.
I still don't know how to draw text to a cairo surface. It is also
unclear to me which surface I should use.


On 2018-09-09 18:22 Chris Moller <[hidden email]> wrote:

> Here's a sample I came across some time ago.. Basically, you need to
> do all the drawing using cairo primitives.
>
>
> /*
>      Test drawing on a toggle button.
>
>      gcc -Wall cairobutton.c -o cairobutton `pkg-config --cflags
> --libs gtk+-3.0`
>
>      C. Eric Cashon
> */
>
> #include <gtk/gtk.h>
>
> gboolean
> draw_button1 (GtkWidget *widget, cairo_t *cr, gpointer user_data)
> {
>    guint width = gtk_widget_get_allocated_width(GTK_WIDGET(widget));
>    guint height = gtk_widget_get_allocated_height(GTK_WIDGET(widget));
>
>    if (gtk_toggle_button_get_active(GTK_TOGGLE_BUTTON(widget))) {
>      cairo_set_source_rgb (cr, 1.0, 0.0, 0.0);
>      cairo_paint (cr);
>    }
>    else {
>      cairo_set_source_rgb (cr, 0.1, 0.1, 0.1);
>      cairo_paint (cr);
>    }
>
>    //Draw rectangle around the button.
>    cairo_set_line_width (cr, 10.0);
>    cairo_set_source_rgb (cr, 0.0, 0.0, 0.0);
>    cairo_rectangle (cr, 0, 0, width, height);
>    cairo_stroke (cr);
>
>    //Add the text.
>    cairo_set_source_rgb (cr, 1.0, 1.0, 0.0);
>    cairo_text_extents_t extents;
>    cairo_select_font_face (cr, "Courier", CAIRO_FONT_SLANT_NORMAL,
>                CAIRO_FONT_WEIGHT_BOLD);
>    cairo_set_font_size (cr, 20);
>    cairo_text_extents (cr, "Cairo Toggle!", &extents);
>    cairo_move_to (cr, width/2 - extents.width/2, height/2 +
> extents.height/2);
>    cairo_show_text (cr, "Cairo Toggle!");
>
>    return TRUE;
> }
>
> int
> main (int argc, char **argv)
> {
>    gtk_init (&argc, &argv);
>
>    GtkWidget *window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
>    gtk_window_set_position (GTK_WINDOW(window), GTK_WIN_POS_CENTER);
>    gtk_window_set_default_size (GTK_WINDOW (window), 200, 100);
>    gtk_window_set_title (GTK_WINDOW (window), "Toggle Button");
>    g_signal_connect (window, "destroy", G_CALLBACK (gtk_main_quit),
> NULL);
>
>    GtkWidget *button1 = gtk_toggle_button_new ();
>    gtk_widget_set_app_paintable (button1, TRUE);
>    gtk_widget_set_hexpand (button1, TRUE);
>    gtk_widget_set_vexpand (button1, TRUE);
>    g_signal_connect (button1, "draw", G_CALLBACK (draw_button1),
> NULL);
>
>    GtkWidget *grid = gtk_grid_new ();
>    gtk_container_set_border_width (GTK_CONTAINER (grid), 10);
>    gtk_grid_attach (GTK_GRID (grid), button1, 0, 0, 1, 1);
>
>    gtk_container_add (GTK_CONTAINER (window), grid);
>
>    gtk_widget_show_all (window);
>    gtk_main ();
>    return 0;
> }
>
>
> On 09/09/18 17:14, c.buhtz--- via gtk-app-devel-list wrote:
> > On 2018-09-09 23:01 "c.buhtz--- via gtk-app-devel-list"
> > <[hidden email]> wrote:  
> >> It is unclear to me how to create a cairo.Surface instance.
> >> <https://pycairo.readthedocs.io/en/latest/reference/surfaces.html#cairo.Surface>  
> > And I can not see any text/string drawing methods in the surface
> > class. _______________________________________________
> > gtk-app-devel-list mailing list
> > [hidden email]
> > https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
> >
> >  
>
> _______________________________________________
> gtk-app-devel-list mailing list
> [hidden email]
> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Chris Moller-3
Have you seen the recent post from Eric Cashon?   I think it's a similar
example but in Python.  Sorry, but I've never used Pycairo.


On 10/09/18 16:53, c.buhtz--- via gtk-app-devel-list wrote:

> Thanks Chris for your example code.
>
> But I am not able to map your C code to Pycairo.
> Even the doc of Pycairo is not helpfull. No examples, no class trees.
> I still don't know how to draw text to a cairo surface. It is also
> unclear to me which surface I should use.
>
>
> On 2018-09-09 18:22 Chris Moller <[hidden email]> wrote:
>> Here's a sample I came across some time ago.. Basically, you need to
>> do all the drawing using cairo primitives.
>>
>>
>> /*
>>       Test drawing on a toggle button.
>>
>>       gcc -Wall cairobutton.c -o cairobutton `pkg-config --cflags
>> --libs gtk+-3.0`
>>
>>       C. Eric Cashon
>> */
>>
>> #include <gtk/gtk.h>
>>
>> gboolean
>> draw_button1 (GtkWidget *widget, cairo_t *cr, gpointer user_data)
>> {
>>     guint width = gtk_widget_get_allocated_width(GTK_WIDGET(widget));
>>     guint height = gtk_widget_get_allocated_height(GTK_WIDGET(widget));
>>
>>     if (gtk_toggle_button_get_active(GTK_TOGGLE_BUTTON(widget))) {
>>       cairo_set_source_rgb (cr, 1.0, 0.0, 0.0);
>>       cairo_paint (cr);
>>     }
>>     else {
>>       cairo_set_source_rgb (cr, 0.1, 0.1, 0.1);
>>       cairo_paint (cr);
>>     }
>>
>>     //Draw rectangle around the button.
>>     cairo_set_line_width (cr, 10.0);
>>     cairo_set_source_rgb (cr, 0.0, 0.0, 0.0);
>>     cairo_rectangle (cr, 0, 0, width, height);
>>     cairo_stroke (cr);
>>
>>     //Add the text.
>>     cairo_set_source_rgb (cr, 1.0, 1.0, 0.0);
>>     cairo_text_extents_t extents;
>>     cairo_select_font_face (cr, "Courier", CAIRO_FONT_SLANT_NORMAL,
>>                 CAIRO_FONT_WEIGHT_BOLD);
>>     cairo_set_font_size (cr, 20);
>>     cairo_text_extents (cr, "Cairo Toggle!", &extents);
>>     cairo_move_to (cr, width/2 - extents.width/2, height/2 +
>> extents.height/2);
>>     cairo_show_text (cr, "Cairo Toggle!");
>>
>>     return TRUE;
>> }
>>
>> int
>> main (int argc, char **argv)
>> {
>>     gtk_init (&argc, &argv);
>>
>>     GtkWidget *window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
>>     gtk_window_set_position (GTK_WINDOW(window), GTK_WIN_POS_CENTER);
>>     gtk_window_set_default_size (GTK_WINDOW (window), 200, 100);
>>     gtk_window_set_title (GTK_WINDOW (window), "Toggle Button");
>>     g_signal_connect (window, "destroy", G_CALLBACK (gtk_main_quit),
>> NULL);
>>
>>     GtkWidget *button1 = gtk_toggle_button_new ();
>>     gtk_widget_set_app_paintable (button1, TRUE);
>>     gtk_widget_set_hexpand (button1, TRUE);
>>     gtk_widget_set_vexpand (button1, TRUE);
>>     g_signal_connect (button1, "draw", G_CALLBACK (draw_button1),
>> NULL);
>>
>>     GtkWidget *grid = gtk_grid_new ();
>>     gtk_container_set_border_width (GTK_CONTAINER (grid), 10);
>>     gtk_grid_attach (GTK_GRID (grid), button1, 0, 0, 1, 1);
>>
>>     gtk_container_add (GTK_CONTAINER (window), grid);
>>
>>     gtk_widget_show_all (window);
>>     gtk_main ();
>>     return 0;
>> }
>>
>>
>> On 09/09/18 17:14, c.buhtz--- via gtk-app-devel-list wrote:
>>> On 2018-09-09 23:01 "c.buhtz--- via gtk-app-devel-list"
>>> <[hidden email]> wrote:
>>>> It is unclear to me how to create a cairo.Surface instance.
>>>> <https://pycairo.readthedocs.io/en/latest/reference/surfaces.html#cairo.Surface>
>>> And I can not see any text/string drawing methods in the surface
>>> class. _______________________________________________
>>> gtk-app-devel-list mailing list
>>> [hidden email]
>>> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
>>>
>>>  
>> _______________________________________________
>> gtk-app-devel-list mailing list
>> [hidden email]
>> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
> _______________________________________________
> gtk-app-devel-list mailing list
> [hidden email]
> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list

_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list
Reply | Threaded
Open this post in threaded view
|

Re: "draw" icon with string

Gtk+ - Apps Dev mailing list
In reply to this post by Gtk+ - Apps Dev mailing list
Dear cecashon,

thanks for your code. This works currently.
I need to improve it in the future to support different plattforms
(fonts) and screen resolutions (scale).

kind
Christian


On 2018-09-10 19:32
<[hidden email]> wrote:

>  
> Give this a try. It creates a surface, draws on it and then returns
> the surface so that it can be put in an image widget.
>
>
> import gi
> gi.require_version('Gtk', '3.0')
> from gi.repository import Gtk, Gdk
> import cairo
>
> class MainWindow(Gtk.Window):
>     def __init__(self):
>         Gtk.Window.__init__(self)
>         self.set_title("Surface")
>         self.set_default_size(400, 400)
>         self.set_position(Gtk.WindowPosition.CENTER)
>
>         surface = self.get_surface()
>
>         image = Gtk.Image()
>         image.set_from_surface(surface)
>         image.set_vexpand(True)
>         image.set_hexpand(True)
>
>         grid = Gtk.Grid()
>         grid.attach(image, 0, 0, 1, 1)
>         self.add(grid)
>
>     def get_surface(self):
>         surface = cairo.ImageSurface(cairo.FORMAT_ARGB32, 200, 200)
>         cr = cairo.Context(surface)
>        
>         cr.set_source_rgb(0.8, 0.8, 0.8)
>         cr.paint()
>
>         cr.set_source_rgb(0.0, 1.0, 0.0)
>         cr.set_line_width(6)
>         cr.rectangle(0, 0, 200.0, 200.0)
>         cr.stroke()
>         cr.set_source_rgb(0.0, 0.0, 1.0)
>         cr.set_line_width(3)
>         cr.move_to(0.0, 100.0)
>         cr.line_to(200.0, 100.0)
>         cr.stroke()
>         cr.move_to(100.0, 0.0)
>         cr.line_to(100.0, 200.0)
>         cr.stroke()
>
>         cr.set_source_rgb(1.0, 0.0, 1.0)
>         cr.select_font_face("Arial", cairo.FONT_SLANT_NORMAL,
> cairo.FONT_WEIGHT_BOLD) cr.set_font_size(40)
>         (x, y, width, height, dx, dy) = cr.text_extents("Cairo")
>         cr.move_to(200/2 - width/2, 200/2 + height/2)    
>         cr.show_text("Cairo")
>
>         cr.set_source_rgb(0.0, 0.0, 0.0)
>         cr.set_line_width(1)
>         cr.rectangle(200/2-width/2, 200/2 - height/2, width, height)
>         cr.stroke()
>
>         return surface
>
> win = MainWindow()
> win.connect("delete-event", Gtk.main_quit)
> win.show_all()
> Gtk.main()
>   
>  
>  
> -----Original Message-----
> From: c.buhtz--- via gtk-app-devel-list <[hidden email]>
> To: c.buhtz--- via gtk-app-devel-list <[hidden email]>
> Cc: c.buhtz <[hidden email]>
> Sent: Sun, Sep 9, 2018 2:14 pm
> Subject: Re: "draw" icon with string
>
> On 2018-09-09 23:01 "c.buhtz--- via gtk-app-devel-list"
> <[hidden email]> wrote:
> > It is unclear to me how to create a cairo.Surface instance.
> > <https://pycairo.readthedocs.io/en/latest/reference/surfaces.html#cairo.Surface>  
>
> And I can not see any text/string drawing methods in the surface
> class. _______________________________________________
> gtk-app-devel-list mailing list
> [hidden email]
> https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list

_______________________________________________
gtk-app-devel-list mailing list
[hidden email]
https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list