Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson
1×
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.

Autoplay

    Change the App Icon for React Native Apps on iOS

    Chris AchardChris Achard
    react-nativeReact Native
    javascriptJavaScript
    iosiOS

    We’ll replace the default App Icon on iOS with a custom app icon image.

    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Discuss

    Discuss

    Transcript

    Transcript

    Instructor: From the root of the project, open the iOS folder. Then open the Xcode project. Find and select the images.xcassets entry in the file tree.

    Select AppIcon, which should already exist. If it doesn't already exist, you can create it by right-clicking, then select App Icons & Launch Images, and then New iOS App Icon.

    You'll have to have an icon for each size here, and Xcode tells you what the size needs to be. For example, the iPhone Notification icon says 20 pt. It has entries for 2x and 3x. The 2x icon will be 40x40 pixels. The 3x icon will be 60x60 pixels.

    I have a directory here with these icons pre-made with the Ionicons pizza icon. We can just drag each icon into the appropriate image box.

    Back in the iOS simulator, first uninstall the app and then rerun with react-native run-ios. After it launches, we can press the Home button with Command-Shift-H to close the app. Then we can see the new icon.