iOS 8 – Third Party Keyboards Using App Extension
Before creating the third party keyboard for ios 8 using the app extension, you should have some knowledge on App Extension.
Here i am going to share my knowledge on App Extensions ,which are newly available feature from iOS 8
What is an app Extension?
- App Extension is sharing one iOS applicationās functionality with other applications in a device.
- To create the app Extension you can use the Objective-C or Swift.
How app Extension work?
Figure 1:ios 8 App Extension life cycle.
When user chooses the app extension from your host app,app Extension will be launched ,it will run the code of app extension,when the user done with the app extension system kills app extension.
How does an app Extension communicate?
Figure 2:App Extension Communication.
- App Extension mainly communicates with its host application.
- When the host application requests the app extension ,app extension will respond to that request with appropriate action.
- There is no direct communication between the containing app and app extension.
- When the host app running the app extension containing app is not even running.
How custom keyboard works ?
Figure 3:custom keyboard working process.
The Custom Keyboard template (in the iOS āApplication Extensionā target template group) contains a subclass of the UIInputViewController, which is as your keyboardās view controller. The template includes a basic implementation of the required button ānext keyboardā, This will call advanceToNextInputMode method or function of the UIInputViewController. Add objects such asbuttons, views, controls, and swipe actions to the input view controllerās primary view (in its inputView property), as suggested in Figure 3.
Methods or functions provided by the apple:
[ self.textDocumentProxy insertText:@”hello ” ]; : used to insert āhelloā string at insertion point
[ self.textDocumentProxy insertText:@”n ” ];: used to return the keyboard
[self.textDocumentProxy deleteBackward]; :used to delete single character from insertion point towards left
[ self.textDocumentProxy hasText ] ; :used to check insertion point is having text or not,if text is present at insertion point this method will return the true else it return the false.
Creating Custom keyboard Extension:
1.From your xcode choose file at left top corner.
2.Select the new option.
3.choose Target .
4.Choose the application Extension under the ios section.
Figure 4:Adding Custom keyboard Extension target.
This will add the custom keyboard extension to your containing app.
You will see KeyboardViewController class which is inherited from the UIInputViewController
now you can add buttons as many you want to the custom keyboard
Sample Project:
Here is the example to create four buttons on the custom keyboard view and adding the functionality .
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor=[UIColor blackColor];
UIButton *button1=[[UIButton alloc] initWithFrame:CGRectMake(10, 60, 100, 100)];
button1.backgroundColor=[UIColor clearColor];
[button1 setTitle:@"J" forState:UIControlStateNormal];
[button1 setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[button1 setTitleColor:[UIColor grayColor] forState:UIControlStateSelected];
button1.layer.cornerRadius=10;
button1.layer.borderWidth=2;
button1.tag=1111;
[button1 addTarget:self action:@selector(keyBoardButtonClick:)
forControlEvents:UIControlEventTouchUpInside];
button1.layer.borderColor=[[UIColor lightGrayColor] CGColor];
[self.view addSubview:button1];
UIButton *button2=[[UIButton alloc] initWithFrame:CGRectMake(110, 60, 100, 100)];
button2.backgroundColor=[UIColor clearColor];
button2.tag=2222;
[button2 setTitle:@"R" forState:UIControlStateNormal];
[button2 setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[button2 setTitleColor:[UIColor grayColor] forState:UIControlStateSelected];
button2.layer.cornerRadius=10;
button2.layer.borderWidth=2;
[button2 addTarget:self action:@selector(keyBoardButtonClick:)
forControlEvents:UIControlEventTouchUpInside];
button2.layer.borderColor=[[UIColor lightGrayColor] CGColor];
[self.view addSubview:button2];
UIButton *button3=[[UIButton alloc] initWithFrame:CGRectMake(210, 60, 100, 100)];
button3.tag=3333;
button3.backgroundColor=[UIColor clearColor];
[button3 setTitle:@"K" forState:UIControlStateNormal];
[button3 setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[button3 setTitleColor:[UIColor grayColor] forState:UIControlStateSelected];
button3.layer.cornerRadius=10;
button3.layer.borderWidth=2;
[button3 addTarget:self action:@selector(keyBoardButtonClick:)
forControlEvents:UIControlEventTouchUpInside];
button3.layer.borderColor=[[UIColor lightGrayColor] CGColor];
[self.view addSubview:button3];
UIButton *button4=[[UIButton alloc] initWithFrame:CGRectMake(210, 60, 100, 100)];
button4.tag=3333;
button4.backgroundColor=[UIColor clearColor];
[button4 setTitle:@"K" forState:UIControlStateNormal];
[button4 setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[button4 setTitleColor:[UIColor grayColor] forState:UIControlStateSelected];
button4.layer.cornerRadius=10;
button4.layer.borderWidth=2;
[button4 addTarget:self action:@selector(advanceToNextInputMode)
forControlEvents:UIControlEventTouchUpInside];
button4.layer.borderColor=[[UIColor lightGrayColor] CGColor];
[self.view addSubview:button4];
}
-(void)keyBoardButtonClick:(UIButton *)sender
{
if (sender.tag==1111) {
[self.textDocumentProxy insertText:@"J"];
}else if (sender.tag==2222)
{
[self.textDocumentProxy insertText:@"R"];
}else if (sender.tag==3333)
{
[self.textDocumentProxy insertText:@"K"];
}
}
- Change schema in the Xcode at left top corner to app extension.
- Run the Extension
- It will ask you to select the application to run the Extension,Select the host app and run
- Your custom keyboard will appear on the host app.
Figure 5:Sample Project Custom keyboard.
Source Code: https://github.com/mastersoftwaresolutions/Simple-Custom-keyboard-ios
