hint.md

การบ้านครั้งที่ 4 LED Matrix

คำแนะนำในการทำการบ้าน

1. ให้ทำจากเล็กไปใหญ่ เริ่มต้นให้เขียนเมธอด _buildDot() ที่ทำหน้าที่แสดงจุด 1 จุดโดยใช้ Container ให้ได้ก่อน, ให้เมธอดมีพารามิเตอร์ชนิด int ซึ่งหากส่งค่ามาเป็น 0 จะแสดงจุดมืด (LED Off) แต่หากส่งมาเป็น 1 จะแสดงจุดสว่าง (LED On)

   จุดมืด/สว่าง ก็คือการกำหนดสีให้กับ Container นั่นเอง (นักศึกษาเลือกสีของจุดมืด/สว่างได้ตามต้องการ)

    Widget _buildDot(int value) {
      return Container(
        // value = 0 จะแสดงจุดมืด, value = 1 จะแสดงจุดสว่าง
      );
    }

2. เขียนเมธอด _buildRow() ที่ทำหน้าที่แสดงแถวของจุด 1 แถว ตามค่าของ List<int> ที่ส่งมาเป็นพารามิเตอร์

    Widget _buildRow(List<int> dotList) {
      return Row(
        // ...
        // วนลูปค่า int ใน dotList แล้วเรียกไปยัง _buildDot() 
        // เพื่อแสดงจุดที่สัมพันธ์กับแต่ละค่า int
        // ...
      );
    }

3. เขียนเมธอด _buildDigit() ที่ทำหน้าที่แสดงตารางของจุดเป็นตัวเลข 1 หลัก ตามค่าของ List<List<int>> ที่ส่งมาเป็นพารามิเตอร์

    Widget _buildDigit(List<List<int>> rowList>) {
      return Column(
        // ...
        // วนลูปค่า list ใน rowList แล้วเรียกไปยัง _buildRow()
        // เพื่อแสดงแถวของจุดที่สัมพันธ์กับแต่ละ list ใน rowList
        // ...
      )
    }

4. เขียนเมธอด _buildDisplay() ที่ทำหน้าที่แสดงตัวเลข LED 2 หลัก

    // value คือค่าสตริงที่เป็นตัวเลข 2 หลัก เช่น '00', '23', etc.
    Widget _buildDisplay(String value) {
      // แยกตัวเลขแต่ละหลักใน value ออกมา แล้วเรียกไปยัง _buildDigit()
      // แล้วเอา Row มาครอบ เพื่อจัดเรียงตัวเลข 2 หลักในแนวนอน
    }

5. สร้าง Column เป็น widget หลักที่มี children ตามลำดับคือ

   • ปุ่มเพิ่มค่า
   • widget ที่ได้จาก _buildDisplay()
   • ปุ่มลดค่า

   กำหนด mainAxisAlignment ให้กับ Column ตามความเหมาะสม