こんにちは。shiguです。
今回ちびめも。のパスワードロック機能を実装するため、
Smile-Lockというライブラリを使用しました。

github.com

THPinViewControllerと迷ったのですが、
ちびめも。のコンセプトが「手軽にパッとメモができる」なので、
将来的に指紋認証でロック解除できるようにしたいと思いSmile-Lockを採用しました。
github.com

Smile-Lockをインストールする

まずは、Cocoa PodsでSmile-Lockをインストールします。
Podfileを書き替えます。

target '（プロジェクト名）' do
use_frameworks!
pod 'SmileLock'
end

そして、インストールします。（他のライブラリの記述も含まれています）

$ pod install
Analyzing dependencies
Downloading dependencies
Using Google-Mobile-Ads-SDK (7.21.0)
Using Realm (2.8.3)
Using RealmSwift (2.8.3)
Installing SmileLock (2.0.2)
Generating Pods project
Integrating client project
Sending stats
Pod installation complete! There are 3 dependencies from the Podfile and 4 total pods installed.

使い方

下記のように、ViewControllerにWindowを貼り付けて使用します。

import Foundation
import UIKit
import SmileLock
class PasswordInputViewController: UIViewController, PasswordInputCompleteProtocol {
let passwordDigit = 4
var passwordContainerView: PasswordContainerView!
override func viewDidLoad() {
super.viewDidLoad()
passwordContainerView = PasswordContainerView.create(withDigit: passwordDigit)
passwordContainerView.center = self.view.center
passwordContainerView.delegate = self
self.view.addSubview(passwordContainerView)
}
}

このVCを表示させるとこんな感じです。

下記のdelegateメソッドで入力されたパスコードやtouchIDの認証結果を得られるので、
ハンドリングして後の処理を続けるか否か設定できます。

    // パスコード入力
func passwordInputComplete(_ passwordContainerView: PasswordContainerView, input: String) {
// 成功・失敗でハンドリング
}
// touchID
func touchAuthenticationComplete(_ passwordContainerView: PasswordContainerView, success: Bool, error: Error?) {
// 成功・失敗でハンドリング
}

カスタマイズ

色変更は簡単にできます。

// ボタンの縁や数字の色
passwordContainerView.tintColor = .red
// ボタンタップ時のハイライトカラー
passwordContainerView.highlightedColor = .blue

パスコードの設定

またパスコードを利用する場合はパスコードの設定が必要になりますが、
それもこのようにenumでモードを管理すれば簡単です。

import Foundation
import UIKit
import SmileLock
class PasswordInputViewController: UIViewController, PasswordInputCompleteProtocol {
@IBOutlet weak var lblMessage: UILabel!
@IBOutlet weak var btnClose: UIButton!
var mode: DisplayMode!
let passwordDigit = 4
var inputPassword: String?
var passwordContainerView: PasswordContainerView!
enum DisplayMode {
case confirm, register, lock
}
override func viewDidLoad() {
NSLog("-----PasswordInputVC-----")
super.viewDidLoad()
passwordContainerView = PasswordContainerView.create(withDigit: passwordDigit)
let rect = CGRect(x: 0, y: 0, width: passwordContainerView.frame.size.width, height: passwordContainerView.frame.size.height-30)
passwordContainerView.frame = rect
passwordContainerView.center = self.view.center
passwordContainerView.delegate = self
passwordContainerView.tintColor = themeColor // brown
passwordContainerView.highlightedColor = themeColor // brown
self.view.addSubview(passwordContainerView)
self.view.bringSubview(toFront: btnClose)
if mode == DisplayMode.confirm {
lblMessage.text = "設定するパスワードを入力してください"
btnClose.isHidden = false
} else if mode == DisplayMode.register {
lblMessage.text = "確認のためもう一度パスワードを入力してください"
btnClose.isHidden = false
} else {
lblMessage.text = "パスワードを入力してください"
btnClose.isHidden = true
}
}
}

こうすると…

編集モード

確認入力モード

入力モード（アプリ起動時）

このSmile-Lockだけでパスワードロック機能が実装できてしまいます♪
ということであとはテストして実機確認してリリース作業に移るのみです。

手帳好き女子のためのメモアプリ「ちびめも。」バージョンアップはもうすぐです！

ちびめも。-手帳好き女子のためのメモアプリ-

• Misato Imaji
• Lifestyle
• Free
•