昨天介紹了原生提供的只能帶入一組帳密的程式碼，今天要介紹如何結合 TableView 實現多個選擇的效果。

p.s 如果忘記怎麼建 TableView 的，可以參考 這篇文章，文中介紹的是 Storyboard + TableView 的建法

在 TableView、TableViewCell 的部分

在 Storyboard 拉好自己要的畫面樣式

在 CredentialProviderViewController 的部分

1. 先令好要呈現在 TableView 的結構樣式

   此為假資料的寫法。若之後要串接 SQL，則用 SQL 的結構即可

   

2. 宣告陣列型態，使它符合 ListModel 的架構

   var listArray = [ListModel]()

3. 在 viewDidLoad 裡給定資料

   

4. 回傳 TableViewCell 的 count
   

5. 顯示在 TableViewCell 的內容
   

6. 點選 TableViewCell，會將帳號、密碼帶入需填寫的輸入框內
   

7. 取消的部分，就用原生的方法
   

這樣就大功告成啦！

完整程式碼

CredentialProviderViewController.swift

import AuthenticationServices

struct ListModel: Identifiable {
    
    var id = UUID().uuidString
    
    var account: String         // 帳號
    
    var password: String        // 密碼
}

class CredentialProviderViewController: ASCredentialProviderViewController, UITableViewDelegate, UITableViewDataSource {

// MARK: - IBOutlet
    @IBOutlet weak var urlLabel: UILabel!
    @IBOutlet weak var listTableView: UITableView!
    
    var listArray = [ListModel]()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        listArray = [
            ListModel(account: "test01", password: "123"),
            ListModel(account: "test02", password: "456"),
            ListModel(account: "test03", password: "789"),
        ]
    }
	
// MARK: - IBAction 取消
	@IBAction func cancel(_ sender: AnyObject?) {
        self.extensionContext.cancelRequest(withError: NSError(domain: ASExtensionErrorDomain, code: ASExtensionError.userCanceled.rawValue))
    }
	
// MARK: - UITableViewDelegate, UITableViewDataSource
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        
        return listArray.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        guard let cell = tableView.dequeueReusableCell(withIdentifier: MainTableViewCell.identifier,
                                                       for: indexPath) as? MainTableViewCell
        else {
            fatalError("PasswordListTableViewCell 載入失敗")
        }
        
        cell.accountLabel.text = listArray[indexPath.row].account
        
        cell.passwordLabel.text = listArray[indexPath.row].password
        
        return cell
    }
    
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        
        let passwordCredential = ASPasswordCredential(user: listArray[indexPath.row].account,
                                                      password: listArray[indexPath.row].password)
        
        self.extensionContext.completeRequest(withSelectedCredential: passwordCredential,
                                              completionHandler: nil)
    }
}

MainTableViewCell.swift

import UIKit

class MainTableViewCell: UITableViewCell {

    @IBOutlet weak var accountLabel: UILabel!
    @IBOutlet weak var passwordLabel: UILabel!
    
    static let identifier = "MainTableViewCell"
    
    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }
    
}

這樣就完成 Storyboard 版的 AutoFill 了，明天將會介紹如何將 AutoFill 畫面改用 Xib 去呈現。

GitHub - StoyrboardAutofillDemo