อินเทอร์เฟซผู้ใช้ (UI) ของการยืนยันที่ได้รับการปกป้องประกอบด้วยองค์ประกอบที่จำเป็น 6 อย่าง คุณปรับแต่งองค์ประกอบบางอย่างได้ แต่ต้องเป็นไปตามข้อกำหนดบางอย่าง โปรดใช้หลักเกณฑ์ต่อไปนี้เมื่อปรับแต่ง UI และตรวจสอบว่า เป็นไปตามข้อกำหนด หากองค์ประกอบมีเครื่องหมาย ข้อกำหนด: องค์ประกอบนั้นต้องใช้ พร็อพเพอร์ตี้ที่ระบุ
หลักเกณฑ์ต่อไปนี้ใช้ชุดแบบอักษร Roboto ซึ่งคุณสามารถดาวน์โหลดได้จาก Google Fonts
UI ที่มีปุ่มฮาร์ดแวร์
การยืนยันที่ได้รับการปกป้องของ Android สามารถใช้ปุ่มฮาร์ดแวร์ในอุปกรณ์เพื่อ ยืนยันและยกเลิกอินพุตได้
รูปที่ 1 เลย์เอาต์การออกแบบ
ไอคอน
ส่วนนี้อธิบายไอคอนที่ใช้ใน UI
ไอคอนโล่
| ไอคอน |  |
|---|---|
| ดาวน์โหลด | เกราะคุ้มครองความปลอดภัย |
| ขนาดไอคอน | 32dp |
ไอคอนลูกศร
| ไอคอน |  |
|---|---|
| ดาวน์โหลด | ลูกศรขวาบนแป้นพิมพ์ |
| ขนาดไอคอน | 24dp |
| รัศมีมุมของคอนเทนเนอร์ | 4dp |
ป้อนข้อความ
การยืนยันที่ปกป้องความเป็นส่วนตัวใช้การป้อนข้อมูล 2 ประเภท ได้แก่ ยืนยันและยกเลิก
สตริงยืนยัน
ข้อความต้องระบุว่าใช้ปุ่มใดเป็นการยืนยัน
| ข้อความ | กด (ปุ่ม) 2 ครั้งเพื่อยืนยัน |
|---|---|
| ความยาวสูงสุด | ข้อกำหนด: ข้อความยืนยันต้องไม่เกิน 2 บรรทัด |
| สี | #000000 87% |
| แบบตัวอักษร | Roboto-Medium |
| ขนาดแบบอักษร | ข้อกำหนด: 14sp |
| ความสูงของบรรทัด | ข้อกำหนด: 20dp |
ยกเลิกสตริง
ข้อความยกเลิกต้องมองเห็นได้อย่างชัดเจนและแยกออกจากปุ่มยืนยันได้ง่าย ใช้พร็อพเพอร์ตี้ต่อไปนี้ร่วมกับคำเดียวว่ายกเลิก
| ข้อความ | ยกเลิก |
|---|---|
| สี | #000000 87% |
| แบบตัวอักษร | Roboto-Medium |
| ขนาดแบบอักษร | ข้อกำหนด: 14sp |
| ความสูงของบรรทัด | ข้อกำหนด: 20dp |
ข้อความส่วนหัว
ใส่ข้อความส่วนหัว Android Protected Confirmation ใน UI ที่เชื่อถือได้เพื่อระบุฟีเจอร์ ใช้พร็อพเพอร์ตี้ต่อไปนี้สำหรับข้อความส่วนหัว
| ข้อความ | ข้อกำหนด: Android Protected Confirmation |
|---|---|
| สี | #000000 87% |
| แบบตัวอักษร | Roboto-Regular |
| ขนาดแบบอักษร | ข้อกำหนด: 22sp |
| ความสูงของบรรทัด | ข้อกำหนด: 28dp |
ข้อความเนื้อหา
ใช้พร็อพเพอร์ตี้ต่อไปนี้เมื่อใช้องค์ประกอบข้อความเนื้อหา นักพัฒนา API (นักพัฒนาแอป) เป็นผู้เขียนข้อความจริง
| ข้อความ | ข้อความเนื้อหาได้รับจากนักพัฒนาแอปที่เรียกใช้ การยืนยันที่ได้รับการปกป้อง |
|---|---|
| สี | #000000 87% |
| แบบตัวอักษร | Roboto-Regular |
| ขนาดแบบอักษร | ข้อกำหนด: 16sp |
| ความสูงของบรรทัด | ข้อกำหนด: 24dp |
ข้อความส่วนหัวย่อย
ใช้ข้อความส่วนหัวย่อยเพื่ออธิบายเหตุผลที่ผู้ใช้เห็นหน้าจอการยืนยันที่ได้รับการปกป้อง วางข้อความนี้ที่ด้านล่างของหน้าจอและใช้พร็อพเพอร์ตี้ต่อไปนี้
| ข้อความ | ข้อกำหนด: การยืนยันนี้จะช่วยเพิ่มระดับความปลอดภัยอีกขั้นสำหรับการดำเนินการที่คุณกำลังจะทำ |
|---|---|
| ความยาวสูงสุด | ข้อกำหนด: ข้อความยืนยัน ต้องมีความยาวไม่เกิน 4 บรรทัด |
| สี | #000000 87% |
| แบบตัวอักษร | Roboto-Regular |
| ขนาดแบบอักษร | ข้อกำหนด: 14sp |
| ความสูงของบรรทัด | ข้อกำหนด: 20dp |
UI ที่มีปุ่มซอฟต์แวร์
การยืนยันที่ได้รับการปกป้องของ Android สามารถใช้ปุ่มซอฟต์แวร์เพื่อ ยืนยันและยกเลิกอินพุตได้ หลักเกณฑ์ต่อไปนี้อธิบาย UI โดยใช้ ปุ่มซอฟต์แวร์
รูปที่ 2 เลย์เอาต์การออกแบบซอฟต์แวร์ UI ยืนยัน
ไอคอนโล่
ดาวน์โหลดชิ้นงานไอคอนที่ Android Protected Confirmation Shield Icon วางไอคอนที่ด้านบนของหน้าจอ
รูปที่ 3 ไอคอนโล่
ไอคอนโล่การยืนยันที่ได้รับการปกป้องเป็นองค์ประกอบที่จำเป็น คุณปรับแต่งสี ของโล่ได้ แต่ต้องมองเห็นได้ชัดเจน
อินพุต
รูปที่ 4 ขนาดปุ่มซอฟต์แวร์
ใช้รูปแบบปุ่มหลักและปุ่มรองสำหรับการป้อนข้อมูลยืนยันและยกเลิก
| ป้ายกำกับปุ่ม | ใช้ตัวพิมพ์ใหญ่เฉพาะคำแรกสำหรับป้ายกำกับปุ่ม |
|---|---|
| รัศมีปุ่ม | 4dp |
| สีเฉพาะจุด | #1a73e8 |
| แบบตัวอักษร | Roboto-Medium |
| ขนาดแบบอักษร | ข้อกำหนด: 14sp |
ข้อความส่วนหัว
ใส่ข้อความส่วนหัว Android Protected Confirmation ใน UI ที่เชื่อถือได้เพื่อระบุฟีเจอร์ ใช้พร็อพเพอร์ตี้ต่อไปนี้สำหรับข้อความส่วนหัว
| ข้อความ | ข้อกำหนด: Android Protected Confirmation |
|---|---|
| สี | #000000 87% |
| แบบตัวอักษร | Roboto-Medium |
| ขนาดแบบอักษร | ข้อกำหนด: 24sp |
| ความสูงของบรรทัด | ข้อกำหนด: 20dp |
ข้อความเนื้อหา
ใช้พร็อพเพอร์ตี้ต่อไปนี้เมื่อใช้องค์ประกอบข้อความเนื้อหา ข้อความจริงเขียนโดยนักพัฒนาแอป
| ข้อความ | ข้อความเนื้อหามาจากนักพัฒนาแอปที่เรียกใช้การยืนยันที่ได้รับการปกป้อง |
|---|---|
| สี | #000000 87% |
| แบบตัวอักษร | Roboto-Medium |
| ขนาดแบบอักษร | ข้อกำหนด: 16sp |
| ความสูงของบรรทัด | ข้อกำหนด: 24dp |
ข้อความส่วนหัวย่อย
ใช้ข้อความส่วนหัวย่อยเพื่ออธิบายเหตุผลที่ผู้ใช้เห็นหน้าจอการยืนยันที่ได้รับการปกป้อง วางข้อความนี้ที่ด้านล่างของหน้าจอและใช้พร็อพเพอร์ตี้ต่อไปนี้
| ข้อความ | ข้อกำหนด: การยืนยันนี้จะช่วยเพิ่มระดับความปลอดภัยอีกขั้นสำหรับการดำเนินการที่คุณกำลังจะทำ |
|---|---|
| ความยาวสูงสุด | ข้อกำหนด: ข้อความยืนยัน ต้องมีความยาวไม่เกิน 4 บรรทัด |
| สี | #000000 54% |
| แบบตัวอักษร | Roboto-Medium |
| ขนาดแบบอักษร | ข้อกำหนด: 14sp |
| ความสูงของบรรทัด | ข้อกำหนด: 20dp |
การแปล
คุณดูการแปลสำหรับคอมโพเนนต์ที่อธิบายไว้ได้ในการใช้งาน C แบบสแตนด์อโลนของ ตารางการค้นหาซึ่งเป็นส่วนหนึ่งของ AOSP