# Problem drawing rectangle

**URL:** <https://www.ruby-forum.com/t/problem-drawing-rectangle/215862>\
**Category:** Ruby-Gnome 2\
**Created:** [January 17, 2012, 9:38pm UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862 "2012-01-17T21:38:58Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![dubstep](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/d/cdc98d/32.png) [@dubstep](https://www.ruby-forum.com/u/dubstep)\
**Post date:** [January 17, 2012, 9:38pm UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/1 "2012-01-17T21:38:58Z")

</div>

Hi,  
I’m having difficulties drawing a rectangle in a drawingarea (in a  
table). New to ruby-gnome, i’m trying some stuff out. This is what i  
tried (rectangle should be in the big blue area):  
require ‘gtk2’

window = Gtk::Window.new  
window.border\_width = 10  
window.set\_default\_size(1200,800)  
window.set\_window\_position(1)  
window.title = “xxxx”  
window.signal\_connect(‘delete\_event’) { false }  
window.signal\_connect(‘destroy’) { Gtk.main\_quit }

table = Gtk::Table.new(15, 15, true)  
window.add(table)  
label = Gtk::Label.new(“Hello world”)  
color = Gdk::Color.parse("#003366")  
color2 = Gdk::Color.parse("#8295A8")  
label.modify\_fg(Gtk::STATE\_NORMAL, color)  
eb = Gtk::EventBox.new()  
eb.add(label)  
eb.modify\_bg(Gtk::STATE\_NORMAL, color2)  
button = Gtk::Button.new(‘click!’)  
table.attach\_defaults(button, 10, 11, 1, 2)  
table.attach\_defaults(eb, 0, 8, 0, 1)  
button.signal\_connect(‘clicked’) do  
label.text = “changed”  
end  
eb2 = Gtk::EventBox.new()  
eb2.modify\_bg(Gtk::STATE\_NORMAL, color2)  
table.attach\_defaults(eb2, 0, 12, 2, 15)  
button1 = Gtk::Button.new(“Pixel by pixel …”)  
button2 = Gtk::Button.new(“you choose my fate”)  
slabel1 = Gtk::Label.new(“test”)  
fixed = Gtk::Fixed.new  
#fixed.put(button1, 0, 0)  
#fixed.put(button2, 20, 30)  
fixed.put(slabel1, 100, 150)  
eb2.add(fixed)  
area = Gtk::DrawingArea.new  
area.set\_size\_request(50,50)  
area.signal\_connect(“expose\_event”) do  
alloc = area.allocation  
area.window.draw\_rectangle(area.style.fg\_gc(area.state), true,  
100, 0, 100, 100)  
end  
table.attach\_defaults(area, 0, 12, 2, 15)  
window.show\_all  
Gtk.main

---

<div class="post-metadata">

**Author:** ![leopoldiii](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/8e8cbc/32.png) [@leopoldiii](https://www.ruby-forum.com/u/leopoldiii)\
**Post date:** [January 18, 2012, 12:20pm UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/2 "2012-01-18T12:20:01Z")

</div>

hi Kelly,

your rectangle is there, it’s just under the giant ‘test’ label…  
try this:

require ‘gtk2’

window = Gtk::Window.new  
window.set\_default\_size(500,300)  
window.signal\_connect(‘destroy’) { Gtk.main\_quit }

eb = Gtk::EventBox.new()  
label = Gtk::Label.new(“Hello world”)  
color = Gdk::Color.parse("#003366")  
color2 = Gdk::Color.parse("#8295A8")  
label.modify\_fg(Gtk::STATE\_NORMAL, color)  
eb.add(label)  
eb.modify\_bg(Gtk::STATE\_NORMAL, color2)

button = Gtk::Button.new(‘click!’)  
button.signal\_connect(‘clicked’) do  
label.text = “changed”  
end

eb2 = Gtk::EventBox.new()  
eb2.set\_size\_request(100, 100)  
eb2.modify\_bg(Gtk::STATE\_NORMAL, color2)  
slabel1 = Gtk::Label.new(“test”)  
slabel1.set\_size\_request(100, 100)  
eb2.add(slabel1)

area = Gtk::DrawingArea.new  
area.signal\_connect(“expose\_event”) do  
alloc = area.allocation  
area.window.draw\_rectangle(area.style.fg\_gc(area.state), true,  
20, 0, 100, 100)  
end

table = Gtk::Table.new(3, 3, true)  
table.attach\_defaults(button, 0, 1, 0, 1)  
table.attach\_defaults(eb, 1, 2, 0, 1)  
table.attach\_defaults(eb2, 0, 1, 1, 2)  
table.attach\_defaults(area, 1, 2, 1, 2)

window.add(table)  
window.show\_all  
Gtk.main

…and then play around with the dimensions, adding more rows and  
columns, widgets, etc…

hth -

- j

---

<div class="post-metadata">

**Author:** ![leopoldiii](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/8e8cbc/32.png) [@leopoldiii](https://www.ruby-forum.com/u/leopoldiii)\
**Post date:** [January 18, 2012, 3:59pm UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/3 "2012-01-18T15:59:24Z")

</div>

hey Kelly,

> …(rectangle should be in the big blue area):

sorry, just noticed this bit! i don’t think you can add a drawing  
area on top of a label - i’m not at home now, but try putting the label  
and the drawing area rectangle in a fixed layout and then add that  
layout to the table (sort of like you were.) make sure to place the  
label in the layout first, and then the drawing area on top of it,  
otherwise you won’t see the rectangle (like what was happening with your  
original code.)

give it a shot, and get back with any questions - i’ll give it a try  
when i can too 😉

good luck

- j

---

<div class="post-metadata">

**Author:** ![leopoldiii](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/8e8cbc/32.png) [@leopoldiii](https://www.ruby-forum.com/u/leopoldiii)\
**Post date:** [January 18, 2012, 4:22pm UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/4 "2012-01-18T16:22:21Z")

</div>

Thanks for the quick help jake.  
My intention is to be able to show both drawings and labels in this  
eventbox(eb2), and even to be able to show the colored rectangle behind  
the  
label. I’m wondering if these things are even possible tho. The lack of  
detailed tutorials and manuals isn’t helping either…

---

<div class="post-metadata">

**Author:** ![leopoldiii](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/8e8cbc/32.png) [@leopoldiii](https://www.ruby-forum.com/u/leopoldiii)\
**Post date:** [January 19, 2012, 5:39pm UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/5 "2012-01-19T17:39:33Z")

</div>

That is what i am trying to do indeed. I’m getting an error tho, when i  
click the eventbox:  
rectangle.rb:32:in `show_text': the target surface has been finished from rectangle.rb:32:in`redraw\_my\_label’  
from rectangle.rb:14  
from rectangle.rb:38:in `call' from rectangle.rb:38:in`main’  
from rectangle.rb:38

---

<div class="post-metadata">

**Author:** ![leopoldiii](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/8e8cbc/32.png) [@leopoldiii](https://www.ruby-forum.com/u/leopoldiii)\
**Post date:** [January 19, 2012, 4:13am UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/6 "2012-01-19T04:13:42Z")

</div>

hi Kelly,

> My intention is to be able to show both drawings and labels in this  
> eventbox(eb2), and even to be able to show the colored rectangle behind  
> the label.

hmm… i tried putting a label on top of a rectangle drawn in a  
drawing area, and couldn’t get it to work - there’s probably a way  
(anyone?)

i usually draw directly onto an EventBox… DrawingArea’s give me  
problems 😛

the nice thing about drawing directly onto an EventBox, is that you  
can call #set\_visible\_window(false) on the EventBox, and have a  
transparent background. you can also catch all kinds of signals with no  
problem.

if what you want is to show some text on top of a rectangle that  
you’ve drawn, and connect that rectangle to button clicks, you could do  
something like this:

`
require 'gtk2'
win = Gtk::Window.new
win.signal_connect(“destroy”){Gtk.main_quit}
win.set_size_request(600, 400)
layout = Gtk::Layout.new
@my_label = [“first i say this…”, “then i say the other…”]
@index = 0
@ebox = Gtk::EventBox.new
@ebox.set_size_request(250, 80) # this is important!
@ebox.signal_connect(“button-press-event”){redraw_my_label}
@ebox.signal_connect(“expose-event”){
@cc = @ebox.window.create_cairo_context
@cc.set_source_color(Gdk::Color.parse(“#003366”))
@cc.rectangle(0, 0, 250, 80) # notice the ebox is the same size…
@cc.fill
@cc.select_font_face(“Purisa”, Cairo::FONT_SLANT_NORMAL,
Cairo::FONT_WEIGHT_NORMAL)
@cc.set_font_size 13
@cc.set_source_rgb(250, 250, 250)
@cc.move_to(35, 30)
@cc.show_text(@my_label[@index])
}
layout.put(@ebox, 0, 0)
def redraw_my_label
@index += 1; @index = 0 if @index > 1
@cc.show_text(@my_label[@index])
@ebox.queue_draw # .queue_draw sends the ‘expose-event’ signal
end
`

`win.add(layout)
win.show_all
Gtk.main
`

…you could now stick this layout into a table with whatever other  
widgets you want. is this something like what you’re looking for? hope  
so!

> The lack of detailed tutorials and manuals isn’t helping either..

gtk2 is actually (and unfortunately) one of the best documented gui  
toolkits i’ve found - go figure 😉 that said, it’s still kind of a  
pain in the arse at times - don’t get discouraged. just fool around a  
bunch and you’ll get the hang of it. i’ve found that when i’m wondering  
what a particular widget can do a quick

#.methods.sort.each{|method| p method}

…gives me a good idea of what a widget can do, or at least a place  
to start googling!

- j

---

<div class="post-metadata">

**Author:** ![leopoldiii](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/8e8cbc/32.png) [@leopoldiii](https://www.ruby-forum.com/u/leopoldiii)\
**Post date:** [January 19, 2012, 8:29pm UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/7 "2012-01-19T20:29:38Z")

</div>

Kelly P. wrote in post #1041658:

> I’m getting an error tho, when i  
> click the eventbox:  
> rectangle.rb:32:in `show_text': the target surface has been finished from rectangle.rb:32:in `redraw\_my\_label’  
> from rectangle.rb:14  
> from rectangle.rb:38:in `call' from rectangle.rb:38:in `main’  
> from rectangle.rb:38

hmm… what version of ruby and of gtk are you using? what platform  
are you on? i’m using ruby 1.9.3 with gtk2 1.0.3 (still need to update)  
under ubuntu 10.04 lts - and it works for me…

anyone else have any ideas what’s going on?

- j

---

<div class="post-metadata">

**Author:** ![leopoldiii](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/8e8cbc/32.png) [@leopoldiii](https://www.ruby-forum.com/u/leopoldiii)\
**Post date:** [January 20, 2012, 9:05am UTC](https://www.ruby-forum.com/t/problem-drawing-rectangle/215862/8 "2012-01-20T09:05:27Z")

</div>

jake kaiden wrote in post #1041683:

> hmm… what version of ruby and of gtk are you using? what platform  
> are you on? i’m using ruby 1.9.3 with gtk2 1.0.3 (still need to update)  
> under ubuntu 10.04 lts - and it works for me…
> 
> anyone else have any ideas what’s going on?

I tried your example with 1.9.3/1.1.0 and 1.8.7/1.0.3 and it works on  
both. So I have no ideas.

The error seems to come from cairo  
[http://cairographics.org/manual/cairo-Error-handling.html](http://cairographics.org/manual/cairo-Error-handling.html) .

Simon