0Pricing
Jetpack Compose Academy · บทเรียน

ข้อจำกัดและการวัดโดยธรรมชาติ

เจรจาขนาดระหว่างองค์ประกอบแม่และลูก

ข้อจำกัดและการวัดโดยธรรมชาติ เป็นบทเรียน Jetpack Compose Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Jetpack Compose Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Jetpack Compose Academy มีบทเรียนทั้งหมด 4 บทเรียน

ข้อจำกัดคือสัญญาด้านขนาด

องค์ประกอบแม่ส่ง ข้อจำกัด ให้กับองค์ประกอบลูกแต่ละรายการ ซึ่งได้แก่ความกว้างและความสูงต่ำสุดและสูงสุดที่อนุญาต องค์ประกอบลูกต้องเลือกขนาดที่อยู่ภายในขอบเขตนี้ 📏

ตัวเลขสี่ค่ากำหนดกรอบ

ออบเจ็กต์ Constraints ทุกตัวเก็บค่า minWidth, maxWidth, minHeight และ maxHeight ไว้ด้วยกัน ค่าเหล่านี้อธิบายช่วงขนาดที่องค์ประกอบลูกสามารถเลือกได้

constraints.minWidth
constraints.maxWidth
constraints.maxHeight

ข้อจำกัดแบบมีขอบเขตและแบบอนันต์

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

ผ่อนคลายข้อจำกัดเพื่อให้มีขนาดเล็กลง

ใช้ copy เพื่อผ่อนคลายข้อจำกัดก่อนวัดขนาด การกำหนด minWidth เป็นศูนย์ทำให้องค์ประกอบลูกมีขนาดเล็กกว่าที่องค์ประกอบแม่กำหนดได้

val loose = constraints.copy(minWidth = 0, minHeight = 0)

เพิ่มความเข้มงวดของข้อจำกัดเพื่อบังคับขนาด

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

val fixed = Constraints.fixed(width = 200, height = 100)

องค์ประกอบลูกเจรจาขนาดภายในขอบเขต

การจัดวางคือ การเจรจา: องค์ประกอบแม่เสนอขอบเขต องค์ประกอบลูกรายงานขนาด แล้วองค์ประกอบแม่จัดวาง ทั้งสองฝ่ายร่วมกันกำหนดผลลัพธ์สุดท้าย

เหตุผลที่มี Intrinsics

บางครั้งองค์ประกอบแม่ต้องทราบขนาดขององค์ประกอบลูก ก่อนรอบการวัดจริง การวัดแบบอินทรินสิกจะตอบคำถามนี้โดยยังไม่ยืนยันขนาด

ความกว้างอินทรินสิกต่ำสุดและสูงสุด

สอบถาม minIntrinsicWidth เพื่อหาความกว้างน้อยที่สุดที่แสดงเนื้อหาได้โดยไม่ถูกตัด หรือสอบถาม maxIntrinsicWidth เพื่อหาความกว้างตามธรรมชาติเมื่อยังไม่ตัดบรรทัด

measurable.maxIntrinsicWidth(height)

การใช้งานแบบคลาสสิก: ความสูงเท่ากัน

ตัวปรับแต่งในตัว IntrinsicSize.Min ใช้ค่าการวัดแบบอินทรินสิกเพื่อทำให้องค์ประกอบลูกของ Row มีความสูงเท่ากับองค์ประกอบที่สูงที่สุด เช่น เส้นคั่นที่สูงพอดีกับองค์ประกอบข้างเคียง

Row(Modifier.height(IntrinsicSize.Min)) { }

อินทรินสิกมีค่าใช้จ่ายจากการสอบถามเพิ่มเติม

การสอบถามค่าอินทรินสิกต้องทำงานเพิ่มเติม จึงควรใช้เมื่อจำเป็นเท่านั้น เลย์เอาต์แบบกำหนดเองส่วนใหญ่ใช้เพียง ข้อจำกัด ก็เพียงพอแล้ว ⚡

ข้อจำกัดไหลลงมาตามต้นไม้

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

ตรวจสอบสั้น ๆ

คุณจะบังคับให้องค์ประกอบลูกมีขนาดคงที่ตามที่กำหนดพอดีได้อย่างไร

สรุป: ข้อจำกัดและอินทรินสิก

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

คำถามที่พบบ่อย

บทเรียน “ข้อจำกัดและการวัดโดยธรรมชาติ” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “ข้อจำกัดและการวัดโดยธรรมชาติ” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Jetpack Compose Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Jetpack Compose Academy มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “ข้อจำกัดและการวัดโดยธรรมชาติ”

เจรจาขนาดระหว่างองค์ประกอบแม่และลูก คุณปฏิบัติ Jetpack Compose Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Jetpack Compose Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน Jetpack Compose Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน

บทเรียน “ข้อจำกัดและการวัดโดยธรรมชาติ” ใช้เวลานานแค่ไหน

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

ฉันเขียนและรันโค้ดในบทเรียน Jetpack Compose Academy นี้ได้ไหม

ได้ บทเรียน Jetpack Compose Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. โมเดลการวัดและการวางตำแหน่ง
  2. เขียน Layout Composable
  3. ข้อจำกัดและการวัดโดยธรรมชาติ
  4. FlowRow ที่ตัดชิปขึ้นบรรทัดใหม่
← กลับไปที่ Jetpack Compose Academy