Series - Flutter CI/CD, ตอน: วิธีสร้าง env ต่างๆใน Flutter (Version Android)

หลังจากบทความที่แล้ว ที่ได้เล่าวิธีการ setup env ของ iOS ไปแล้ว ครั้งนี้เราจะมา set ของ Android กันต่อนะครับ จริงๆแล้วหลักการมันก็เหมือน set build flavor ของ Android เลยครับ แต่จะมีต่างกันนิดหน่อย

ไปที่ folder android เลยครับ แล้วเปิด project ด้วย Android Studio จะได้หน้าตาคล้ายๆแบบนี้

ไปที่ build.gradle ที่เป็นของ android.app นะครับ

จะไปเพิ่ม flavorDimensions ตัวใหม่เข้าไป

แล้วก็จะเพิ่ม productFlavors เข้าไป ครับ โดยผม set up ตามนี้

flavorDimensions "version"
productFlavors {
    dev {
        flavorDimensions "version"
        resValue "string", "app_name", "Demo app"
        applicationId "com.amorn.demo"
        manifestPlaceholders = [branchTestMode: true, branchLink: "bank.test-app.link", branchLinkAlt: "bank-alternate.test-app.link"]    
    }

    production {
        flavorDimensions "version"
        resValue "string", "app_name", "Production app"
        applicationId "com.amorn.production"
        manifestPlaceholders = [branchTestMode: false, branchLink: "bank.test-app.link", branchLinkAlt: "bank-alternate.test-app.link"]
    }
}

ตรงที่ highlight เข้มไว้ ให้แก้ไขตามที่ต้องการครับ ก็เปลี่ยนชื่อจาก demo app เป็นตัวอื่นก็ได้ครับ โดยปกติควรจะแก้ icon app ให้มันต่างกันนิดหนึงด้วยที่ตรงนี้ครับ แต่ผมไม่ได้ทำ เพราะเวลาเรา test เราได้ test ทั้ง demo/prod ในเครื่องเดียวกันครับ จะได้ดูออกว่ามันแตกต่างกัน

เปลี่ยน applicationId ให้ตาม id ของ app ที่เราจะใช้นะครับ

ชื่อ productFlavor คำว่า dev กับ production ต้องเป็นคำนี้นะครับ เพราะมันเป็นคำที่ตรงกับของ iOS scheme ครับ ถ้าจะเปลี่ยนก็ต้องไปเปลี่ยนของ iOS ด้วยครับ แล้วตอน run flutter ก็จะใช้ flavor ตามนี้ครับ

manifestPlaceholders ส่วนนี้จะเป็นการไว้ replace parameter บางตัวที่อยู่ใน Android Manifest.xml นะครับ

มันมีวิธีหลายอย่างครับ บางคนอาจจะทำ manifest.xml สำหรับ debug แต่ผมชอบแบบนี้ วิธีใช้จะตามนี้ครับ ไปที่ Androidmanifest.xml เวลาเราอยากเปลี่ยนตัวแปรให้ใช้ตามนี้ครับ

<meta-data
    android:name="io.branch.sdk.TestMode"
    android:value="${branchTestMode}" />

กรณีนี้ผมจะให้มันแทนตัวแปรที่ชื่อว่า branchTestMode ให้ใช้ตัวแปรเดียวกันกับใน Gradle แล้วเดี๋ยวเวลา run มันจะ replace code ให้ครับ

อันนี้ผมตัวอย่างที่ใช้กับ Branch.io ให้ดูว่า เรา replace test/prod env ของ Branch.io กับ Android เรายังไง

ต่อไปจะเป็นพวก asset ต่างๆครับ ผมเข้าใจว่าส่วนใหญ่น่าจะใช้ Firebase กัน ซึ่ง Firebase จะให้ google-services.json มา แล้วเอาลงไปใน Project

ให้เราสร้าง folder dev กับ production ไว้ที่ root เดียวกับ build.gradle (:app) นะครับ ต้องชื่อ dev กับ production เท่านั้นนะครับ เพราะจะต้องเป็นชื่อเดียวกันกับ flavor

บางคนอาจจะ layout ไม่เหมือนกัน ให้เลือกที่ด้านซ้ายบนสุดให้เป็นคำว่า Project นะครับ บางคนอาจจะเลือกคำว่า Android เอาไว้

กดสร้าง Directory ได้เลยครับ ตามด้านล่าง

สร้างเสร็จจะได้แบบด้านล่างเลยครับ

ทีนี้ด้านในก็ให้ใส่ google-services.json ของ non-prod ใน dev ครับ แล้วก็ prod ใน production

และถ้ามี asset อื่นๆที่ต้องใช้ อย่างเช่นมี file 3rd party asset พวก certificate อื่นๆ ก็นำมาใส่ตามใน folder ได้เลยครับ

หลังจากนั้นก็ run command

flutter run --flavor dev -t lib/main.dart 

ทีนี้ไม่ว่าจะเป็นของ iOS หรือของ Android มันก็จะโหลด asset, และก็พวก config ต่างๆได้แบ่งตาม env เรียบร้อยครับ

ถ้าในอนาคตอยากเพิ่ม uat env ขึ้นมา เราก็ทำแบบเดิมๆได้เลยครับผม

เรียบร้อยแล้วครับ กับ Series Flutter CI/CD สำหรับ iOS/Android

ทุกคนถ้าทำตาม Series นี้ก็จะสามารถ ทำ CI/CD บน Flutter ที่สามารถแบ่ง env แต่ละ platform ได้ครับ

รอบหน้าจะเป็นสอน bash script นะครับ เป็นการปิดฉากจบ Series 1 Flutter CI/CD