Как скрыть переполнение виджета в kivy ?? (как в CSS) - PullRequest
Новая
       8

Как скрыть переполнение виджета в kivy ?? (как в CSS)

0 голосов
/ 12 июля 2020

Скрытие переполнения виджета

Я пытаюсь создавать собственные кнопки в kivy. Когда вы нажимаете на эти кнопки, рябь добавляется как дочерний виджет с некоторой анимацией, и когда анимация заканчивается, эта рябь удаляется с родительского элемента.

Я хочу скрыть ту часть ряби, которая находится вне родительской кнопки. Есть способ сделать это в CSS, если вы знаете, используя свойство переполнения, мы можем сделать это в CSS, но как мне сделать это в Kivy ??

Есть способ сделать это что в киви ??

Вот мой код Киви: 

Builder.load_string("""
<MyBtn@Button>:
    text: "Button"
    size: self.parent.size
    pos: self.parent.pos
    font_size: 40
    background_color: 0,0,0,0
    
    color: self.parent.btnc if self.state=="normal" else (0,0,0,1)
                
    canvas.before:
        Color:
            rgba:
                self.parent.btnc if self.state=="normal" else (0,0,0,1)
        Line:
            width: 2.5
            rounded_rectangle: self.x, self.y, self.width, self.height, self.height*0.4
        Color:
            rgba:
                (0,0,0,1) if self.state=="normal" else self.parent.btnc
        RoundedRectangle:
            size: self.size
            pos: self.pos
            radius: [self.height*0.4]



<MainScreen>:
    canvas.before:
        Color:
            rgba: (0.05,0.05,0.05,1)
        Rectangle:
            size: self.size
            pos: self.pos
    
    CustomBtn:
        size: 250, 90
        pos: 0, 1000
        center_x: root.center_x
        btnc: (1,0,0,1)
        
        MyBtn:
    
    CustomBtn:
        size: 250, 90
        pos: 0, 800
        center_x: root.center_x
        btnc: (1,1,0,1)
        
        MyBtn:
            
    CustomBtn:
        size: 250, 90
        pos: 0, 600
        center_x: root.center_x
        btnc: (0,1,0,1)
        
        MyBtn:
            
    CustomBtn:
        size: 250, 90
        pos: 0, 400
        center_x: root.center_x
        btnc: (0,1,1,1)
        
        MyBtn:
""")

Вот мой Python Код: 

class CustomBtn(Widget):
    btnc = ListProperty([1,1,1,1]) # For Btn color
    alpha = NumericProperty(0.3)
    
    def on_touch_down(self, touch):
        super(CustomBtn,self).on_touch_down(touch)
        if self.collide_point(*touch.pos):
            ripple = Widget()
            ripple.size = 30,30
            ripple.center = touch.pos
            ripple.bind(size=self.update_canvas)
            
            with ripple.canvas.before:
                Color(self.btnc[0],self.btnc[1],self.btnc[2],self.alpha)
                Ellipse(size=ripple.size,
                                pos=ripple.pos)
            
            anim = Animation(size=(600,600),    
                            center=touch.pos, 
                            opacity=0, d=1)
            
            anim.bind(on_complete=self.remove)
            
            self.add_widget(ripple)
            anim.start(ripple)
            
    # Removes widget after the animation completes
    def remove(self, anim, widget):
        self.remove_widget(widget)
    
    # Updates Ripple's Canvas on size change of the ripple
    def update_canvas(self, ripple, val):
        ripple.canvas.before.clear()
        
        with ripple.canvas.before:
            Color(self.btnc[0],self.btnc[1],self.btnc[2],self.alpha)
            Ellipse(size=val,pos=ripple.pos)

        

class MainScreen(Widget):
    pass
    
runTouchApp(MainScreen())

1 Ответ

0 голосов
/ 12 июля 2020

Используйте инструкции трафарета или виджет StencilView .

...