React native images/icons ideal format and dimensions

Question

I am a bit naïve in mobile development and building a react native app via expo. Consider the following cases:

1. Images/Icons within app
2. App Icon
3. Splash Screen

Which format and dimensions of the images (used as icons) are ideal for android+ios. Do we need to define icons for every dpi (ldpi, mdpi, tvdpi, hdpi, xhdpi, xxhdpi, xxxhdp) OR svg (vector graphics) can be used instead. Which format has support for both IOS+android?

Answer 1

You will have to set app icon and splash separately.

Android: For android, yes all different dimensions are needed for app icon. you can use this tool to generate icons. Image can be .png or .jpg.

Learn More:

• https://developer.android.com/studio/write/image-asset-studio
• https://material.io/design/platform-guidance/android-icons.html#usage

iOS: App Icons Sizes needed for iOS can be defined easily by this picture.

.

To understand how to set app icon for iOS in Xcode check this answer.