iOSのおしゃれな文字入力ライブラリつくってみた(swift)

Last updated at 2019-10-26Posted at 2019-10-22

#はじめに
今までいろいろiOSライブラリを作りましたが、中々使い道のないものばかりでした。

今回はいろんなアプリで使えるものということを主眼に置いて作成しました！！

カラーピッカーとかアプリ内で色を選択する機会はそうありません。しかし、大抵のアプリで行うことがあります。そう、文字入力です！！

文字入力といえば...ウィジャ盤！！！（ウィジャボード、いわゆるこっくりさん的なやつ）

#GitHub

つくったものはここ　AMOuijaBoard

Cocoapods,Carthage,SwiftPMに対応してます。

#見た目

#機能

タップで文字を選択できる(大文字アルファベットと数字のみ)
GoodByeのタップを検知（Enter的な役割）
フォントや色を設定できる

#使い方

AMOuijaBoardViewを設定する

// viewDidloadで初期化
let boardView = AMOuijaBoardView(frame: view.bounds)

// ここでフォントや色を指定

boardView.delegate = self
view.addSubview(boardView)

デリゲートを設定する(2019/10/26修正)

func ouijaBoardView(_ ouijaBoardView: AMOuijaBoardView, didSelectKey key: AMOuijaBoardView.Key) {
  switch key {
  case .goodbye:
    // GOOD BYEタップ時に呼ばれる
    break
  case .no:
    // NOタップ時に呼ばれる
    break  
  case .yes:
    // YESタップ時に呼ばれる
    break
  case .alphabet(let text):
    // アルファベットタップ時に呼ばれる
    // textはタップしたアルファベット（A~Z）
    break
  case .number(let text):
    // 数字タップ時に呼ばれる
    // textはタップした数字（0~9）
    break
  } 
}

描画の関係で幅は300~600で縦横の比は1:1.414です。この範囲外だとわりとレイアウトが崩れます...

小文字で受けたい場合は text.lowercased() で小文字にしてもらえれば小文字を取得できます。

日本語にしたい場合は applyingTransform(_:reverse:) でローマ字変換すればできなくもない気がします。

以前作ったUIViewを燃やすライブラリと組み合わせるとこんな感じです。

#さいごに
~~作ってから思いましたが入力ミスした場合の取消し処理がありません。~~

~~NOをタップでとか思いましたがそれだとYESの場合どうするか...~~
delegateを修正してYES/NOタップも受けれるようにしました。(2019/10/26修正)
NOタップのところで下記のような処理をすれば一文字削除ができます。（それでもやっぱりYESタップ時の処理が悩むところ...）

// inputTextが入力文字列
if !inputText.isEmpty {
  inputText.prefix(inputText.count - 1).map { String($0) }.joined()
}

計算処理やカーソル描画の妥協、タップするには間隔が狭すぎるなど改善点はいろいろあります

#つくったのまとめ

##動作確認用にまとめたプロジェクト

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up