Copyright 2024 - Custom text here

 จากบทความครั้งที่แล้วเราสามารถ เรียกใช้ Scaffold มาจัดการ Widget ต่างๆ ที่จะแสดงบนจอของเรา มาที่นี่ เราจะมาใส่รายละเอียดให้ Scaffold บ้าง

Screen Shot 2562 01 23 at 052106

เห็น AppBar ไหม ? วันนี่เราจะมา ลุย Properties ตัวนี่กัน

Screen Shot 2562 01 23 at 062102

เริ่มจาก ครั้งที่แล้ว

Screen Shot 2562 01 23 at 062105

Call Scaffold คลาส แต่ยังไม่ได้ ทำอะไร ?

Screen Shot 2562 01 23 at 062348

เดี๋ยวเราจะ เพิ่ม AppBar ไปดูรายละเอียดเพิ่มที่ https://docs.flutter.io/flutter/material/AppBar-class.html หรือ จะมาเรียนกับมาสเตอร์ ก็ได้ ที่ https://www.androidthai.in.th/private-project-android-flutter-course.html

Screen Shot 2562 01 23 at 062414

ใน Scaffold มาสเตอร์ เพิ่ม AddBar ส่วนของ title จะใส่ Widget Text ที่แสดงข้อความว่า This is AppBar

Screen Shot 2562 01 23 at 062422

ไปที่ Terminal พิมพ์ คำสั่ง flutter run เพื่อ ทดสอบ แอพ Flutter บน Simulator จะได้ AppBar ที่มี Title แสดงข้อความว่า This is AppBar แบบนี่ครับ

 Screen Shot 2562 01 23 at 063128

 ต่อไป มาสเตอร์ จะลอง leading บ้าง โดยให้แสดง Icon รูป Android รูปแบบเป็นแบบนี่ครับ

Screen Shot 2562 01 23 at 063134

ไม่ยากครับ

Screen Shot 2562 01 23 at 063201

ต่อไป มาสเตอร์ จะเพิ่ม  action จะทำเป็น array Widget

Screen Shot 2562 01 23 at 063224

ลองใส่  Widget Array ตัวเดียว

Screen Shot 2562 01 23 at 063356

 

Screen Shot 2562 01 23 at 063405

อันนี่ 2 อันครับ

Screen Shot 2562 01 23 at 063452

 

Screen Shot 2562 01 23 at 063518

สามอันครับ ไม่ยากๆ ติดขัดอะไร ? ไปที่นี่ ครับ https://www.androidthai.in.th/private-project-android-flutter-course.html มาลุยโค้ด Flutter กัน

 

 

คอร์ส สอนโปรเจ็คแอนดรอยด์ ตัวต่อตัว

privateProject2019v1

คอร์ส เบสิกแอนดรอยด์ สอน ตัวต่อตัว

privateAndroid2019v1

คอร์ส iOS สอน ตัวต่อตัว

privateIos2019V1

คอร์ส Flutter สอน ตัวต่อตัว

privateFlutter2019v1

f t g