วิธีแก้ไขปัญหา UI ของ iPhone ในโหมดซูมเนื่องจากหน้าจอเปิดใช้
พื้นหลัง
เมื่อสัปดาห์ที่แล้ว เราพบปัญหาแปลกๆ ที่แอป Naukri สำหรับ iOS ทำงานผิดปกติในโหมดซูมบนอุปกรณ์บางเครื่อง
UI เริ่มบิดเบี้ยวและมืดมนรอบๆ แถบการนำทางด้านบนและแถบแท็บด้านล่างแบบสุ่ม
ปัญหา
หลังจากอ่านวิธีแก้ปัญหาและบทความเกี่ยวกับสถานะการซูม เราสังเกตเห็นว่าเมื่อเปิดใช้งานสถานะการซูม แอปจะเริ่มแสดงในโหมดปรับขนาด & เนื่องจากหน้าจอเริ่มต้นของเราไม่ได้รับการปรับให้เหมาะกับหน้าจอขนาดใหญ่ เราจึงพบปัญหา UI
หน้าจอเปิดตัวคืออะไร
ปรากฏขึ้นเมื่อเปิดใช้แอปเป็นครั้งแรกและให้ความรู้สึกว่าแอปของคุณรวดเร็วและตอบสนองได้ดี หลังจากโหลดแอปของคุณแล้ว แอปจะถูกแทนที่ด้วยหน้าจอแรกของแอป
เมื่อเราตรวจสอบตรรกะการใช้งานของอิมเมจเปิดใช้ในโครงการของเรา เราทราบว่ามีการเพิ่มอิมเมจเปิดใช้ขนาดต่างๆ ในไฟล์ xcassets ของเรา
เราคิดเกี่ยวกับการลบและเพิ่มรูปภาพที่แตกต่างกันเพียงเพื่อลองบางสิ่ง จากนั้นเราสังเกตเห็นว่าการเพิ่มหน้าจอเริ่มต้นจาก xcassets เลิกใช้แล้ว
วิธีการแก้
หลังจากดูเอกสารประกอบของ Apple แล้ว เราได้เรียนรู้วิธีที่ถูกต้องในการเพิ่มหน้าจอเปิดในแอป iOS ของคุณ
https://developer.apple.com/documentation/xcode/specifying-your-apps-launch-screen/
จะเพิ่มหน้าจอเริ่มต้นได้อย่างไร?
ก่อน Xcode 6 ตัวเลือกเดียวที่เรามีคือการจัดเตรียมภาพนิ่งภายในแคตตาล็อกเนื้อหา ต่อมาด้วย iOS 8 Xcode อนุญาตให้เราแทนที่ภาพนิ่งด้วยไฟล์สตอรี่บอร์ด ด้วยเวลาและการอัปเดตใหม่ หลายตัวเลือกและคุณสมบัติถูกเพิ่มเข้ามาเรื่อยๆ สำหรับหน้าจอเปิดใช้
สำหรับ Xcode 12 ขึ้นไป มีสองวิธีในการเปิดใช้หน้าจอ:
- การใช้กระดานเรื่องราว (ค่าเริ่มต้น) เพิ่มเมื่อคุณสร้างโครงการใหม่
- โดยใช้การ
plist
กำหนดค่า
ใช้การplist
กำหนดค่าที่คุณสามารถตั้งค่า:
- รูปภาพ
- ภาพเปิดตัวควรเป็นไปตามพื้นที่ปลอดภัยหรือไม่
- พื้นหลังสี
- การมองเห็นแถบนำทาง
- การมองเห็นแถบแท็บ
- การมองเห็นแถบเครื่องมือ
- เปิดใช้งานการกำหนดค่าหน้าจอตามรูปแบบ URL
- ในการตั้งค่าสำหรับเป้าหมายของคุณ เลือกแท็บข้อมูล
- ในส่วนคุณสมบัติเป้าหมาย iOS แบบกำหนดเอง ให้ขยายปุ่ม Launch Screen
- คลิกปุ่มเพิ่ม (+) พิมพ์
UILaunchScreen
และกด Return เพื่อเพิ่มปุ่มเปิดหน้าจอไปยังรายการคุณสมบัติ หากมีUILaunchScreen
คีย์อยู่แล้ว ให้ข้ามขั้นตอนนี้ไป - เลือก
UILaunchScreen
คีย์ คลิกปุ่มเพิ่ม (+) และเพิ่มคีย์เพิ่มเติมเพื่อระบุตัวเลือกการกำหนดค่าสำหรับหน้าจอเริ่มต้นของคุณ
การใช้ไฟล์สตอรี่บอร์ด
หากคุณสร้างแอป iOS จากเทมเพลตสตอรีบอร์ด Xcode จะเพิ่มไฟล์เริ่มต้นของหน้าจอเริ่มต้นที่เรียกว่าLaunchScreen.storyboard
ลงในโปรเจ็กต์ของคุณ แก้ไขLaunchScreen.storyboard
เพื่อกำหนดค่าหน้าจอเริ่มต้นของคุณ
หากโปรเจ็กต์ของคุณไม่มีไฟล์หน้าจอเปิดใช้เริ่มต้น ให้เพิ่มไฟล์หน้าจอเปิดใช้และตั้งค่าไฟล์เปิดหน้าจอสำหรับเป้าหมายในตัวแก้ไขโปรเจ็กต์
- เลือก ไฟล์ > ใหม่ > ไฟล์
- ภายใต้ User Interface เลือก Launch Screen แล้วคลิก Next
- ตั้งชื่อไฟล์หน้าจอเรียกใช้งาน เลือกตำแหน่ง เลือกเป้าหมายที่คุณต้องการเพิ่มไฟล์ และคลิก สร้าง
- ในการตั้งค่าสำหรับเป้าหมายของคุณ เลือกแท็บทั่วไป และค้นหาส่วน "ไอคอนแอปและเปิดรูปภาพ"
- จากเมนูป๊อปอัพเปิดไฟล์หน้าจอ ให้เลือกไฟล์เปิดหน้าจอใหม่
หน้าจอเปิดใช้จะถูกแคชอย่างมากใน iOS เพื่อปรับปรุงประสิทธิภาพ ดังนั้นเพื่อวัตถุประสงค์ในการพัฒนาและทดสอบ คุณต้องลบแอปและรีสตาร์ทอุปกรณ์ (หรือโปรแกรมจำลอง)
นอกจากนี้ คุณยังสามารถเพิ่มโหมดสลีป (5) ใน didFinishLaunchingWithOptions ระหว่างการพัฒนาหน้าจอเปิดใช้ การหน่วงเวลาอาจมีประโยชน์ในการดูการออกแบบที่ใช้งานของคุณนานขึ้น
ขอบคุณมากสำหรับการอ่าน…!
อ้างอิง:
https://developer.apple.com/documentation/xcode/specifying-your-apps-launch-screen/