How show a virtual keyboard on screen?

keyboard
ios
#1

On my iOS app I want to rename some Items, so I’d like to show a virtual keyboard on the screen when I press a button? It’s possible? and if so how?

If it’s possible how can I get the bounds of this virtual keyboard to reposition the item that needs to be renamed to ensure that it’s not hidden? and how to detect when return key is pressed to dismiss the virtual keyboard?

Thank you in advice!

0 Likes

#2

I don’t have a ton of experience with this, but I think the keyboard should appear when an editable text field is displayed. I have a menu item for renaming something, which puts a Label into edit mode, and the keyboard appears.

and I am interested in the 2nd question as well! :slight_smile:

1 Like

#3

Searching I found a methods called:

setMouseClickGrabsKeyboardFocus( true );
grabKeyboardFocus();
setWantsKeyboardFocus( true );

But noone of them shows me virtual keyboard, my code now is this:

MainComponent::MainComponent()
{
    setSize (800, 800);
    addAndMakeVisible(myButton);
    myButton.setMouseClickGrabsKeyboardFocus(true);
    myButton.onClick = [this]() {
        
        myButton.grabKeyboardFocus(); //this should shows virtual keyboard, but doesn't work
        //...other stuff with virtual keyboard created
        
    };
}
0 Likes

#4

You need an edit control (Label, TextEditor, etc) that takes keyboard input. As I said in my previous comment, I do something similar. I have a Label that when the user selects a menu item it is put into ‘edit mode’, ie.

nameLabel.showEditor();

I also set it up so the user can’t just click on the Label to edit it, but to let the mouse work correctly when it is in edit mode:

    nameLabel.setEditable (true);
    nameLabel.setInterceptsMouseClicks (false, false);
    nameLabel.onEditorShow = [this]() { nameLabel.setInterceptsMouseClicks (true, true); };
    nameLabel.onEditorHide = [this]() { nameLabel.setInterceptsMouseClicks (false, false); };
    nameLabel.onTextChange = [this]() { setEntryName (nameLabel.getText()); };
1 Like

#5

Really thankyou @cpr! Finally I solved creating this class, maybe is useful for someone else or may if someone has suggestion is welcome (to solve for example a bug on the JUCE text editors: on iOS when I press on my virtual keyboard the button to hide the virtual keyboard I expect to rise it up again with a tap with the text editor component that I’m editing, but it is not so)! :slight_smile:

class EnterTextDialogWindow : public AlertWindow, public KeyListener, public MouseListener
{
public:
    // pass directly this static function to change a string (it create from himself the dialog window and when you press escape or return it pass what you have just wrote
    static String showEnterTextDialogWindow(String windowTitle)
    {
        
        ScopedPointer<EnterTextDialog> enterTextDialog = new EnterTextDialogWindow {windowTitle};
        enterTextDialog->runModalLoop();
        return enterTextDialog->getTextEditorContents(windowTitle);
    }
    
    EnterTextDialogWindow(String dialogTitle) : AlertWindow{dialogTitle, "", AlertWindow::NoIcon}
    {
        addTextEditor(dialogTitle, "enter-text");
        getTextEditor(dialogTitle)->setJustification(Justification::centred);
        addKeyListener(this);
    }
    
    ~EnterTextDialogWindow() {}
    
private:
    
#if JUCE_IOS
    void resized() override
    {
        setTopLeftPosition(getX(), getY()/2);
    }
#endif
    
    bool keyPressed (const KeyPress& key, Component* originatingComponent) override
    {
        if (key == KeyPress::returnKey)
        {
            exitModalState(0);
        }
    }
    
#if JUCE_IOS
    void mouseDrag (const MouseEvent& event) override{}
#endif
    
};
0 Likes