片手親指でキータイプができる英語キーボードThumbFan Keyboardをリリース。技術概要など

iOS8でエクステンションの機能が追加されて何か作ってみたかったのと、iPhone 6 Plusの大きさによる不便さを解決したいという理由で、片手親指キーボードをつくってみました。

片手UIについて

片方に寄せるキーボードは他にも幾つかあるのですが、実際に片手で使おうとすると、縦横のキーボードの一部を親指でクリックするのは難しいので、親指の回転に合わせて扇型にキーを配置しました。

左右にキーを動かせるようになっているので、右手左手両方使うことできたり、キーボード閉じるボタンを常に表示していたり、横向きにすると右手左手両方に扇型のキーボードが出てきたりという感じの面白い動きになっています。また、キーボードエクステンション内で全ての動作を終わらせていて、親アプリとのデータの交換もしていないため、フルアクセスを必要としていません。
実際にタイプしている様子はこちら。ビデオ撮りながら打っているので実際にはもう少し早く打てるはず。

価格について

フルアクセスをキーボードアプリが求めない場合は、メインのアプリとキーボードがデータをシェアしたり、通信したりすることができないため、親アプリで購入したアプリ内購入の情報をキーボード側で取得することもできません。フルアクセスを許可すると最悪キーボード入力を盗み取るアプリを作ることも可能になるので、今回のアプリでは今の所フルアクセスの要求もしないようにしました。そのため、ユーザーは、情報を盗み取られていると心配せずに使うことができます。

そのためアプリは100円の有料アプリとしました。本アプリが機能豊富になってきたら、無料版アプリも作れればと思います。

iOS 8 キーボードエクステンションについて

iOS 8 からできたキーボードエクステンションですが、App Extension Programming Guide: Custom Keyboard のアップルのガイドに情報が載せられていますが、サイズをうまく設定するのなどが最初戸惑いました。結局はAutolayoutで縦の制約を作ってあげれば良いのですが、JapaneseKeyboardKit/KeyboardViewController.m at master · kishikawakatsumi/JapaneseKeyboardKit こちらのコードは参考になりました。

工夫した点として、このキーボードのサイズは、ピクセルサイズに依存していないため、iPhone 6 plusのサイズに対応していない拡大されたアプリの場合も、大きなキーボードを出す必要がありません。

それで、上記のようなコードを書いて、ちょっと前だとLineのように、iPhone 6 plusのネイティブの画面サイズに対応したアプリでなくても、大きすぎるキーボードが出ないようにしています。（Lineもすでに大画面対応されて、大方の有名アプリはすでに対応されていますね）[UIScreen mainScreen].bounds.size.widthは拡大アプリでもネイティブのサイズが返るというのがポイントですね。

エクステンションでのCocoaPodsの使用について

普通にCocoaPodsのプロジェクトを作成するだけでは、エクステンションで、CocoaPodsでインストールしたプロジェクトが使えないので、ライブラリを組み込んだりする必要があったと思います。ちょっと前に困った点なのでうろ覚えなのですが。

Reactive Cocoa のパフォーマンスについて

アプリは最初ReactiveCocoaを使ってバリバリのRxプログラムで作ってみました。シフトキーの状態やキーが右にあるか左にあるかなどのステータスを全てモデルにもたせて、MVVMでViewのプロパティを変える、背後に隠れているキーも、hiddenプロパティの操作で表示のオンオフを切り替えるようにしてみました。だだ、この方法では全てのキーに対応したビューのインスタンスが内部的に生成されるため、本当に表示されているビューのみのインスタンスを作成するよりもメモリーを余計に食います。しかもExtentionは通常のアプリよりも低いメモリの使用しか許可されていないようで、インスタンスの作りすぎによってメモリーが多く食われ、キーボードがクラッシュしたり、起動しなくなったりしました。そのため、Rxでバインディングするのではなく、再表示メソッドをデリゲートにしてコールするように少しづつ書き換えることによって、メモリの使用が減らされて、クラッシュしないようになりました。これに関しては、Reactive Cocooa自体のパフォーマンスが悪いというよりも、バインディングを使用したM-VM-C-Vの方式で記述すると、単純にMVCで書くよりも富豪的プログラミングになりやすいという側面を示していると思います。
ReactiveCocoa and MVVM, an Introduction · Sprynthesis
実際にコントローラーをバインド的な記述から、再表示メソッドを実装してコントローラーで多くの処理を行い、コントローラーの必要なメソッドをdelegateパターンで呼び出すようにすることによって、ReactiveCocoaの便利な機能を使い続けたまま、メモリの使用を抑えることができました。タッチイベント中に触られているキーに枠を付けて装飾したり、キーボードのダークモードとLightモードが逐次変わったのを判断して文字色を変えたりするなどの反応的な動作を行うのにはReactiveCocoaを使用しているとかなり楽に行うことができました。

これから

英語キーボードの場合、Auto Complete（自動タイポ修正）やAuto Suggestion（予測語の表示と選択）などの機能があると非常に便利で、それらの機能がiOS8のKeyboardControllerの機能を使えば比較的簡単に実装できそうなので、そちらにも対応したいと思っています。また、片手で扇型の日本語キーボードがないので、そちらにも挑戦してみたいなーと思っています。英語をよく打たれる方でしたら、今のアプリでも結構便利なので使ってみていただければ嬉しいです。