ซ่อนข้อมูลลับตอน switch app ใน iOS แบบหล่อเท่ ด้วย Snapshot image

สวัสดีชาวโลก กลับมาพบกันอีกแล้วในปีนี้ สำหรับ blog นี้ก็เป็น blog ที่ 4 ของปีนี้แล้ว เป็นปีที่ปล่อย blog ออกมาเยอะสุดละ (ไม่รู้เพราะว่างหรือเรามันเทพขึ้น ฮันน่อวววว)

สำหรับ blog นี้ก็ตามหัวข้อเลยเนอะ เราจะพาทุกคนซ่อนข้อมูลแอพตอน switch app ด้วยสิ่งที่เรียกว่า Snapshot image (คิดว่ามันเรียกว่างี้นะ)

สำหรับสิ่งที่จะพูดถึงใน blog นี้ก็จะมี

• Snapshot image คืออะไร
• การนำไป implement ใน project

มาเริ่มที่หัวข้อแรกกันเลย Snapshot image คืออะไร

พอได้ยินชื่อแล้ว อาจจะมีคนงงๆ ว่าสิ่งนี้คืออะไร อยากให้ทุกคนนึกถึงพวกแอพธนาคาร เวลาที่เรา switch app นะ ละแอพธนาคารจะมีเหมือนหน้ากากมาบังไว้ตามภาพด้านล่าง

เอาล่ะ พอได้รู้จักและเห็นภาพกันแล้ว เรามาดูโค้ดกันเลยว่ามีส่วนไหนที่เราต้องไป implement ใน project บ้าง

การนำไป implement ใน project

ในส่วนของไฟล์ AppDelegate เราจะ implement code ใน
func applicationWillResignActive(_ application: UIApplication) และ
func applicationDidBecomeActive(_ application: UIApplication)

มาดูโค้ดในส่วนของ func applicationWillResignActive(_ application: UIApplication) กันก่อนเลย

func applicationWillResignActive(_ application: UIApplication) {
  let backgroundImageView = UIImageView()
  backgroundImageView.tag = 111
  backgroundImageView.image = UIImage(named: "irene")
  guard let window = window else { return }
  backgroundImageView.frame = window.frame
  window.addSubview(backgroundImageView)
  window.bringSubviewToFront(backgroundImageView)
  backgroundImageView.alpha = 0
  UIView.animate(withDuration: 0.2, animations: {
    backgroundImageView.alpha = 1
  })
}

จากโค้ด func applicationWillResignActive จะถูกเรียกทุกครั้งที่ user ทำการ switch app (become inactive)
1. เราจะสร้าง image view ขึ้น
2. เพิ่มเลข tag ให้กับ image view ที่เราพึ่งสร้างขึ้นมาในตย. จะเป็น 111
3. ให้ image view มี size เดียวกันกับ frame ของ window
4. add image view เข้าไปเป็น subview ของ window และมาอยู่ด้านหน้าสุด
5. set alpha เป็น 0 ไว้ และใน animate ค่อยให้ alpha เป็น 1

จากนั้นมาดูโค้ดส่วน func applicationDidBecomeActive(_ application: UIApplication) กัน

func applicationDidBecomeActive(_ application: UIApplication) {
  guard let background = window?.viewWithTag(111) else { return }
  UIView.animate(withDuration: 0.2, animations: {
    background.alpha = 0
  }, completion: { _ in
    background.removeFromSuperview()
  })
}

จากโค้ด func applicationDidBecomeActive จะถูกเรียกทุกครั้งที่ user ทำการ switch app กลับมาที่ app เรา (become active)
1. เราจะ get view จากเลข tag ที่เรากำหนดไว้ก่อนซึ่งก็คือ 111
2. ใน animate เราจะ set alpha ให้เป็น 0
3. และเมื่อ animate เสร็จ เราจะ remove view นี้ออกจาก superview

implement แค่นี้เราก็จะได้ Snapshot image ไว้บังข้อมูลลับแบบหล่อเท่แล้ว

NOTE: สำหรับคนที่ใช้ SceneDelegate จะต้อง implement ใน
func sceneDidBecomeActive(_ scene: UIScene) และ
func sceneWillResignActive(_ scene: UIScene)

สำหรับ blog นี้ก็มีเนื้อหาเพียงเท่านี้หวังว่าจะเป็นประโยชน์กับคนที่ได้เข้ามาอ่าน และนำท่าหล่อเท่แบบนี้ไปใช้ในแอพตัวเอง 😬😬😬