Rounded textinput

165 views
Skip to first unread message

Degenerate Tech

unread,
Apr 20, 2024, 4:06:16 AM4/20/24
to Kivy users support
Could you please tell me where i am wrong ?
from kivy.lang import Builder
from kivymd.uix.screen import MDScreen
from kivymd.uix.screenmanager import MDScreenManager
from kivymd.app import MDApp
from kivy.clock import Clock,mainthread
KV = '''
MDScreen:
    TextInput:
        canvas.before:
            Color:
                rgba:[0,0,1,1]
            RoundedRectangle:
                pos:self.pos
                size:self.size
                radius:[25,]
        pos_hint:{'center_x':0.5,'center_y':0.5}
        size_hint:None,None
        size:'200dp','48dp'
        border:[1,1,1,1]        
        #background_normal: ''
        background_color: [1,1,1,1]
        hint_text:'Hello'
        background_image: ""
        background_normal: ""
        background_active: ""
        foreground_color:[0,0,0,1]
   
       
               

   
       
'''



class Example(MDApp):
    def build(self):
        self.theme_cls.primary_palette = "Olive"
       
        return Builder.load_string(KV)



Example().run()

ElliotG

unread,
Apr 20, 2024, 12:40:12 PM4/20/24
to Kivy users support
Set the background color transparent. 

from kivy.lang import Builder
from kivymd.uix.screen import MDScreen
from kivymd.uix.screenmanager import MDScreenManager
from kivymd.app import MDApp
from kivy.clock import Clock,mainthread
KV = '''
MDScreen:
    TextInput:
        canvas.before:
            Color:
                rgba:[0,0,1,1]
            RoundedRectangle:
                pos:self.pos
                size:self.size
                radius:[25,]
        pos_hint:{'center_x':0.5,'center_y':0.5}
        size_hint:None,None
        size:'200dp','48dp'
        border:[1,1,1,1]        
        #background_normal: ''
        background_color: [1,1,1,0]  # Make the background color transparent

        hint_text:'Hello'
        background_image: ""
        background_normal: ""
        background_active: ""
        foreground_color:[0,0,0,1]     
'''


class Example(MDApp):
    def build(self):
        self.theme_cls.primary_palette = "Olive"
        return Builder.load_string(KV)

Example().run()

elli...@cox.net

unread,
Apr 20, 2024, 12:42:48 PM4/20/24
to kivy-...@googlegroups.com
Make the background color transparent.

from kivy.lang import Builder
from kivymd.uix.screen import MDScreen
from kivymd.uix.screenmanager import MDScreenManager
from kivymd.app import MDApp
from kivy.clock import Clock,mainthread
KV =
'''

MDScreen:
   TextInput:
       canvas.before:
           Color:
               rgba:[0,0,1,1]
           RoundedRectangle:
               pos:self.pos
               size:self.size
               radius:[25,]
       pos_hint:{'center_x':0.5,'center_y':0.5}
       size_hint:None,None
       size:'200dp','48dp'
       border:[1,1,1,1]        
       #background_normal: ''
       background_color: [1,1,0,0]  # Make the background color transparent

       hint_text:'Hello'
       background_image: ""
       background_normal: ""
       background_active: ""
       foreground_color:[0,0,0,1]
 
     
             

 
     
'''



class Example(MDApp):
   
def build(self):
       
self.theme_cls.primary_palette = "Olive"
     
       
return Builder.load_string(KV)



Example().run()


From: kivy-...@googlegroups.com <kivy-...@googlegroups.com> on behalf of Degenerate Tech <sksah...@gmail.com>
Sent: Saturday, April 20, 2024 1:06 AM
To: Kivy users support <kivy-...@googlegroups.com>
Subject: [kivy-users] Rounded textinput
 
--
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.
To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/e920419a-d0d8-4c72-ac09-dcb5788118acn%40googlegroups.com.

ElliotG

unread,
Apr 20, 2024, 9:11:45 PM4/20/24
to Kivy users support
Ignore my previous answers they were junk.  When I really ran the code - the result was not was expected.  Here is the real solution below.  I went into the file: .venv/Lib/site-packages/kivy/data/style.kv and copied in the kv code the TextInput.  You can see it the code below I added a "-" in <-TextInput>  this means the kv code is being redefined.  I then removed the BorderImage code commented out below, and added in the RoundedRectangle.   

You can add visual elements to indicate focus, or is the widget is disabled.  Notice how the source line in BorderImage is selecting an image based on focus or disabled.  You could use these same attributes to change color or you could add an outline that changes color.

Let me know if this is what you were looking for.

from kivy.lang import Builder
from kivymd.app import MDApp

KV = '''
<-TextInput>:
    canvas.before:
        Color:
            rgba: self.background_color
        # BorderImage:
        #     border: self.border
        #     pos: self.pos
        #     size: self.size
        #     source: self.background_active if self.focus else (self.background_disabled_normal if self.disabled else self.background_normal)

        RoundedRectangle:
            pos: self.pos
            size: self.size
            radius:[25,]
        Color:
            rgba:
                (self.cursor_color
                if self.focus and not self._cursor_blink
                and int(self.x + self.padding[0]) <= self._cursor_visual_pos[0] <= int(self.x + self.width - self.padding[2])
                else (0, 0, 0, 0))
        Rectangle:
            pos: self._cursor_visual_pos
            size: root.cursor_width, -self._cursor_visual_height
        Color:
            rgba: self.disabled_foreground_color if self.disabled else (self.hint_text_color if not self.text else self.foreground_color)

MDScreen:
    TextInput:
        multiline: False
        size_hint: .7 ,.1 #.06
        padding: 20
        background_color: 'blue'
        foreground_color:'white'
        hint_text_color: 'lightblue'
        hint_text: 'Enter a greeting'
        pos_hint: {'center_x':.5, 'center_y':.8}
'''


class Example(MDApp):
    def build(self):
        self.theme_cls.primary_palette = "Olive"
        return Builder.load_string(KV)

Example().run()

Degenerate Tech

unread,
Apr 25, 2024, 1:06:33 AM4/25/24
to Kivy users support
Thank You . These codes clearing my  kivy concepts .

Degenerate Tech

unread,
Apr 25, 2024, 1:08:31 AM4/25/24
to Kivy users support
but <-TextInput>: 
why you use ' - ' sign ? , this thing is new to me . please tell me .

elli...@cox.net

unread,
Apr 25, 2024, 11:41:26 AM4/25/24
to kivy-...@googlegroups.com

"Sometimes we would like to inherit from a widget in order to use its Python properties without also using its .kv defined style. For example, we would like to inherit from a Label, but we would also like to define our own canvas instructions instead of automatically using the canvas instructions inherited from the Label. We can achieve this by prepending a dash (-) before the class name in the .kv style definition."

Sent: Wednesday, April 24, 2024 10:08 PM

To: Kivy users support <kivy-...@googlegroups.com>
Subject: Re: [kivy-users] Rounded textinput
 

Degenerate Tech

unread,
Apr 25, 2024, 12:52:08 PM4/25/24
to Kivy users support
oh . thank you.
Reply all
Reply to author
Forward
0 new messages