Skip to main content

How to change the default app icon to the preferred icon for your Android app project in Android Studio

 

Introduction:

Every Android mobile application usually comes with unique app icon associated with it by the Android Developer. An app icon visually represents a mobile application on the screen of user’s device, or in any app store, for example, Figure 1 shows app icons for various applications on the screen.

Figure 1

It is therefore a good idea to have an image designed for the Android application that you are building. The dimension of the app icon could be 512 x 512 pixel. You can then add the app icon to your Android project to replace the default launcher icon associated with app projects in Android Studio.

Demonstration:

In this demonstration, we will be replacing the default icon with our app icon (as in Figure 2).
Figure 2

To add your app icon to your Android project, take note of the following:

First, ensure that your app icon image has been designed and ready for use (for example, Figure 3 shows an image named “my_app_icon”- designed for “Demo One” app).

Figure 3

Second, position the app icon in a location where you can easily find it on your computer (for example, you can create a folder named “App Icons” on the Desktop of your computer and put your new app icon image inside it).

Third, launch your Android Studio software and open your Android project (for example, “Demo One” project has been opened in Android Studio as shown in Figure 4).

Figure 4

Fourth, in your Android Project, click on “File” menu >> click on “New” >> and then click on “Image Asset” (for example, as shown in Figure 5).

Figure 5

In the dialog box that is displayed (for example, as in Figure 6), you can configure the image asset for your launcher app icon.

Figure 6

In the tab for “Foreground layer”, you can change the image path to point to the location of your app icon on your computer, and also, you can resize the app icon to ensure that essential parts of the icon are not hidden when displayed on different devices. For example, we will click on the box in front of “Path”, and then, click on the location of our app icon. Next, we will click on the app icon (for instance, “my_app_icon.png” used for this demo), and then click on “OK” as shown in Figure 7.

Figure 7

The app icon has now been imported (as shown in Figure 8), but there is need for us to resize it, so as for it to show properly on the screens with different mobile device sizes.

Figure 8

To resize the app icon, you can move the slider in front of “Resize” backward to reduce the percentage until all the essential part of the icon are displayed within the inner circle in the samples on the Preview (for example to 46%), as in Figure 9. Alternatively, you can select “Yes” in front of “Trim”, and then move the slider backward to resize the icon. With Trim set to Yes, the resize percentage should be higher.

Figure 9

Next, we can change the color of the background layer of the app icon. To do this, we will click on the “Background Layer” tab, and then, in front of “Asset type”, click on “Color” (as in Figure 10).

Figure 10

Next, since the background of our sample app icon is white, we will select white color for the Color (as in Figure 11). Note that if you know the code for your preferred background color, you can enter it directly in the box under “Hex”, and then press “enter” key.

Figure 11

The background color for our image is now changed (as in Figure 12), we can now click on “Next”. 

Figure 12 

On the page that is displayed next, simply click on Finish (as in Figure 13).

Figure 13

Our app icon is now successfully added to our Android project. We can run the emulator to view our app, and then, navigate to the launcher tray on the screen to confirm our app icon (as shown in Figure 14). 

Figure 14

That’s it.

Thank you for reading.

 

 
  

 




 

Comments

Popular Posts

Android Development: Addition of Bottom Navigation Bar with Kotlin and Jetpack Compose

  Introduction In this article, we will add bottom navigation bar to the second screen of the “Demo One” App that I have been using for demonstrations in my previous Android development articles. The bottom navigation bar will have three navigation items, which are, “Home”, “Info” and “Settings”.  The navigation items would be programmed to render their contents on the screen accordingly when clicked or tapped. Note that the “Demo One” Android project already had a TopAppBar, as added in my previous article. The user interface of the second screen of the Demo One App is as shown in Figure 1. Figure 1 Addition of Needed Dependency The dependency that we will need for the addition of bottom navigation bar to our Android project is called “navigation”. Let us now open the module-level build.gradle file in our Android project and add the version 2.6.0 of the navigation dependency. After the addition of the dependency, we will connect to the internet and then click on “Sync Now” as

Android Development: Using Alert Dialog with Button in Jetpack Compose

  Introduction: In Android application development, buttons could be programmed to perform some actions (such as navigating to another screen, showing toast message, closing the app, among others) when the user taps or clicks on them. In this article, we will learn how to make a button to perform the action of displaying an alert message to the user. This would be achieved using a composable function called AlertDialog. Note that we will be demonstrating this with the 'Click Here to Proceed' button located inside the ‘DemoScreen’ composable function in our 'Demo One' Android project from my previous article. Demonstration: First, we will open the 'Demo One' project. ‘Demo One’ project is now opened as shown in Figure 1. Figure 1 Next, above the button composable in our ‘DemoScreen’ composable function, we will define a mutable state variable, set its value to ‘false’, and store it with the name 'showAlertMessage' (as shown in Figure 2). Note th

Literature Review: An Important Exercise for Students and Researchers

  Introduction Review of literature is a very important exercise which researchers as well as students at both undergraduate and postgraduate levels cannot shy away from, as it identifies and summarizes research and theories that are relevant to their area of interest, and as well sets good foundation for research or theses writing. In this article, we will consider some aspects of literature review such as its meaning, its significance, what it entails, steps to take in writing a good literature review, and some of the things that we need to avoid while reviewing literature. Meaning of literature review Let us first break down the key concepts and see what the dictionary has for us as per the meaning of ‘Literature’ and ‘Review’. In Oxford Advanced Learner’s Dictionary (8 th Edition), literature means “pieces of writing or printed information on a particular subject”. Also, Longman Dictionary of Contemporary English defines literature as "all the books, articles, etc.