前回

【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を使って、インスタクローンを作る！【フォロー/フォロワー機能編】

【iOS】プログラミング素人の俺が、Swift + Firebaseを使って、インスタクローンを作る！【超簡易検索機能編】

目次

前回

自分以外のページを閲覧するために、超簡易検索機能を実装する

DataBase

実装

完成

感想

次回