flutter_base_project

โครงการฐานกระพือปีก

• นี่คือเทมเพลตโครงการที่มีห้องสมุดหลายแห่งเพื่อช่วยในกระบวนการพัฒนาของโครงการ Flutter โดยใช้สถาปัตยกรรม MVVM เทมเพลตประกอบด้วยเลเยอร์ที่แตกต่างกันเช่นฐานค่าคงที่ส่วนขยายเริ่มต้นและฐานมุมมอง นอกจากนี้ยังรวมถึงห้องสมุดสำหรับการจัดการสถานะการแปลแคชเครือข่ายและการทำให้เป็นอนุกรมและอื่น ๆ เทมเพลตมีรหัสที่กำหนดไว้ล่วงหน้าสำหรับการสร้างมุมมองและรูปแบบมุมมองทำให้นักพัฒนาซอฟต์แวร์มุ่งเน้นไปที่การออกแบบหน้าและตรรกะทางธุรกิจได้ง่ายขึ้น

ขั้นตอนการเข้าร่วม

• 1-) เปิดไฟล์ "flutter_base_project" (ไม่ใช่กับ VScode, Android Studio ฯลฯ )
• 2-) คัดลอกไฟล์ 'lib', 'สินทรัพย์' และ 'สคริปต์' ไฟล์และวางลงในโครงการของคุณเอง
• 3-) รวมไลบรารีและสินทรัพย์เข้ากับโฟลเดอร์ "pubspec.yaml"
• 4-) แทนที่การนำเข้าในการปิดด้วย ชื่อโครงการของคุณเอง และแก้ไขการนำเข้า

ห้องสมุดโครงการฐาน Flutter

• การจัดการรัฐ

  • mobx => https://pub.dev/packages/mobx
  • flutter_mobx => https://pub.dev/packages/flutter_mobx
  • ผู้ให้บริการ => https://pub.dev/packages/provider
  • mobx_codegen => https://pub.dev/packages/mobx_codegen
  • build_runner => https://pub.dev/packages/build_runner

• การแปลเป็นภาษาท้องถิ่น

  • easy_localization => https://pub.dev/packages/easy_localization

• แคช

  • shared_preferences => https://pub.dev/packages/shared_preferences

• เครือข่าย

  • dio => https://pub.dev/packages/dio

• เป็นอนุกรม

  • json_serializable => https://pub.dev/packages/json_serializable

ชั้นโครงการ

• ฐาน

  • สามารถย้ายจากโครงการหนึ่งไปอีกโครงการหนึ่ง โครงสร้างที่มีอยู่สามารถใช้งานได้อย่างราบรื่นในทุกโครงการ

  • ในโครงการอิงตามสถาปัตยกรรม MVVM เราสร้างโครงสร้างพื้นฐานของเลเยอร์ Model-View-ViewModel จากที่นี่

• ค่าคงที่

  • โฟลเดอร์ที่ค่าที่จะไม่เปลี่ยนแปลงตลอดแอปพลิเคชันและสามารถใช้ตั้งแต่ต้นจนจบจะถูกเก็บไว้

  • รวมถึงชื่อการนำทางที่จะใช้โดยเส้นทางแอปพลิเคชันค่า enum ค่าคงที่ภาพเส้นทางการนำทาง

• ส่วนขยาย

  • ส่วนขยายที่สามารถใช้ในทุกส่วนของโครงการในแง่ของความคิดรหัสที่สะอาดเป็นสิ่งจำเป็น

  • context_extension => สถานที่ที่มีค่าเช่นความกว้างความสูงการขยายและระยะเวลาจะถูกเก็บไว้ภายในแอปพลิเคชัน

• การเริ่มต้น

  • สถานที่ที่มีการควบคุมที่สำคัญเช่นแคช, Lang, การนำทาง, เครือข่าย, ผู้แจ้งเตือนและธีมได้รับการจัดการสำหรับแอปพลิเคชันมือถือ

  • CACHE => มี Locale Manager สำหรับการจัดการแคชแอปพลิเคชันในส่วนนี้

  • lang => มีตัวจัดการภาษาสำหรับการแปล สำหรับการแปลภาษาที่จะมีการแปลเป็นภาษาท้องถิ่นควรใส่ลงในโฟลเดอร์เช่น en-us.json, tr-tr.json ภายใต้สินทรัพย์/lang หลังจากการเปลี่ยนแปลงใด ๆ ที่เกิดขึ้นในโฟลเดอร์เหล่านี้คำสั่ง "Flutter Pub Run Easy_localization: สร้าง -o lib/core/init/lang -f keys -o locale_keys.g.dart -s Assets/Lang" ควรเขียนในเทอร์มินัล

  • การนำทาง => สถานที่ที่มีบริการนำทางและเส้นทางการนำทาง

  • Network => ใช้สำหรับการจัดการการขูดเว็บจากเว็บไซต์โดยใช้ DIO

  • NOTIFIER => จัดการการเปลี่ยนแปลงธีมระหว่างธีมมืดและแสงด้วยตัวแจ้งเตือนธีม

  • Theme => ใช้สำหรับการจัดการธีมของแอปพลิเคชัน

ฐาน view-ViewModel

• หลังจากเสร็จสิ้นกระบวนการพัฒนาสถาปัตยกรรมที่ระบุไว้ในส่วนเลเยอร์โครงการเราสามารถเริ่มเติมมุมมองและ ViewModels ของแอปพลิเคชันโดยทั่วไป

• ในส่วนนี้เราจะเห็นว่าเราสามารถใช้มุมมองและ ViewModels ของแอปพลิเคชันได้อย่างไรในแบบบูรณาการด้วยรหัสที่เราเขียนในชั้นฐาน

  ViewModel

  • เมื่อเราเริ่มสร้างส่วน ViewModel ก่อนอื่นเราจะเริ่มสร้างรหัส ViewModel โดยใช้ตัวอย่าง MOBX ( โปรดทราบว่า build_runner_watch เปิดใช้งานในระหว่างกระบวนการนี้ )

  • หลังจากเสร็จสิ้นกระบวนการนี้ MOBX_CODEGEN เริ่มเขียนรหัสที่สร้างขึ้นไปยังโฟลเดอร์ ViewModel.g.dart ในนามของเรา

  • ในขณะที่พัฒนา ViewModel ของเราเราใช้ base_view_model ที่เราทำในส่วนฐาน สำหรับกระบวนการนี้เราเพิ่มคลาสด้วย Store, BaseviewModel โครงสร้างไปยังคลาสเพื่อรับจากคลาส BaseViewModel

  • หลังจากเพิ่มโครงสร้างเหล่านี้เรารวมฟังก์ชั่น setContext () และ init () จาก Base_view_Model ของเรา "

  

  ดู

  • เมื่อเริ่มเติมส่วนมุมมองเราจะใช้ View_Base ที่เราพัฒนาขึ้นในส่วนฐาน

  • ในการวาดหน้าของเราเราเพิ่ม baseview ของเราลงในส่วนการส่งคืน แต่ baseview นี้จะต้องได้รับจาก viewModel (เช่น: baseview ())

  • หลังจากรวม BaseView แล้วเราเริ่มกรอกรหัสที่เราเขียนไว้ในส่วน BASE_VIEW ที่นี่

  • ViewModel => เราให้ ViewModel ของหน้าเว็บที่เราวาดตามที่อธิบายไว้ข้างต้น

  • onModelReade => เราควบคุมการโต้ตอบบริบทของโมเดลที่เราให้

  • onPagebuilder => นี่คือส่วนที่เราเริ่มวาดหน้าของเรา

  

  เผยแพร่ไปยัง Android

  การให้เครดิต

  • ขอบคุณ hardwareandro youtube channel => https://www.youtube.com/@hardwareandro
  • ขอบคุณ Veli Bacıkที่ให้การฝึกอบรมเหล่านี้เพื่อสนับสนุนการเรียนรู้ของฉันในหัวข้อเหล่านี้ => https://github.com/vb10