จัดการทรัพยากร UI ของแอปด้วย Resource Manager

Resource Manager เป็นหน้าต่างเครื่องมือสำหรับนำเข้า สร้าง จัดการ และ ใช้ทรัพยากรในแอป หากต้องการเปิดหน้าต่างเครื่องมือ ให้เลือก ดู > หน้าต่างเครื่องมือ > Resource Manager จากเมนู หรือเลือก Resource Manager ในแถบด้านข้างทางซ้าย

รูปที่ 1 หน้าต่างเครื่องมือ Resource Manager

1. คลิกเพิ่ม เพื่อเพิ่มทรัพยากรใหม่ลงในโปรเจ็กต์ คุณสามารถเพิ่มชิ้นงานรูปภาพ ชิ้นงานเวกเตอร์ ฟอนต์ หรือไฟล์และค่าทรัพยากร หรือจะนำเข้า Drawable ไปยังโปรเจ็กต์ก็ได้
2. เลือกโมดูลเพื่อดูแหล่งข้อมูลที่เกี่ยวข้องกับโมดูลนั้นๆ
3. ค้นหาทรัพยากรในทุกโมดูลในโปรเจ็กต์ โดยใช้แถบค้นหา
4. แสดงทรัพยากรตาม ประเภทใน Resource Manager ใช้แท็บเหล่านี้เพื่อสลับระหว่างประเภททรัพยากร คลิกไอคอนล้น เพื่อแสดงประเภททรัพยากรเพิ่มเติม
5. กรองทรัพยากรที่แสดงจากโมดูลที่ขึ้นต่อกันในเครื่อง ไลบรารีภายนอก และเฟรมเวิร์ก Android โดยใช้ปุ่มตัวกรอง นอกจากนี้ คุณยังใช้ตัวกรองเพื่อแสดงแอตทริบิวต์ธีมได้ด้วย
6. ดูตัวอย่างทรัพยากรในพื้นที่เนื้อหาหลัก คลิกขวา ที่ทรัพยากรเพื่อดูเมนูตามบริบทที่คุณสามารถเปลี่ยนชื่อ ทรัพยากรและค้นหาในแอปว่ามีการใช้ทรัพยากรที่ใด
7. คลิกปุ่มเหล่านี้เพื่อดูทรัพยากรเป็นไทล์หรือรายการ
8. คลิกปุ่มเหล่านี้เพื่อเปลี่ยนขนาดตัวอย่างของทรัพยากร

นอกจากฟีเจอร์เหล่านี้แล้ว Resource Manager ยังมีวิธีนำเข้า Drawable หลายรายการพร้อมกันลงในโปรเจ็กต์ด้วย หากต้องการนำเข้าหลายรายการพร้อมกัน คุณสามารถทำอย่างใดอย่างหนึ่งต่อไปนี้

• ลากไฟล์รูปภาพ รวมถึงไฟล์ SVG ไปยัง เครื่องมือจัดการทรัพยากรโดยตรง
• ใช้ตัวช่วยสร้างนำเข้า Drawable

ดูข้อมูลเพิ่มเติมได้ที่ส่วนนำเข้า Drawable ไปยังโปรเจ็กต์

หากต้องการดูข้อมูลโดยละเอียดเพิ่มเติม ให้ดับเบิลคลิกทรัพยากรใน Resource Manager หากคุณมีทรัพยากรหลายเวอร์ชัน มุมมองแบบละเอียดนี้ จะแสดงแต่ละเวอร์ชันพร้อมกับตัวระบุที่เกี่ยวข้อง ดังที่แสดงใน รูปที่ 2 จากตรงนี้ คุณสามารถดับเบิลคลิกเวอร์ชันที่ต้องการเพื่อเปิดในหน้าต่างเอดิเตอร์ได้

รูปที่ 2 Resource Manager แสดงเวอร์ชันของทรัพยากรรูปภาพสำหรับ ความหนาแน่นของหน้าจอที่แตกต่างกัน

นำเข้า Drawable ไปยังโปรเจ็กต์

คุณใช้เครื่องมือจัดการทรัพยากรเพื่อนำเข้าทรัพยากรรูปภาพไปยังโปรเจ็กต์ได้ ดูรายการประเภทรูปภาพที่รองรับได้ที่ การรองรับรูปภาพ

หากต้องการนำเข้าแหล่งข้อมูลรูปภาพไปยังโปรเจ็กต์ ให้ทำดังนี้

1. ลากรูปภาพไปยังหน้าต่างเครื่องมือจัดการทรัพยากรใน Android Studio โดยตรง

   • หรือคุณจะทำสิ่งต่อไปนี้ก็ได้
     1. คลิกไอคอนบวก (+)
     2. เลือกนำเข้า Drawable ดังที่แสดงในรูปที่ 3
     3. เลือกไฟล์และโฟลเดอร์ที่ต้องการนำเข้า

   

   รูปที่ 3 เลือกนําเข้า Drawable จากเมนู

2. กล่องโต้ตอบนำเข้า Drawable จะปรากฏขึ้น ดังที่แสดงในรูปที่ 4 กล่องโต้ตอบนี้ จะแสดงรายการทรัพยากรที่คุณกำลังนำเข้า คุณเปลี่ยนชื่อทรัพยากรได้ โดยคลิกกล่องข้อความเหนือตัวอย่างของทรัพยากร

   หากคุณมีทรัพยากรเดียวกันหลายเวอร์ชัน ให้เพิ่มตัวระบุการกำหนดค่าอุปกรณ์ตามที่อธิบายไว้ในส่วนต่อไปนี้ ซึ่งจะอธิบายการกำหนดค่าที่เฉพาะเจาะจงที่แต่ละทรัพยากรรองรับ

   เช่น หากคุณมีทรัพยากรเดียวกันหลายเวอร์ชันสำหรับความหนาแน่นของหน้าจอที่แตกต่างกัน คุณสามารถเพิ่มตัวระบุความหนาแน่นสำหรับแต่ละเวอร์ชันได้ โปรดทราบว่าหากทรัพยากร 2 รายการขึ้นไปมีชื่อและ ตัวระบุเดียวกัน ระบบจะนำเข้าเพียงเวอร์ชันเดียว

   ดูข้อมูลเพิ่มเติมเกี่ยวกับตัวระบุทรัพยากรได้ที่การระบุทรัพยากรอื่น

   

   รูปที่ 4 กล่องโต้ตอบนำเข้า Drawable

   เมื่อตั้งชื่อทรัพยากรและเพิ่มตัวระบุที่จำเป็นแล้ว ให้คลิกถัดไป

3. หน้าจอถัดไปจะแสดงสรุปของแหล่งข้อมูลที่คุณกำลังนำเข้า เมื่อพร้อมนำเข้า ให้คลิกนำเข้า

ในหน้าต่างเครื่องมือจัดการทรัพยากร ตอนนี้คุณก็พร้อมที่จะใช้ทรัพยากรในโปรเจ็กต์แล้ว ดังที่แสดงในรูปที่ 5

รูปที่ 5 ตอนนี้เครื่องมือจัดการทรัพยากรจะแสดงรูปภาพที่คุณนำเข้าแล้ว

แยกวิเคราะห์ความหนาแน่นของ Drawable โดยอัตโนมัติ

เมื่อคุณนำเข้าไฟล์หรือโฟลเดอร์และเส้นทางมีตัวระบุความหนาแน่น เครื่องมือจัดการทรัพยากรจะใช้ตัวระบุความหนาแน่นโดยอัตโนมัติเป็นส่วนหนึ่งของ การนำเข้า Resource Manager สามารถแยกวิเคราะห์ทั้งตัวระบุความหนาแน่นของ Android และ ปัจจัยการปรับขนาดของ iOS

ตารางนี้แสดงวิธีแสดงความหนาแน่นต่างๆ ที่รองรับสำหรับ Android และ iOS

ความหนาแน่น	ตัวระบุความหนาแน่นของ Android	ปัจจัยการปรับขนาด iOS
ความหนาแน่นต่ำ (~120 dpi)	ldpi	ไม่รองรับ
ความหนาแน่นปานกลาง (~160 dpi)	mdpi	สเกลเดิม
ความหนาแน่นสูง (~240 dpi)	hdpi	ไม่รองรับ
ความหนาแน่นสูงพิเศษ (~320 dpi)	xhdpi	@2x
ความหนาแน่นสูงมาก (~480 dpi)	xxhdpi	@3x
ความหนาแน่นสูงมาก (ประมาณ 640 dpi)	xxxhdpi	@4x

ตัวอย่างวิธีที่เส้นทางอินพุตแปลงเป็นเส้นทางทรัพยากรหลังการนำเข้ามีดังนี้

ตัวระบุความหนาแน่นของ Android: hdpi

เส้นทางอินพุต: /UserFolder/icon1/hdpi/icon.png
เส้นทางทรัพยากร: <projectFolder>/<moduleFolder> /src/main/res/drawable-hdpi/icon.png

ตัวระบุความหนาแน่นของ Android: xxhdpi

เส้นทางอินพุต: /UserFolder/icon1/abc-xxhdpi/icon.png
เส้นทางทรัพยากร: <projectFolder>/<moduleFolder> /src/main/res/drawable-xxhdpi/icon.png

ค่าตัวคูณมาตราส่วน iOS: @2x

เส้นทางอินพุต: /UserFolder/icon1/icon@2x.png
เส้นทางทรัพยากร: <projectFolder>/<moduleFolder> /src/main/res/drawable-xhdpi/icon.png

ค่าตัวคูณมาตราส่วน iOS: @2x

เส้นทางอินพุต: /UserFolder/icon1/icon@2x_alternate.png
เส้นทางทรัพยากร: <projectFolder>/<moduleFolder> /src/main/res/drawable-xhdpi/icon_alternate.png

ดูข้อมูลเพิ่มเติมเกี่ยวกับการรองรับอุปกรณ์ที่มีความหนาแน่นของพิกเซลแตกต่างกันได้ที่ รองรับความหนาแน่นของพิกเซลในระดับต่างๆ

ลาก Drawable ไปยังเลย์เอาต์

คุณลาก Drawable จากเครื่องมือจัดการทรัพยากรไปยังเลย์เอาต์ได้โดยตรง เมื่อลากทรัพยากรไปยังเลย์เอาต์ ตัวจัดการทรัพยากรจะสร้าง ImageView ที่เกี่ยวข้องสำหรับ Drawable นั้น ดังที่แสดงในภาพเคลื่อนไหว 1

ภาพเคลื่อนไหว 1 ลาก Drawable ไปยังเลย์เอาต์ในมุมมองออกแบบ

นอกจากนี้ คุณยังลากไปยัง XML ของเลย์เอาต์ได้โดยตรง ดังที่แสดงใน ภาพเคลื่อนไหว 2

ภาพเคลื่อนไหว 2 ลาก Drawable ไปยังเลย์เอาต์ในมุมมองข้อความ

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

• หากลาก Drawable ไปยังพื้นที่ว่าง Resource Manager จะสร้างImageViewที่เกี่ยวข้อง
• หากคุณลาก Drawable ไปยังแอตทริบิวต์ใดก็ตามใน XML ของเลย์เอาต์ Resource Manager จะแทนที่ค่าแอตทริบิวต์นั้นด้วยการอ้างอิงไปยัง Drawable นอกจากนี้ คุณยังลากทรัพยากรประเภทอื่นๆ ไปยังแอตทริบิวต์ XML เพื่อ แทนที่ค่าแอตทริบิวต์ได้ด้วย
• หากคุณลาก Drawable ไปยังองค์ประกอบ ImageView ที่มีอยู่แล้ว Resource Manager จะแทนที่แอตทริบิวต์แหล่งที่มาที่สอดคล้องกัน