matchparent กับ wrapcontent ต่างกันอย่างไร?


wrapcontent กับ matchparent

เวลาพัฒนา Android Application เชื่อว่าทุกคน ต้องเจอ สองคำนี้แน่นอน “wrapcontent” กับ “matchparent” อ่อ หรืออีกคำคือ “fill_parent” แต่คิดว่าต้องมีบางคนหรืออีกหลายๆคน ยังไม่เข้าใจว่ามันแตกต่างกันยังไงแน่นอน

fillparent เหมือนกับ matchparent เนื่องจากตั้งแต่ API 8 fillparent ได้ถูกเปลี่ยนชื่อเป็น matchparent หากใครเขียนแอพที่รองรับ ต่ำกว่า API 8 ก็ต้องใช้ fill_parent

แล้วมันแตกต่างกันอย่างไรละ?

wrap_content

  • มันจะแสดงข้อมูลขนาดเท่ากับตัว content เช่น พวก TextView หรือ Button หากเราเซ้ท text มีข้อความยาวๆ ตัว component มันก็จะยาวตามตัวอักษร หากมีแค่ 3 ตัวอักษร มันก็จะสั้นเหลือแค่ 3 ตัวอักษร ถ้ามี padding จะรวม padding ไปด้วย

ตัวอย่าง wrap_content

ตัวอย่าง wrap_content

เมื่อมี padding โดยเพิ่ม padding="40dp" เข้าไป จะทำให้ padding ถูกนำไปคิดรวมกับขนาดตัวอักษรด้วย

ตัวอย่าง wrap_content เมื่อมี padding

match_parent

  • มันจะแสดงข้อมูลขนาดเท่ากับ parent ของมัน เช่น ภายใน Layout มี LinearLayout และ Button หากกำหนด match_parent ให้ button มันก็จะขยายใหญ่เท่ากับ LinearLayout โดยไม่สนใจว่าข้อความจะสั้นยาวแค่ไหน ถ้ามี padding ของ parent จะต้องลบ padding ไปด้วย

ตัวอย่าง match_parent

ตัวอย่าง match_parent

เมื่อใส่ padding ให้กับ parent จะเห็นว่า match_parent จะไม่ยืดเต็มความใหญ่ของ parent เนื่องจากถูกลบด้วย padding ที่กำหนดไว้ใน parent ครับ

ตัวอย่าง match_parent เมื่อมี padding

เมื่อกำหนดความสูงเป็น wrap_content โดยมี padding 20 ส่วนความกว้าง กำหนดให้เท่ากับความกว้างของ parent ด้วย match_parent

เมื่อผสมกัน

บทความนี้ถึงแม้จะเป็นเพียงแค่เบสิคพื้นฐานเกี่ยวกับ Layout ของ Android แต่เชื่อว่าหากรู้จักปรับแต่ง นำไปใช้แล้ว จะทำให้แอพพลิเคชั่นของผู้อ่าน ดูมีความสวยงาม และเป็นระเบียบมากขึ้นทีเดียว หากใครผ่านมาอ่าน ก็ลองๆนำไปลองเล่น ประยุกต์ในแบบอื่นๆดูนะครับ เช่นปรับยืด Button ให้พอดีกับ parent หรือว่าใช้ wrapcontent แต่ใช้ padding เข้ามาช่วย ส่วนรายละเอียดย่อยๆ พวก gravity, layout:gravity หรือแม้แต่ alignxxx ก็ลองอ่านๆดูครับ อนาคต ถ้าไม่ขี้เกียจ ผมจะมาพูดเรื่องเลเอาท์อีกครับ ขอบคุณที่ติดตามอ่านครับ

หากเห็นว่าบทความมีประโยชน์ อย่าลืมช่วยกันแชร์บอกต่อเพื่อนๆด้วยนะครับ :)

Chai

Chai Phonbopit : Developer แห่งหนึ่ง • ผู้ชายธรรมดาๆ ที่ชื่นชอบ Node.js, JavaScript และ Open Source มีงานอดิเรกเป็น Acoustic Guitar และ Football

บทความล่าสุด