Animating graphics opacity?

437 views
Skip to first unread message

Richard Jones

unread,
Feb 6, 2013, 11:54:07 PM2/6/13
to kivy-...@googlegroups.com
I know I can animate the position and size of graphics primitives like Rectangles, but I also need to animate the opacity. I think maybe the RenderContext might be what I need but I can't see how it works. I've tried this in a Widget:

     with self.canvas:
            self.c = RenderContext(opacity=1)
            with self.c:
                self.r = Rectangle(pos=(0, 0), size=(50, 50))

and then animating the opacity of self.c, but the rectangle never appears. I was really just guessing though :-)

Do I really need to use an Image widget for all my rectangles instead?


     Richard

Gabriel Pettier

unread,
Feb 7, 2013, 4:46:01 AM2/7/13
to kivy-...@googlegroups.com
Hi,

I'm not sure about your question, the widgets have an opacity property,
that you can manipulate, all graphics instructions and all children are
affected (https://gist.github.com/4729870). If it's only the color of
one instruction that you want to animate, and you don't want to give it
it's own widget, i guess you would need to put the color in a property,
put the creation of the instruction in a method bound to the color, so
it's redrawn when change happens.
> --
> You received this message because you are subscribed to the Google Groups "Kivy users support" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
> For more options, visit https://groups.google.com/groups/opt_out.
>
>

Richard Jones

unread,
Feb 7, 2013, 6:02:51 AM2/7/13
to kivy-...@googlegroups.com
OK, I'll try to be clearer :-)

I've discovered that the slowest thing to do in Kivy is to alter the
scene graph - to clear the canvas and issue all those instructions
that build up the scene and are compiled into the opengl instructions.
If I can retain the scene graph and only alter the properties of the
components in it then things run much faster. I'm doing this right now
with a canvas with Rectangles in it drawing textures; they form the
grid of icons in my match 3 game and as I animate them I just modify
the position of the Rectangles.

I want to add some additional effects, so my first thought was to do
the same thing again; add some additional Rectangles for the effects
(there's a limited number of them) and the modify their position /
opacity as needed. Unfortunately I can't modify the opacity; that is
defined by the preceding Color instruction in the scene graph.

It's just occurred to me that if I alter my scene graph construction to, say:

c1 = Color
r1 = Rectangle
c2 = Color
r2 = Rectangle
c3 = Color
r3 = Rectangle
c4 = Color
r4 = Rectangle

Then I can control the alpha (opacity) of each Rectangle. The problem
is that the Color instructions c2, c3 and c4 will be optimised out by
the scene graph compiler. I'm not sure what modifying the opacity will
then do. I will experiment tomorrow I suppose.

And if that doesn't work then I guess I'll just have to use full-blown
widgets for the effect images.


Richard

Richard Jones

unread,
Feb 7, 2013, 5:54:49 PM2/7/13
to kivy-...@googlegroups.com
On Thursday, February 7, 2013 10:02:51 PM UTC+11, Richard Jones wrote:
It's just occurred to me that if I alter my scene graph construction to, say:

   c1 = Color
   r1 = Rectangle
   c2 = Color
   r2 = Rectangle
   c3 = Color
   r3 = Rectangle
   c4 = Color
   r4 = Rectangle

Then I can control the alpha (opacity) of each Rectangle.

This, as it turns out, is the approach I am now using.


     Richard 

Mathieu Virbel

unread,
Feb 11, 2013, 8:19:13 AM2/11/13
to kivy-...@googlegroups.com
Hi,

Normally, the compiler is dumb, but a little smart.
You used 4 colors. On the first drawing, it will compile the tree
dynamically. If the color instruction doesn't have any impact on the
drawing context, it will be flagged as ignore, and the next drawing will
ignore it.

If you change a property or anything else in the Color, then we,
internally, ask for redoing a compilation of the canvas subset. Back to
the first step, the color will now have an impact on the context, and
will be always applied :)

Mathieu

Le 07/02/2013 12:02, Richard Jones a �crit :

Lim Ken Zho

unread,
Apr 14, 2020, 7:12:39 AM4/14/20
to Kivy users support
Hi, just wanted to see an example of how the code actually looks like and how it all works out? Having a similar issue to what you had originally, where I can animate the size and position of my rectangles just fine but I want to animate the opacity of different shapes within the same canvas/widget and I don't know how.

Ken Zho

Elliot Garbus

unread,
Apr 14, 2020, 10:59:17 AM4/14/20
to kivy-...@googlegroups.com
Opacity impacts all of the children on the canvas and in the widget tree. 
To change the opacity of individual of individual shape on the canvas, specify the color of each item using rgba, and animate the a (alpha channel) to change the opacity of each drawn item. 

Sent from my iPad

On Apr 14, 2020, at 4:12 AM, Lim Ken Zho <kenz...@gmail.com> wrote:


--
You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages