บทแนะนำการออกแบบเลย์เอาต์ Android: ทุกสิ่งที่คุณต้องการรู้

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

ฉันจะพูดคุยเกี่ยวกับหัวข้อด้านล่าง:

• ข้อมูลเบื้องต้นเกี่ยวกับส่วนประกอบ UI
• มุมมอง
• ประเภทของเลย์เอาต์
• หน่วยวัด
• การสาธิต

เริ่มกันเลย!

ถ่ายโอนไฟล์ไปยังอินสแตนซ์ ec2 linux

บทแนะนำการออกแบบเค้าโครง Android: ข้อมูลเบื้องต้นเกี่ยวกับส่วนประกอบ UI

เมื่อพูดถึงส่วนประกอบ UI แล้ว UI ทั่วไปของแอปพลิเคชัน Android ประกอบด้วยส่วนประกอบเหล่านี้:

• แถบการทำงานหลัก
• ดูการควบคุม
• พื้นที่เนื้อหา
• Split Action Bar

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

ปัจจัยสำคัญอีกประการหนึ่งที่ช่วยในการปรับแต่งการออกแบบ UI คือส่วนประกอบมุมมอง

มาดูกันว่า View in คืออะไร

บทแนะนำการออกแบบเค้าโครง Android: มุมมอง

ถึง ดู ถือเป็นส่วนประกอบพื้นฐานสำหรับอินเทอร์เฟซผู้ใช้ที่เหมาะสมซึ่งสร้างขึ้นจากไฟล์ ดูชั้นเรียน . พื้นที่นี้ใช้พื้นที่สี่เหลี่ยมบนหน้าจอและในที่สุดจะดูแลการวาดภาพและการจัดการเหตุการณ์

มุมมองเป็นคลาสพื้นฐานสำหรับวิดเจ็ตซึ่งใช้ในการสร้างส่วนประกอบ UI แบบโต้ตอบเช่นปุ่มช่องข้อความ ฯลฯ ตอนนี้กำลังพูดถึงพื้นที่สี่เหลี่ยมผืนผ้าหรือกล่องอาจเป็นรูปภาพชิ้นส่วนของข้อความปุ่มหรือ ทุกสิ่งที่แอปพลิเคชัน Android สามารถแสดงได้ รูปสี่เหลี่ยมผืนผ้าตรงนี้มองไม่เห็น แต่ทุกมุมมองมีรูปร่างสี่เหลี่ยมผืนผ้า

คุณอาจมีคำถามว่าสี่เหลี่ยมผืนผ้านี้จะมีขนาดเท่าไหร่?

คำตอบคือคุณสามารถตั้งค่าด้วยตนเองโดยระบุขนาดที่แน่นอน (พร้อมหน่วยที่เหมาะสม) หรือโดยใช้ค่าที่กำหนดไว้ล่วงหน้า ค่าที่กำหนดไว้ล่วงหน้าเหล่านี้คือ match_parentand wrap_content นี้ match_parent หมายความว่าจะใช้พื้นที่ทั้งหมดที่มีอยู่บนจอแสดงผลของอุปกรณ์ ในขณะที่ wrap_content หมายถึงมันจะใช้พื้นที่เพียงเท่าที่จำเป็นสำหรับเนื้อหาที่จะแสดง

ตอนนี้เรามาดูความแตกต่างที่สำคัญระหว่าง View และ ViewGroup

ดู

1. ดู วัตถุเป็นส่วนประกอบพื้นฐานขององค์ประกอบ UI ใน Android
2. มุมมองคือกล่องสี่เหลี่ยมผืนผ้าธรรมดาที่ตอบสนองต่อการกระทำของผู้ใช้
3. View หมายถึงคลาส android.view.View ซึ่งเป็นคลาสพื้นฐานของคลาส UI ทั้งหมด
4. ตัวอย่าง ได้แก่ EditText, Button, CheckBox เป็นต้น

ViewGroup

1. ViewGroup คือคอนเทนเนอร์ที่มองไม่เห็นซึ่งเก็บ View และ ViewGroup
2. ViewGroup เป็นคลาสพื้นฐานสำหรับ เลย์เอาต์ .
3. ตัวอย่างเช่น LinearLayout คือ ViewGroup ที่มี Button (View) และ Layouts อื่น ๆ ด้วย

ตอนนี้เรามาทำความเข้าใจกับเลย์เอาต์ที่มีอยู่

บทแนะนำการออกแบบเค้าโครง Android: ประเภทของเลย์เอาต์

ถึง เค้าโครง กำหนดโครงสร้างสำหรับ User Interface ในแอปพลิเคชัน องค์ประกอบทั้งหมดในเค้าโครงสร้างขึ้นโดยใช้ลำดับชั้นของ ดู และ ViewGroup วัตถุ

ตอนนี้เรามาดูวิธีประกาศเค้าโครงกัน

คุณสามารถประกาศเค้าโครงได้สองวิธี:

• ประกาศองค์ประกอบ UI ใน XML Android มีคำศัพท์ XML ที่ตรงไปตรงมาซึ่งสอดคล้องกับคลาส View และคลาสย่อยเช่นสำหรับวิดเจ็ตและเลย์เอาต์

บันทึก: คุณยังสามารถใช้ Layout Editor ของ Android Studio เพื่อสร้างเลย์เอาต์ XML ของคุณโดยใช้อินเทอร์เฟซแบบลากแล้ววาง

• จัดเตรียมองค์ประกอบเค้าโครงที่ เวลาทำงาน . แอปพลิเคชันสามารถสร้างไฟล์ ดู และ ViewGroup ออบเจ็กต์และจัดการคุณสมบัติของมันโดยทางโปรแกรม

เรามาดูประเภทต่างๆของเลย์เอาต์กัน

UI ใน Android เป็นลำดับชั้นของ Views และ ViewGroups ViewGroups จะเป็นโหนดกลางในลำดับชั้นและมุมมองจะเป็นโหนดเทอร์มินัล

• เค้าโครงเชิงเส้น
• เค้าโครงแน่นอน
• เค้าโครงสัมพัทธ์
• เค้าโครงตาราง
• เค้าโครงเฟรม

มาคุยกันโดยละเอียด

เค้าโครงเชิงเส้น

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

เค้าโครงแน่นอน

ในรูปแบบสัมบูรณ์คุณสามารถระบุพิกัดที่แน่นอนของแต่ละตัวควบคุมที่คุณต้องการวาง ในรูปแบบประเภทนี้คุณสามารถระบุพิกัด X และ Y ที่แน่นอนของแต่ละตัวควบคุม ช่วยให้คุณระบุตำแหน่งที่แน่นอนของลูก ๆ

เค้าโครงสัมพัทธ์

เค้าโครงสัมพัทธ์คือไฟล์ ViewGroup ที่แสดงมุมมองเด็กในตำแหน่งสัมพัทธ์ คุณสามารถระบุตำแหน่งขององค์ประกอบที่สัมพันธ์กับองค์ประกอบอื่น ๆ หรือสัมพันธ์กับคอนเทนเนอร์หลัก

เค้าโครงตาราง

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

เค้าโครงเฟรม

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

บทแนะนำการออกแบบเค้าโครง Android: หน่วยวัด

เมื่อคุณระบุขนาดขององค์ประกอบบน UI ของ Android คุณควรจำหน่วยวัดต่อไปนี้อย่างแน่นอน

ตอนนี้เรามาดูหัวข้อสุดท้ายของบทความนี้กัน

บทแนะนำการออกแบบเค้าโครง Android: การสาธิต

ในส่วนการสาธิตนี้เรามาทำความเข้าใจวิธีการทำงานกับเค้าโครงใน Android Studio .

อ้างถึงไฟล์ ไปยัง Android Studio

นี่คือลักษณะของเค้าโครง เพียงแค่เลือก drawable และคุณจะพบสองสามชั้นเรียนเลือกชั้นเรียนอื่น ๆ ภายใต้การวาดนี้ คุณสามารถเขียนโค้ดโครงสร้างเค้าโครงหรือคุณสามารถดูการออกแบบและเพียงลากและวางส่วนประกอบบนพื้นที่ออกแบบ

คุณสามารถดูส่วนประกอบที่คุณเลือกได้ภายใต้โครงสร้างส่วนประกอบ

คุณยังสามารถค้นหาสิ่งเหล่านี้ได้ในเค้าโครง

1. จานสี : สิ่งนี้เก็บรายการมุมมองและกลุ่มมุมมองที่คุณสามารถลากลงในเค้าโครงของคุณได้
2. ส่วนประกอบ ต้นไม้ : ประกอบด้วยลำดับชั้นมุมมองสำหรับเค้าโครงของคุณ
3. แถบเครื่องมือ : ปุ่มสำหรับกำหนดค่าลักษณะโครงร่างในตัวแก้ไขและเพื่อเปลี่ยนแอตทริบิวต์เค้าโครงบางอย่าง
4. ตัวแก้ไขการออกแบบ : เค้าโครงในมุมมองออกแบบหรือพิมพ์เขียวหรือทั้งสองอย่าง ยังถือเป็นพื้นที่ออกแบบ
5. คุณลักษณะ : ควบคุมแอตทริบิวต์ของมุมมองที่เลือก

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

เมื่อคุณเข้าใจพื้นฐานของการออกแบบเค้าโครง Android แล้วให้ดูที่ไฟล์ โดย Edureka บริษัท การเรียนรู้ออนไลน์ที่เชื่อถือได้ซึ่งมีเครือข่ายผู้เรียนที่พึงพอใจมากกว่า 250,000 คนกระจายอยู่ทั่วโลก

หลักสูตรการฝึกอบรมการรับรองการพัฒนาแอป Android ของ Edureka ออกแบบมาสำหรับนักเรียนและผู้เชี่ยวชาญที่ต้องการเป็นนักพัฒนา Android หลักสูตรนี้ออกแบบมาเพื่อให้คุณเริ่มต้นการเขียนโปรแกรม Java และฝึกอบรมทั้งแนวคิดหลักและขั้นสูงพร้อมกับโครงการที่คุณคาดว่าจะสร้างแอปใน Android

มีคำถามสำหรับเรา? โปรดระบุไว้ในส่วนความคิดเห็นของบล็อก 'บทแนะนำการออกแบบเค้าโครง Android' และเราจะติดต่อกลับโดยเร็วที่สุด