Flutter: create icon of application by plug-in.

--

สำหรับตอนนี้ขออนุญาตแนะนำการสร้าง icon ของ app ด้วยวิธีง่ายๆได้พร้อมกันทั้ง ios and android เลยนะคับ (ซึ่งถ้าเราจำทำแบบ manual ก็ได้นะคับ แต่จะต้องเสียเวลาแปลงภาพเป็นขนาดต่างๆ และทำทั้งใน vscode และ. xcode เลย)

พระเอกของเราคือ “ flutter_launcher_icons ” นั่นเอง
ว่าแล้วก้อเข้าไปที่ pub.dev เลย

จากนั้นเราจะไปติดตั้งกันที่ pubspec.yaml โดยทำตาม Readme เลย

android และ ios ให้เลือก true ให้หมด, ส่วน image_path: ให้เลือก path ที่เก็บ icon เรานะคับ. (icon ควรจะใหญ่ไว้ก่อน สัก 1024x1024 จะดีมาก)

จากนั้นให้ save ให้เรียบร้อย ซึ่ง flutter pub get จะทำงานอัตโนมัตินะคับ แต่ถ้าไม่ทำงาน ให้เข้าไปที่ terminal และ run 2 คำสั่งต่อไปนี้คับ

flutter pub get
flutter pub run flutter_launcher_icons:main

เมื่อ run 2 คำสั่งนี้จบ จะมี wordings ว่าได้ทำการ สร้าง icon ให้เสร็จเรียบร้อยแล้วทั้ง android and ios นะคับ จากนั้นก็ flutter run -d <devices> เพื่อทดสอบดู icon ได้เลย

Overwriting icon both Android and iOS ล่ะนะ

ps: ในกรณีที่ icon ไม่เปลี่ยนนะคับ ให้ทำดังนี้

flutter cleanflutter pub cache repairflutter pub get

กรณีที่ยังไม่ได้อีก ให้เปลี่ยนชื่อ icon เป็นชื่ออื่นที่ไม่ซ้ำกับชื่อก่อนหน้าคับ

สำหรับ Flutter 2 ก็ทำเช่นเดียวกันนะคับ 4 ขั้นตอน

1. เพิ่มใน dependencies
2. เพิ่มข้อความเหล่านี้ในบรรทัดล่างสุดและใส่ icon ใน path ให้ตรงตามความเป็นจริงด้วย
3. Uncomment ในส่วนของ assets เพื่อให้มองเห็น file icon ที่เราได้ใส่เข้ามา
4. รันคำสั่งนี้เลย flutter2 pub run flutter_launcher_icons:main

แล้วพบกันใหม่คับ
GRASSROOT ENGINEER.

--

--

Grassroot Engineer
Grassroot Engineer

Written by Grassroot Engineer

ATM engineer who is interested in CODING and believe in EFFORT. — https://grassrootengineer.com

No responses yet