Kivy: How do you make a rounded TextInput in kivy?

Question

well guys I've researched but everything is so minimal about this. all I've found was This: Kivy: TextInput border radius. So guys can you tell how to make a rounded textinput in kivy like easier. I need a solution. I've tried radius: [58], nope. I've heard of ellipse in the link above in the code, although I'm not sure how to use it. What does it do - how do you use it - or is it not the solution.

This might help you. https://stackoverflow.com/questions/47639548/kivy-textinput-border-radius — Shaiful Islam, Sep 08 '21 at 06:38

Programmer-123 · Answer 1 · 2021-09-12T20:31:50.427

0

I'm not sure what you mean by rounded text input, but a way to make an input an ellipse-like is by using KivyMD. Inside of KivyMD there is something called MDTextFieldRound which gives you this. Here is a page on it: https://kivymd.readthedocs.io/en/0.104.1/components/text-field/

edited Sep 12 '21 at 20:31

answered Sep 11 '21 at 15:54

Programmer-123

5
3

3

Links may change or stop working. It's important to post full answer here and provide links only for reference. – ZygD Sep 11 '21 at 18:16
sorry about that – Polar Sep 23 '21 at 03:44

score 0 · Accepted Answer · edited Sep 12 '21 at 06:18

Solution: copy and paste this script and execute it (remember to change the name of the background picture in the source code "a12.jpeg"), the reason why the inputs seem bigger in the last 2 screenshots it is because for PC the resolution has to be higher but in the phone it will look at normal size.

from kivymd.app import MDApp as jbsidis
from kivy.lang import Builder as jbsidisx
class jbsidis_Josue_Carranza(jbsidis):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
    def build(self):
        return  jbsidisx.load_string(M)
M="""
#:import Window kivy.core.window.Window
Screen:
    bg_color: (1,1,1,.3)
    highlight_color1jbsidis: [0,0,0,0]
    highlight_color2jbsidis: (0,0,0,.3)
    canvas.before:
        Color:
            rgba: [1,1,1,1]
        Rectangle:
            size: self.size
            pos: self.pos
            source: "a12.jpeg"
    FloatLayout:
        MDIconButton:
            size_hint: .4, .05
            pos_hint: {"center_x": .1, "top": .975}
            text: "Back"
            icon: 'chevron-left'
            markup: True
        TextInput:
            id: email_jbsidis
            hint_text_color: [0,0,0, 1]
            foreground_color: [1,1,1,1]
            hint_text: "Email"
            background_color: [0,0,0,0]
            background_image: ""
            background_normal: ""
            background_active: ""
            multiline: False
            size_hint: .7 ,.1 #.06
            pos_hint: {'center_x':.5, 'center_y':.8} #'center_y':.8
            canvas.before:
                Color:
                    rgba: root.highlight_color2jbsidis if root.ids.email_jbsidis.focused else [1,1,1,.5]
                RoundedRectangle:
                    size: self.size
                    pos: self.pos
                    radius: 10,
        FloatLayout:
            MDIconButton:
                text: "[u]Reset password[/u]"
                icon: 'email-send-outline'
                markup: True
                color: Window.clearcolor
                opposite_colors: True
                pos_hint: {'center_x':.8, 'center_y':.8}    
        TextInput:
            id: password_jbsidis
            hint_text: "Password"
            foreground_color: [1,1,1,1]
            background_color: [0,0,0,0]
            background_image: ""
            background_normal: ""
            background_active: ""
            multiline: False
            password: True
            size_hint: .7 ,.1 #.06
            pos_hint: {'center_x':.5, 'center_y':.65}
            canvas.before:
                Color:
                    rgba: root.highlight_color2jbsidis if root.ids.password_jbsidis.focused else [1,1,1,.5]
                RoundedRectangle:
                    size: self.size
                    pos: self.pos
                    radius: 10,
        FloatLayout:
            MDIconButton:
                icon: 'lock-outline'
                markup: True
                color: Window.clearcolor
                opposite_colors: True
                pos_hint: {'center_x':.8, 'center_y':.65}
        MDIconButton:
            id: jbsidis_s
            text: "[u]Reset password[/u]"
            icon: 'lock-open-outline'
            markup: True
            color: Window.clearcolor
            pos: password_jbsidis.pos[0]+password_jbsidis.size[0], password_jbsidis.pos[1]+dp(4)
            pos_x: password_jbsidis.pos[0]
            opposite_colors: True
        MDRaisedButton:
            id: jbsidis_i
            text: "Sign In"
            pos_hint: {"center_x": .5, "top": .5}
        MDRaisedButton:
            id: button_jbsidis
            text: "Sign up"
            size_hint: .2 ,.05
            pos_hint: {"right": .85, "center_y": .1}
            opacity: 0
            disabled: True
            bg_color: (0,0,0,1)
            color: [0,0,0,1] 
"""
jbsidis_Josue_Carranza().run()

Pictures:

Thank you for providing additional guidance, that information will help me a lot. Thank you very much. — , Sep 12 '21 at 06:54

Kivy: How do you make a rounded TextInput in kivy?

2 Answers2