目次
- 前回
- 自分以外のページを閲覧するために、超簡易検索機能を実装する
- DataBase
- 実装
- 完成
- 感想
- 次回
前回
【iOS】プログラミング素人の俺が、Swift + Firebaseを使って、インスタクローンを作る！【アップロードページ編】
自分以外のページを閲覧するために、超簡易検索機能を実装する
前回までは、自分のページの閲覧は出来ていたが、自分以外のページの閲覧は出来ていなかった。
今回は、超簡易検索機能を実装して、自分以外のページを閲覧できるようにする。
DataBase
今回は、Firebaseに入力フォームから入力したユーザネームを、データベースに保存。
全ユーザのユーザネームと照合して、一致したら出力するという簡単なシステムを作る。
まずは、以下の保存用データベースを用意する。
実装
コードが長くなってしまったので、重要なところだけ抜粋する。
まず、入力フォームを作る。
SearchViewController.swift
import UIKit
import Firebase
let w6 = UIScreen.main.bounds.size.width
let h6 = UIScreen.main.bounds.size.height
class SearchViewController: UIViewController {
//DB参照作成
var ref: DatabaseReference!
//ログインユーザUID取得
let user = Auth.auth().currentUser?.uid
//ユーザネーム入力欄
let UserSearchname = UITextField(frame: CGRect(x: (w6 - 300) / 2, y: 200, width: 300, height: 50))
override func viewDidLoad() {
super.viewDidLoad()
//UIScrollView初期設定
let scView = UIScrollView(frame: CGRect(x: 0 , y: 0, width: w6, height: h6))
scView.backgroundColor = .white
scView.isPagingEnabled = false
//ユーザネーム入力欄の設定
UserSearchname.layer.cornerRadius = 5.0
UserSearchname.layer.borderColor = UIColor.black.cgColor
UserSearchname.layer.borderWidth = 1.0
scView.addSubview(UserSearchname)
//始めるボタン
let wb = UIButton(frame: CGRect(x: (w4 - 100) / 2, y: 300, width: 100, height: 50))
wb.setTitle("検索", for: UIControlState())
wb.backgroundColor = .red
wb.addTarget(self, action: #selector(SearchViewController.SearchData(_:)), for: .touchUpInside)
scView.addSubview(wb)
view.addSubview(scView)
navigationItem.title = "検索"
}
@objc func SearchData(_ :UIButton) {
//DBインスタンス作成
ref = Database.database().reference()
//検索データを追加
self.ref.child("SearchWord").child(self.user!).setValue(["Word": UserSearchname.text!])
let vc = AnotherUserViewController(titleName: "Anothor")
navigationController?.pushViewController(vc, animated: true)
}
}
次に、UITabBarに画面遷移を反映させる。
let vc3 = SearchViewController()
let thirdViewController = vc3
thirdViewController.tabBarItem = UITabBarItem(tabBarSystemItem: UITabBarSystemItem.search, tag: 3)
viewControllers.append(thirdViewController)
let nv3 = UINavigationController(rootViewController: vc3)
self.setViewControllers([nv, nv2, nv3], animated: false)
次に、検索対象のユーザのページを出力する画面を作成する。
コードは、ユーザページのコードを使って改造した。
今回はViewに表示すると真っ黒になってしまうので、全てUIScrollViewに格納して、表示させる。
//UIScrollView初期設定
let scView = UIScrollView(frame: CGRect(x: 0 , y: 0, width: w7, height: h7))
//未発見用UIScrollView初期設定
let erscView = UIScrollView(frame: CGRect(x: 0 , y: 0, width: w7, height: h7))
erscView.backgroundColor = .white
erscView.isPagingEnabled = false
まずは、usercountから全ユーザ数を取得する。
//ログイン情報取得
let user = Auth.auth().currentUser
if let user = user {
//usercountからカウントデータを取得
let usercount = self.ref.child("usercount/count")
usercount.observe(DataEventType.value, with: { (snapshot) in
let usercountStr = snapshot.value as? String
let usercountInt = Int(usercountStr!)
for u in 1 ... usercountInt! {
.....
//中略
}
その後、SearchWordから検索ワードを取得し、ユーザネームと照合する。
//SearchWordから検索ワードを取得
let SearchUser = self.ref.child("SearchWord/\(user.uid)/Word")
SearchUser.observe(DataEventType.value, with: { (snapshot) in
let searchuserStr = snapshot.value as? String
//user/usernameにあるユーザネームを取得
let userName = self.ref.child("user/\(u)/username")
userName.observe(DataEventType.value, with: { (snapshot) in
let Namestr = snapshot.value as? String
//ユーザ未発見カウント
var userSearchNull = 1
//ユーザネームが検索ワードと同じ
if searchuserStr == Namestr! {
//中略
ユーザが見つからなかった場合(ユーザ未発見カウントがusercountの数値と同じ)、未発見メッセージを出す。
} else {
print("対象ユーザ不一致")
userSearchNull += 1
if u == userSearchNull {
let userNull = UILabel(frame: CGRect(x: (w7 - 200) / 2, y: (h7 - 20) / 2, width: 200, height: 50))
userNull.text = "見つかりませんでした。"
userNull.textAlignment = .center
//未発見用UIScrollViewを出力する。
erscView.addSubview(userNull)
self.view.addSubview(erscView)
}
}
画像の取得のところで、ユーザネームと一言メッセージを取得し、表示させる。
//imgcountのカウントデータ値の存在確認
let imgCount = self.ref.child("imgcount/\(imgUIDStr!)/count")
imgCount.observe(DataEventType.value, with: { (snapshot) in
let Count = snapshot.value
var Countstr = Count as? String
if Countstr == nil {
//存在しない場合はエラー
print("nil(imgcount)")
} else {
self.scView.backgroundColor = .white
self.scView.isPagingEnabled = false
//ユーザネームと一言メッセージを取得
let usernameData = self.ref.child("user/\(u)/username")
let usermsgData = self.ref.child("user/\(u)/msg")
usernameData.observe(DataEventType.value, with: { (snapshot) in
let username = snapshot.value as? String
let usernameStr = username!
let usernameLabel = UILabel(frame: CGRect(x: (w2 - 300) / 2, y: 70, width: 300, height: 40))
usernameLabel.text = "\(usernameStr)"
usernameLabel.textColor = .black
usernameLabel.textAlignment = .center
self.scView.addSubview(usernameLabel)
})
usermsgData.observe(DataEventType.value, with: { (snapshot) in
let usermsg = snapshot.value as? String
let usermsgStr = usermsg!
let usermsgLabel = UILabel(frame: CGRect(x: (w2 - 300) / 2, y: 100, width: 300, height: 60))
usermsgLabel.text = "\(usermsgStr)"
usermsgLabel.textColor = .black
usermsgLabel.textAlignment = .center
self.scView.addSubview(usermsgLabel)
})
完成
フォロー機能に関しては、次回実装する。今回は、表示されない。
・ 入力フォーム
・ 検索対象発見
・ 検索対象が見つからなかった
感想
たぶん、今まで作ったものを使えば、今回はそんなに難しくないはずです。
それよりも、フォロー機能がめちゃめちゃ大変だった・・・。
次回、紹介します。。。
次回
【iOS】プログラミング素人の俺が、Swift + Firebaseを使って、インスタクローンを作る！【フォロー/フォロワー機能編】