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...

Simple method of hiding page number on the first page of your Microsoft Word document

    Introduction: According to the standard in preparing documents in most institutions or organizations, it is usually expected that the page number should not appear on the first or title page of a document. Hence, different methods of ensuring that the page number becomes hidden on the first page have been tried. In this article, we will consider a simple and efficient method. Any time you insert page numbers in your Microsoft Word document, the page numbers will appear on all the pages (including the first page) in your document. Page numbers could appear at the “Top of Page” (which is the header) or “Bottom of Page” (which is the footer), depending on where you have chosen to position them. Nevertheless, if the first page in your document is a “Cover Page” that was inserted from the “Pages” group in the “Insert” menu tab, then, the first page will not carry any page number by default. Figure 1 shows the first two pages of our document, and our task is to hide th...

How to Choose an Appropriate Statistical Tool for Research Data Analysis

  Introduction It is obvious that data is involved in any kind of research. The data is collected and analyzed in order to arrive at a meaningful conclusion in relation to the focus of the study or research. Data analysis is usually easier when we have a good understanding of the right statistical tool or technique or test to use. Before we dive deeper, let's refresh our knowledge of some basic data-related concepts. Basic Concepts Data: Data refers to a collection of facts and figures. It could be in the form of numbers, texts, images, sound, among others. Primary data: This refers to the first-hand data collected directly from the source or subject or sample of a study or research. The subject or sample of the study could be human beings or plants or animals or other things. Primary data could be obtained through observation, survey, the use of questionnaire, and so on. Secondary data: This refers to the data that was obtained from already existing data which was o...