KIVY: Numeric Keyboard ON Text of the Text Field

Question

I am trying to add Numeric Keyboard in UI

Which will be display as clicked on the text on filed

But some how Numeric keyboard not show in the UI

I use numeric.json file to open the numeric keyboard as per the kivy Documentation json file and link is [https://github.com/kivy/kivy/blob/master/examples/keyboard/numeric.json]

here is my code below

enter code here


   from kivy.lang import Builder
   from kivymd.app import MDApp
   from kivymd.uix.screen import MDScreen
   from kivy.uix.relativelayout import RelativeLayout
   from kivy.uix.screenmanager import ScreenManager

   from kivy.core.window import Window




   KV= '''
   <REGITRATION_Window>:
        name:'regitration_window1'
        RelativeLayout:

             MDToolbar:
                title: 'Registraion'
                elevation: 10
                left_action_items: [['arrow-left']]
                pos_hint: {"left":1, "top":1}
       
             MDLabel:
                text: 'Country Code '
                font_size: 15
                pos_hint : {'x':0.0322, 'y':0.272}
    
             MDTextFieldRound:
                int_text: 'For Eg:- +91'
                pos_hint : {'x':0.0322, 'y':0.710}
                size_hint : 0.08, .045
                on_text: app.setup_key()

             MDLabel:
                text: 'Mobile Number'
                font_size: 15
                pos_hint : {'x':0.305, 'y':0.272}
    
             MDTextFieldRound:
                hint_text: 'For Eg:- 987654321'
                pos_hint :{'x':0.305, 'y':0.710}
                size_hint : 0.35, .045
            
             MDFillRoundFlatButton:
                text:'REGISTER'
                pos_hint: {'x':.1, 'y':.1}
             MDFillRoundFlatButton:
                 text:'Cancel'
                 pos_hint: {'x':.3, 'y':.1}

             RelativeLayout:
                 id: data_layout


  WindowManager:

     REGITRATION_Window:
         id: key_num


        '''


     class REGITRATION_Window(MDScreen):
          pass


    class WindowManager(ScreenManager):
          pass

    class MainApp(MDApp):
         def build(self):
             return Builder.load_string(KV)

         def close_key(self):
             pass
         def setup_key(self):
             NumKB = Window.request_keyboard(self.close_key, self)
             if NumKB.widget:
                 NumKB.widget.layout = 'numeric.json'
                 self.root.ids.key_num.ids.data_layout.add_widget(self.NumKB)
        

         if __name__ == '__main__':  
              MainApp().run()

Answer 1

Well I took a look at your code and the Vkeyboard implementation on kivy github repo, it was a little complicated. but i came up with something. it was a little tricky but this should work. I had to modify the numeric.json file a little so, here's my link to it and my github repo: numeric.json

from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.screen import MDScreen
from kivy.uix.relativelayout import RelativeLayout
from kivy.uix.screenmanager import ScreenManager
from kivy.uix.vkeyboard import VKeyboard
from kivy.core.window import Window
from kivy.properties import ObjectProperty

KV = '''
<NumericKeyboardScreen>:
    name: 'numeric_screen'
    
    RelativeLayout:

        MDToolbar:
            title: 'Numeric Keyboard Implementation'
            elevation: 10
            y: self.parent.height - self.height

        MDLabel:
            text: 'Number TextField'
            font_size: 15
            y: self.parent.height - self.height - dp(90)
            pos_hint :{'center_x':0.5}
            halign: 'center'
            size_hint_y: None
            height: dp(20)

        MDTextField:
            id: text_field
            hint_text: 'For Eg:- 987654321'
            y: self.parent.height - self.height - dp(135)
            pos_hint :{'center_x':0.5}
            size_hint_x : 0.35
            mode: 'rectangle'
            input_filter: 'int'
            on_focus: root.set_layout(keyboard_anchor, self)


        RelativeLayout:
            id: keyboard_anchor
            size_hint_y: 0.5

WindowManager:
    NumericKeyboardScreen:
        id: key_num
'''

class WindowManager(ScreenManager):
    pass

class NumericKeyboardScreen(MDScreen):
    focus_count = 0
    def set_layout(self, keyboard_anchor, target_textfield):
        self.focus_count += 1
        v_keyboard = NumericKeyboard(
            text_field = target_textfield
        )
        keyboard_anchor.clear_widgets()
        keyboard_anchor.add_widget(v_keyboard)

        if self.focus_count == 2:
            keyboard_anchor.clear_widgets()
            self.focus_count = 0

class NumericKeyboard(VKeyboard):
    text_field = ObjectProperty()
    custom_vk_layout = ObjectProperty('numeric.json')

    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.available_layouts['numpad'] = self.custom_vk_layout
        self.layout = self.custom_vk_layout
        self.pos_hint = {'center_x': 0.5}

    def on_key_down(self, keyboard, keycode, text, *args):
        """ The callback function that catches keyboard events. """

        if isinstance(keycode, tuple):
            keycode = keycode[1]

        if keycode == "bs":
            if len(textfield_data) > 0:
                self.text_field.text = textfield_data[:-1]
        else:
            self.text_field.text += u"{0}".format(keycode)


    def on_key_up(self, keyboard, keycode, *args):
        """ The callback function that catches keyboard events. """
        textfield_data = self.text_field.text

        if isinstance(keycode, tuple):
            keycode = keycode[1]

        if keycode == "bs":
            if len(textfield_data) > 0:
                self.text_field.text = textfield_data[:-1]
        else:
            self.text_field.text += u"{0}".format(keycode)


class MainApp(MDApp):
    def build(self):
        return Builder.load_string(KV)


if __name__ == '__main__':
    MainApp().run()