เมื่อ UIAlertController มีรูปแบบที่ไม่เพียงพอต่อการใช้งานของเรา

เมื่อเราต้องการแสดง Popup dialog ต่างๆ เราสามารถใช้ UIAlertViewController ได้ แต่ถ้าหากเราต้องการที่จะให้ Dialog ของเรา สามารถทำอะไรได้มากขึ้น แน่นอนว่าเราต้องเขียนโค้ดเพื่อที่จะสั่งมันทำงานได้ตามที่ใจเราต้องการ เนื่องด้วยข้อจำกัดของ UIAlertViewController ที่มีลักษณะไม่กี่แบบ ดังนั้นเรามาสร้าง ViewController ซึ่งแสดงผลแบบ Popup dialog กันดีกว่า

ก่อนอื่น มาดู UIAlertController แบบต่างๆกันก่อนดีกว่า

1. แบบ Default คือมี Title, message และ Button ซ้ายและขวาดังตัวอย่าง

2. แบบ Plain Text มีการเพิ่ม UITextField เข้ามา เพื่อใช้สำหรับรับค่าจากผู้ใช้งาน

3. แบบ Login Form มี UITextField มีสองช่องให้กรอก ในตัวอย่างจะเป็น Email และ Password

4. แบบ Multiple Buttons จะสามารถเพิ่มปุ่มได้หลายๆปุ่ม

แต่ถ้าหากเราต้องการที่จะให้ Popup dialog สามารถทำหน้าที่ได้มากกว่านั้น เราสามารถสร้าง ViewController ที่มีหน้าตาเสมือนกับ Popup ได้เช่นกัน มาดูตัวอย่างหน้าจอที่ผมจะใช้อ้างอิง

เมื่อกดปุ่ม Open popup จะให้แสดง Dialog ที่ประกอบไปด้วยรูปภาพ ข้อความประกอบ TextField และปุ่มต่างๆ

มาเริ่มลงมือกันเลยดีกว่า ขั้นตอนแรกเราจะสร้าง ViewController ขึ้นมาสองตัว หน้าแรกมีหน้าที่แสดงปุ่มที่กดแล้วให้เปิด Dialog ขึ้นมา ส่วนหน้าที่สองให้เราสร้างหน้าจอที่เราต้องการให้ Popup Dialog มีหน้าตาแบบที่เราต้องการ

ได้หน้าจอหล่อๆมาแล้ว

ลาก segue จากปุ่ม Open popup ไปยัง ViewController ปลายทาง และเลือก Action เป็น Present Modally

ลองเช็คที่ segue ของเรา จะได้ Attribute เป็น Present Modally ดังตัวอย่าง จากนั้นให้เราติ้กตรง Animates ออก เพื่อให้ดูเป็น Popup มากขึ้น

ลองไปดูหน้าจอที่เราจะใช้เป็น Popup dialog ให้เราไปตั้งค่า Attribute ของ ViewController โดยเลือก Presentation เป็น Over Current Context

มาถึงขั้นตอนนี้ เราก็จะได้หน้า Popup dialog เรียบร้อยแล้ว มาปรับพื้นหลังให้โปร่งใสกันอีกหน่อยดีกว่า

พื้นหลังทึบไปหน่อย

ก่อนอื่น ต้องไปตั้งค่า Alpha View ที่เป็น Background ก่อน ในรูปผมเลือกที่ประมาณ 0.8

สำหรับผู้ที่ไม่ต้องการใช้ Segue ก็สามารถเขียนโค้ดเพื่อเปิด View ที่ให้ความรู้สึกเหมือน Popup

let modalViewController = self.storyboard?.instantiateViewController(withIdentifier: "ModalViewController") as! ModalViewController
 modalViewController.modalPresentationStyle = .overCurrentContext
 present(modalViewController, animated: false, completion: nil)

หลังจากที่เราสามารถเปิดหน้า Popup ขึ้นมาได้แล้ว เราก็สามารถเขียนโค้ดให้หน้า Popup ของเราสามารถทำสิ่งต่างๆที่เกินขีดจำกัดของ UIAlertController ได้แล้ว

สรุปบทความนี้ก็คือ เราไม่ได้ทำการ Custom UIAlertController แต่เราสร้าง ViewController ที่ให้ความรู้สึกเดียวกับการเปิด UIAlertController ขึ้นมา โดยที่ผู้ใช้ไม่รู้สึกถึงความแตกต่างและยังสามารถทำงานได้หลากหลายกว่า UIAlertController แบบปกติ