CODEWITHSUNDEEP
pythonkivy
Oaks-view
Oaks-view

Reputation: 413

How to correctly use kivy graphics context instruction

Hi I recently tried my hands on kivy graphics, context instructions(rotate, ranslate etc). So i tried to implement an animated spinning wheel(used for example to show loading screen). I used garden.iconfonts package for this purpose following closely the example implemented in the package. Heres my code

.kv

<Convert>:
   pos_hint: {'center_x':.5, 'center_y':.5}
   size_hint: .8,.4
   auto_dismiss: False
   on_open:
      self.load()
   loading:loading
   BoxLayout:
      pos: root.pos
      canvas.before:
         Color:
            rgba: 1,1,1,1
         Rectangle:
            pos: self.pos
            size: self.size
            source: 'icons/olivine.png'
      orientation: 'vertical'
      Label:            #STATUS 20 PERCENT
         text: 'Converting file...'
         id: status
         size_hint: 1,.2
         markup: True
      RelativeLayout:    #picture or rolling 60 %
         size_hint: 1,.6
         Label:      #SPINNER
            text: '{}'.format(icon('icon-spin6', 32))
            size_hint: 1,1
            markup: True
            p: 0
            id: loading
            canvas:
               PushMatrix
               Rotate:
                  angle: -self.p
                  origin: self.center
                  axis: 0,0,1
               PopMatrix

.py

from kivy.uix.modalview import ModalView
from kivy.properties import ObjectProperty
from kivy.animation import Animation


class Convert(ModalView):
   loading= ObjectProperty()
   def load(self):
      anim = Animation(p = 360, duration= 1) + Animation(p=0 , duration=0)
      anim.repeat = True
      anim.start(self.loading)

From my code Convert is a popup that shows up when a button is clicked, then as it opens, shows the spinning wheel. But when i run the code it just shows the wheel(i.e the iconfont), but does not spin. The code only works when i change the canvas class under the Label, to canvas.before. I assume that my understanding of how to use these tools is still poor. So im hoping someone can help clearify what im doing wrong, and how to make this work using canvas

Upvotes: 1

Views: 642

Answers (1)

inclement
inclement

Reputation: 29450

canvas:
    PushMatrix
    Rotate:
       angle: -self.p
       origin: self.center
       axis: 0,0,1
    PopMatrix

Everything between Rotate and PopMatrix will be rotated - that's the point of PushMatrix and PopMatrix, they bound the region where any matrix transformations are applied.

In this case, you didn't put anything in beween them, so you don't see anything rotated.

You probably want to put PushMatrix and Rotate in the canvas.before, and PopMatrix in the canvas.after. Since the Label drawing occurs in canvas, this will then be in the rotated state.

Upvotes: 1

Related Questions