Swift Custom keyboard - show extra letters pop-up on keyboard long press?

Question

I have a custom keyboard extension in my app which is developed using swift. They keyboard works fine. I wanted to add the functionality of showing a pop-up with extra characters when long-press on a keyboard button like the default iOS keyboard. Something like this:

I searched a lot, but most of them are un-answered and the answered ones are in Obj-C. I don't know much about Obj-C and am fairly new to swift programming also.

I have already looked at this, this and this. But these are not of much help.

Any help would be really appreciated.

are you using Custom KeyBoard View or using defuilt keyboard ? — Dhiru, May 26 '17 at 19:57
answer Updated with bug fix, please check and let me know if this solved your porob @bhakti123 — Dhiru, Jun 01 '17 at 11:21
if want to make same Appearance like ios pop View have , i can make it ,,you need to contact me personally ,,,i'll send you the project file , https://chat.stackoverflow.com/rooms/144892/ios-dev-expert — Dhiru, Jun 01 '17 at 15:56
this questions has beed answered below and not accepted yet , you can accept the answer which helped you , accepting answer helps other. @bhakti123 — Dhiru, Jul 11 '17 at 10:46
Did u manage to solve this? If yes, would you mind putting the solution here? — crost, Nov 24 '20 at 11:39

score 2 · Answer 1 · edited Apr 05 '21 at 13:20

1. Add Button on your View
(This is just to show you)

let btn: UIButton=UIButton(frame: CGRect(x: 5, y: 70, width: 30, height: 30))
     btn.setTitle("A", for: .normal)
    btn.setTitleColor(UIColor.black, for: .normal);
     self.view.addSubview(btn)

2. Add Long PressGesture on your button

     let longGesture = UILongPressGestureRecognizer(target: self, action: #selector(longPress(sender:)))
longGesture.minimumPressDuration = 1.2
        btn.addGestureRecognizer(longGesture)

3. Handle Long press Gesture ,

You can Add PopUpView and add Some button on it ,

⚠️ Note: You have Multiple buttons so you have to check From CGPoint on Which Button it was tapped on

  func longPress( sender: Any) {
            
            let longPressGesture = sender as! UILongPressGestureRecognizer

//Only run this code When State Begain
if longPressGesture.state != UIGestureRecognizerState.Began {
            return
     }
// if PopUpView is Already in added than remove and than  add
 if let checkView = self.view.viewWithTag(1001) as? UIView {
         // remove popView
        popUpView .removeFromSuperview()
   }
            
            let tapLocation = longPressGesture.location(in: self.view)
            
            
            popUpView=UIView(frame: CGRect(x: tapLocation.x-10, y: tapLocation.y-65, width: 150, height: 60))
            popUpView.backgroundColor=UIColor.orange
            popUpView.layer.cornerRadius=5
            popUpView.layer.borderWidth=2
            popUpView.tag=1001
            popUpView.layer.borderColor=UIColor.black.cgColor
            
            let btn0: UIButton=UIButton(frame: CGRect(x: 5, y: 5, width: 30, height: 30))
            btn0.setTitle("A1", for: .normal)
            btn0.setTitleColor(UIColor.black, for: .normal);
            btn0.layer.borderWidth=0.5
            btn0.layer.borderColor=UIColor.lightGray.cgColor
            
            popUpView.addSubview(btn0)
            
            let btn1: UIButton=UIButton(frame: CGRect(x: 35, y: 5, width: 30, height: 30))
            btn1.setTitle("A2", for: .normal)
            btn1.setTitleColor(UIColor.black, for: .normal);
            btn1.layer.borderWidth=0.5
            btn1.layer.borderColor=UIColor.lightGray.cgColor
            
            popUpView.addSubview(btn1)
            
            let btn2: UIButton=UIButton(frame: CGRect(x: 70, y: 5, width: 30, height: 30))
            btn2.setTitle("A2", for: .normal)
            btn2.setTitleColor(UIColor.black, for: .normal);
            btn2.layer.borderWidth=0.5
            btn2.layer.borderColor=UIColor.lightGray.cgColor
            
            popUpView.addSubview(btn2)
            
            btn0.addTarget(self, action: #selector(self.buttonAction(sender:)),
                             for: UIControlEvents.touchUpInside)
            btn1.addTarget(self, action: #selector(self.buttonAction(sender:)),
                           for: UIControlEvents.touchUpInside)
            btn2.addTarget(self, action: #selector(self.buttonAction(sender:)),
                           for: UIControlEvents.touchUpInside)
     
             self.view.addSubview(popUpView)
            
           
        }

4. Handle The extra Button Press

(Do your Stuff here add remove popUpView from SuperView)

      func buttonAction( sender: Any) {
            
            // Do your Stuff Here
            
            
            //Than remove popView
            popUpView .removeFromSuperview()
        }

Result ✅

✅ Note: You can Draw custom Shape of PopUpView Using UIBezierPath

score 0 · Answer 2 · answered May 23 '17 at 05:33

0

You should use LongPress Recognizer. Please check this for more detail. Long press delete key of a custom keyboard in swift

answered May 23 '17 at 05:33

Eddwin Paz

2,593
2
24
43

I am not looking for how to use `LongPressGestureRecogniser`. I am looking for how to show the pop-up for the extra characters. – bhakti123 May 23 '17 at 05:37

score -1 · Answer 3 · edited Apr 05 '21 at 13:19

-1

This is very simple follow this step for achieve that task

Open your main story board
Select your TextField where you want multiple letter want's to show.
Open Attribute inspector from the right of your screen
Scroll it up and looks for capitalization just below of Min font size
Set capitalization as Words
Set all other Default and mainly keyboard type Now build and run that and check with letter s, e and etc.

edited Apr 05 '21 at 13:19

Nimantha

4,731
5
15
38

answered May 31 '17 at 10:58

Pushpendra

1,361
16
28

I dont have a particular TextField for which I want to show multiple letters. As i mentioned in the question, I am making a custom keyboard extension. Meaning I am making a keyboard that can be used in any app. – bhakti123 May 31 '17 at 11:23
So you want's your own key board and want to show multiple character as shown in your figure. if yes then i'll get back to you with my answer as soon as possible. – Pushpendra May 31 '17 at 11:38
yes. I have build my own keyboard using the chrome keyboard extension. Now want to implement the above shown functionality – bhakti123 May 31 '17 at 11:43

Swift Custom keyboard - show extra letters pop-up on keyboard long press?

3 Answers3