kivyのタッチイベントでオブジェクトを回転させる



Rotating An Object Touch Event Kivy



解決:

キャンバスの角度をにバインドできますNumericProperty、コード内から変更します。あなたがする必要があるのはそれらの角度を正しく計算することです。それで少し遊んだ後、私は次のコードを作成しました:

from kivy.app import App from kivy.uix.widget import Widget from kivy.lang import Builder from kivy.animation import Animation from kivy.properties import NumericProperty import math kv = '' ':canvas:Rotate:angle:root.angle origin :self.center色:rgb:1、0、0楕円:サイズ:min(self.size)、min(self.size)位置:0.5 * self.size [0] -0.5 * min(self.size)、 0.5 * self.size [1] -0.5 * min(self.size)色:rgb:0、0、0楕円:サイズ:50、50 pos:0.5 * root.size [0] -25、0.9 * root。 size [1] -25 '' 'Builder.load_string(kv)class Dial(Widget):angle = NumericProperty(0)def on_touch_down(self、touch):y =(touch.y --self.center [1])x =(touch.x --self.center [0])calc = math.degrees(math.atan2(y、x))self.prev_angle = calc if calc> 0 else 360​​ + calc self.tmp = self.angle def on_touch_move (self、touch):y =(touch.y --self.center [1])x =(touch.x --self.center [0])calc = math.degrees(math.atan2(y、x))new_angle = calc if calc> 0 else 360​​ + calc self.angle = self.tmp +(new_angle-self.prev_angle)%360 def on_ touch_up(self、touch):Animation(angle = 0).start(self)class DialApp(App):def build(self):return Dial()if __name__ == '__ main __':DialApp()。run()

初期(マウスを押した後)と後の角度の差を計算していますon_touch_move。角度はプロパティなので、を使用して変更することもできますkivy.animationは、マウスボタンを離した後にダイヤルをスピンバックさせます。



編集

子サークルのon_touch_downイベント:



from kivy.app import App from kivy.uix.widget import Widget from kivy.uix.floatlayout import FloatLayout from kivy.lang import Builder from kivy.animation import Animation from kivy.properties import NumericProperty import math kv = '' ':circle_id: circle_idサイズ:root.size位置:0、0キャンバス:回転:角度:self.angle原点:self.center色:rgb:1、0、0楕円:サイズ:min(self.size)、min(self.size )pos:0.5 * self.size [0] -0.5 * min(self.size)、0.5 * self.size [1] -0.5 * min(self.size)Circle:id:circle_id size_hint:0、0 size: 50、50 pos:0.5 * root.size [0] -25、0.9 * root.size [1] -25キャンバス:色:rgb:0、1、0楕円:サイズ:50、50 pos:self.pos ' '' Builder.load_string(kv)クラスCircle(Widget):def on_touch_down(self、touch):if self.collide_point(* touch.pos):print '小さな円がクリックされました' class Dial(Widget):angle = NumericProperty(0 )def on_touch_down(self、touch):そうでない場合self.circle_id.collide_point(* touch.pos):print '大きな円がクリックされました' y =(touch.y --self.center [1])x =(touch.x-自己.center [0])calc = math.degrees(math.atan2(y、x))self.prev_angle = calc if calc> 0 else 360​​ + calc self.tmp = self.angle return super(Dial、self).on_touch_down (touch)#タッチイベントをさらにディスパッチしますdef on_touch_move(self、touch):y =(touch.y --self.center [1])x =(touch.x --self.center [0])calc = math.degrees( math.atan2(y、x))new_angle = calc if calc> 0 else 360​​ + calc self.angle = self.tmp +(new_angle-self.prev_angle)%360 def on_touch_up(self、touch):Animation(angle = 0 ).start(self)class DialApp(App):def build(self):return Dial()if __name__ == '__ main __':DialApp()。run() 

回転スライダーである庭からGearTickを使用することができます。それはあなたが必要としているものではありませんが、あなたのニーズに合わせることができます。 「デフォルトでは、反時計回りに回転できます。おそらく時計回りに回転する必要があります」(更新:ウィジェットに'時計回り'または '反時計回り'に設定できるorientationプロパティ)。

スプリングバックを管理し、「フィンガーストップ」で停止する必要があります。

最後の例では、アニメーションを使用してスプリングバックを管理していますが、フィンガーストップ機能を管理/実装する必要があります。



https://github.com/kivy-garden/garden.geartick

使用法::

Python ::

kivy.garden.geartickからimportGearTick parent.add_widget(GearTick(range =(0、100)))

kv ::

BoxLayout:orientation: 'vertical' GearTick:id:gear_tick zoom_factor:1.1#デフォルト以外の値を使用するには、以下のコメントを解除します#max:100 #background_image: 'background.png' #overlay_image: 'gear.png' #orientation: 'anti-時計回り 'on_release:Animation.stop_all(self)Animation(value = 0).start(self)ラベル:size_hint:1、なし高さ:' 22dp '色:0、1、0、1テキスト:('値:{} ').format(gear_tick.value)

ここに画像の説明を入力してください

インストールするには::

pip install kivy-gardengardenインストールgeartick

コピーして貼り付けることができる作業例::

from kivy.lang import Builder from kivy.app import runTouchApp from kivy.garden.geartick import GearTick runTouchApp(Builder.load_string( '' '#:import Animation kivy.animation.Animation GridLayout:cols:2 canvas.before:Color:rgba :1、1、1、1長方形:サイズ:self.size pos:self.pos BoxLayout:orientation: 'vertical' GearTick:id:gear_tick zoom_factor:1.1#デフォルト以外の値を使用するには、以下のコメントを解除します#max:100 #background_image : 'background.png' #overlay_image: 'gear.png' #orientation: '反時計回り' on_release:Animation.stop_all(self)Animation(value = 0).start(self)ラベル:size_hint:1、なし高さ: '22dp'色:0、1、0、1テキスト:( '値:{}')。format(gear_tick.value) '' '))