How do I create a circular shadow effect using cairo?
I am trying to improve the graphical appearance of my application by giving a picture a subtle drop shadow effect. I am using python and cairo drawing.
In the below example code, I can draw an outer circle and an inner circle with an image as shown.
What I want to do is replace this outer circle with a shadow effect.
I am guessing that I need to use a linear gradient or a radial gradient, but I cannot find a good example of what I want to achieve.
Has anyone told me in the right direction please?
from gi.repository import Gtk
from gi.repository import Gdk
from gi.repository import GdkPixbuf
import cairo
import math
class MyWindow (Gtk.Window):
def __init__(self):
Gtk.Window.__init__(self, title='MyWindow')
darea = Gtk.DrawingArea()
darea.connect('draw', self.on_draw)
self.add(darea)
self.width, self.height = self.get_size()
filename = "/usr/share/backgrounds/Thingvellir_by_pattersa.jpg"
if self.width > self.height:
self.width = self.height
else:
self.height = self.width
self.width = self.width
self.height = self.height
self.pixbuf = GdkPixbuf.Pixbuf.new_from_file(filename)
self.pixbuf = self.pixbuf.scale_simple(self.width, self.width, GdkPixbuf.InterpType.BILINEAR)
def on_draw(self, widget, cr):
w = self.width
h = self.height
# draw outer circle
cr.translate(w/2, h/2)
cr.set_line_width(10)
cr.set_source_rgb(0.7, 0.2, 0.0)
cr.arc(0, 0, w/2, 0, 2*math.pi)
cr.stroke_preserve()
cr.stroke()
# now reset the origin and set the picture to be the source
cr.translate(-w/2, -h/2)
Gdk.cairo_set_source_pixbuf(cr, self.pixbuf, 0, 0)
# now reset the origin again and this time clip the pixbuf
cr.translate(w/2, h/2)
cr.arc(0, 0, w/2.2, 0, 2*math.pi) # was 2.2
cr.stroke_preserve()
cr.clip()
cr.paint()
win = MyWindow()
win.connect('delete-event', Gtk.main_quit)
win.show_all()
Gtk.main()
Using Ubuntu 14.04 - Gtk + 3.10, python3
+3
source to share
No one has answered this question yet
Check out similar questions: