Copyright 2020 - Custom text here

วันนี่ มาสเตอร์​ จะมาแชร์ วิธีการ เปลี่ยนสีพี้นหลัง หรือ แทรกภาพ ที่ AppBar ของ Flutter แบบนี้ครับ

Screen Shot 2562 07 18 at 060449

เปลียนสี เป็นสีเดียวกันกับ Background ของ State

Screen Shot 2562 08 21 at 085056

 หรือ แบบนี่ แทรกภาพ ไปเลย

มาดูแบบแรกก่อน

Screen Shot 2562 07 18 at 060449

สีเดียวกับ State

Screen Shot 2562 07 18 at 060501

 

 กำหนดสี โดยใช้ Color.formRGBO ให้เป็นสีเดียวกับ State

Screen Shot 2562 07 18 at 060515

แต่ถ้าเราต้องการลบ ขอบเส้นด้วย

Screen Shot 2562 07 18 at 060717

ให้เพิ่ม elevation: 0 เข้าไปแบบนี้

Screen Shot 2562 08 21 at 080733

มาดูตัวอย่างครับ

Screen Shot 2562 08 21 at 080742

นี่ครับ ตัวโค้ดเต็มๆ

 Screen Shot 2562 08 21 at 082820

ที่นี้ มาสเตอร์ ลองเปลี่ยนไปเป็น RadiaGradient บ้าง มาดูผลลัพธ์กัน

Screen Shot 2562 08 21 at 082823

 สังเกตุการไล่สี

Screen Shot 2562 08 21 at 085106

ที่นี่มาสเตอร์ ลองเปลี่ยนเป็นสี เป็น ภาพ

Screen Shot 2562 08 21 at 085056

ดูภาพ ที่ซ้อง สิครับ เนียนดีเชียว ลองทำตามดูนะครับ สำหรับใครที่ทำไม่ได้ ลองเข้ามาเรียน คอร์ส เขียนแอพ ด้วย Flutter กับ มาสเตอร์ อึ่งครับ

ดูเพิ่มเติมที่

https://www.androidthai.in.th/private-project-android-flutter-course.html

 

 

 

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

privateProject2019v1

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

privateAndroid2019v1

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

privateIos2019V1

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

privateFlutter2019v1

f t g