Checklist Thay Đổi Icon App React Native

1️⃣ Chuẩn bị icon

• Tạo icon hình vuông (1024x1024 px khuyến nghị).

• Định dạng PNG, nền trong suốt nếu cần.

2️⃣ Thay icon cho Android

• Cách thủ công:

  1. Mở folder: android/app/src/main/res/

  2. Thay các file icon trong các folder:

     • mipmap-mdpi/ic_launcher.png

     • mipmap-hdpi/ic_launcher.png

     • mipmap-xhdpi/ic_launcher.png

     • mipmap-xxhdpi/ic_launcher.png

     • mipmap-xxxhdpi/ic_launcher.png

  3. Đảm bảo kích thước tương ứng:

     • mdpi: 48x48 px

     • hdpi: 72x72 px

     • xhdpi: 96x96 px

     • xxhdpi: 144x144 px

     • xxxhdpi: 192x192 px

• Cách tự động:

  • Cài package react-native-make:

    npm install -g react-native-make

  • Dùng lệnh tạo icon:

    npx react-native set-icon --path path/to/icon.png

3️⃣ Thay icon cho iOS

• Cách thủ công:

  1. Mở Xcode → Project → Assets.xcassets → AppIcon

  2. Kéo icon mới vào các ô tương ứng (iPhone, iPad, iOS 7+, iOS 20+…)

  3. Icon cần nhiều kích thước: 20x20, 29x29, 40x40, 60x60, 76x76, 83.5x83.5, 1024x1024…

• Cách tự động:

  • Dùng react-native-make tương tự Android:

    npx react-native set-icon --path path/to/icon.png

4️⃣ Làm sạch project

cd android && ./gradlew clean cd ios && xcodebuild clean

5️⃣ Chạy app kiểm tra

npx react-native run-android npx react-native run-ios

• Kiểm tra icon trên màn hình chính và trình cài đặt app.