はじめに
Eurekaライブラリとは
Eurekaライブラリとは、iOSの入力フォームなどを、高速かつ簡単に作成するためのライブラリである。
https://github.com/xmartlabs/Eureka
背景
このライブラリの基本的な使い方は様々な記事で紹介されている。しかし、応用的な使い方や、マイナーなカスタマイズは中々載っていなかったため、私自身カスタマイズに苦労した。
私この経験を記事にすることで、皆様のお役に立てるのではないかと思い投稿させて頂いた。
この記事の主なターゲット
- Eurekaライブラリの基本的な使用方法を知っている方
- Swift初心者の方
- Eurekaを使用して間も無く、もっと活用できるようになりたいと感じている方
編集履歴
- 2020年9月6日(日):本記事を投稿
カスタマイズ集
LabelRowにDisclosure Indicatorを表示
EurekaSample.swift
class EurekaSample: FormViewController {
override func viewDidLoad() {
super.viewDidLoad()
form.append(Section() {
$0.append(LabelRow() {
$0.cell.accessoryType = .disclosureIndicator
})
})
}
}
LabelRowにSub Titleを追加
EurekaSample.swift
import Eureka
class EurekaSample: FormViewController {
override func viewDidLoad() {
super.viewDidLoad()
form.append(Section() {
$0.append(LabelRow() {
$0.title = "title"
$0.cellStyle = UITableViewCell.CellStyle.subtitle
}.cellUpdate { cell, _ in
cell.detailTextLabel?.text = "sub title"
cell.detailTextLabel?.textColor = UIColor.systemGray
}.onCellSelection { cell, row in
self.navigationController?.pushViewController(UIViewController(), animated: true)
})
})
}
}
PushRowの選択先のVCのSectionを複数にする
無理やりです。
EurekaSample.swift
import Eureka
class EurekaSample: FormViewController {
private let dataList = [String]()
override func viewDidLoad() {
super.viewDidLoad()
form.append(Section() {
$0.append(PushRow<String>("tag") {
$0.title = "title"
// オプションで追加はしない
//$0.options
}.onPresent { from, to in
// デフォルトのセクションタイトルを消す
to.form.allSections.first?.header = nil
// セクション追加
let section1 = Section("section1")
section1.tag = "section1"
let section2 = Section("section2")
section2.tag = "section2"
for data: String in self.dataList {
section1.append(LabelRow() {
$0.title = data
}.onCellSelection { cell, row in
// デフォルトのPushRowを同じ挙動をさせる
self.navigationController?.popViewController(animated: true)
(self.form.rowBy(tag: "tag") as! PushRow<String>).value = data
})
}
to.form.append(section1)
to.form.append(section2)
})
})
}
}
文字入力系RowのUIToolbarをカスタマイズ
EurekaSample.swift
import Eureka
class EurekaSample: FormViewController, UITextFieldDelegate {
private var activeTextField: UITextField? = nil
// TextFieldが選択された時
func textFieldDidBeginEditing(_ textField: UITextField) {
// textFieldの参照先をメンバ変数で保持しておく
self.activeTextField = textField
}
// Keyboardの上のUIToolbarの完了ボタン押下時の処理
@objc private func focusDelete() {
// 参照先を保持しているTextFieldのFocusを外す
activeTextField?.resignFirstResponder()
}
override func viewDidLoad() {
super.viewDidLoad()
form.append(Section() {
$0.append(TextRow() {
$0.title = "title"
}.cellUpdate { cell, row in
// ここでこのRowのTextFieldのDelegateをセットさせる
cell.textField.delegate = self
})
})
}
// カスタマイズUIToolbar(右側にDone buttonのみを配置)
override func inputAccessoryView(for row: BaseRow) -> UIView? {
let toolbar = UIToolbar(frame: CGRect(x: 0, y: 0, width: self.view.bounds.width, height: 0))
toolbar.sizeToFit()
var items = [UIBarButtonItem]()
items.append(UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil))
// DoneのActionを設定
let doneButton = UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(focusDelete))
items.append(doneButton)
toolbar.items = items
return toolbar
}
}
SectionのHeader、Footerをカスタマイズ
EurekaSample.swift
import Eureka
class EurekaSample: FormViewController {
override func viewDidLoad() {
super.viewDidLoad()
let section = Section()
section.footer = { var footer = HeaderFooterView<UIView>(.callback({
let view = UIView(frame: CGRect(x: 10, y: 0, width: self.view.bounds.width - 20, height: 100))
return view
}))
footer.height = { 180 }
footer.onSetupView = { view, _ in
view.preservesSuperviewLayoutMargins = false
let label = UILabel(frame: CGRect(x: 10, y: 0, width: self.view.bounds.width - 20, height: 100))
label.font = UIFont.systemFont(ofSize: 13)
label.numberOfLines = 0
label.textAlignment = .left
label.text = "footer description"
label.sizeToFit()
view.addSubview(label)
}
return footer
}()
form.append(section)
}
}
曜日のPickerInlineRow
EurekaSample.swift
import Eureka
class EurekaSample: FormViewController {
override func viewDidLoad() {
super.viewDidLoad()
form.append(Section() {
$0.append(PickerInlineRow<Weekday>() {
$0.options = [.sunday, .monday, .tuesday, .wednesday, .thursday, .friday, .saturday]
$0.displayValueFor = {
guard let weekday = $0 else { return nil }
return weekday.rawValue + "曜日"
}
})
})
}
}
enum Weekday: String {
case sunday = "日"
case monday = "月"
case tuesday = "火"
case wednesday = "水"
case thursday = "木"
case friday = "金"
case saturday = "土"
}
月と日のみのPickerInlineRow
EurekaSample.swift
import Eureka
class EurekaSample: FormViewController {
override func viewDidLoad() {
super.viewDidLoad()
form.append(Section() {
$0.append(DoublePickerInlineRow<String, String>() {
$0.firstOptions = { return (1...12).map { String($0) + "月" } }
$0.secondOptions = { month in
var days = [String]()
switch month {
case "4月", "6月", "9月", "11月":
days = (1...30).map { String($0) + "日" }
case "2月":
days = (1...29).map { String($0) + "日" }
default:
days = (1...31).map { String($0) + "日" }
}
return days
}
$0.displayValueFor = {
guard let monthDay = $0 else { return nil }
return monthDay.a + monthDay.b
}
})
})
}
}
おわりに
以上になります。万が一ミスなどをお気づきになりましたら、お手数をおかけしてしまい申し訳ありませんが、コメントなどでお知らせして頂けると助かります。
今後も他のカスタマイズが気付き次第更新したいと思います。