Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Adding an App Icon4:47 with Ben Deitch
There's one final thing we need to complete this app: an icon! We'll use an icon from our designer and talk briefly about how Android manages images for different types of screens.
And that little thing is an app icon. 0:00 Check out the markups. 0:03 We've got this cool semi-transparent icon and 0:04 it's really simple to add to our project. 0:07 Download the zip file linked below this video and the teacher's notes and 0:09 once it downloads go ahead and unzip it wherever you'd like. 0:13 Now, don't be alarmed that there's more than one folder in here. 0:18 We'll talk more about these different folders in a later project. 0:21 But the basic idea is that we provide images at 0:24 different resolutions to make sure our app looks good on a wide range of devices. 0:27 Now if we jump back into Android Studio, here in the res directory, if we 0:32 expand the mipmap folder, we can see the same folders that we saw in our download. 0:37 Well, kind of. 0:43 If we open our project in Windows Explorer or Mac Finder and 0:44 navigate to the res directory. 0:48 We can indeed see each of the mipmap folders that we saw on our download. 0:49 But since they each contain the same files, Android Studio simplifies things. 0:54 Rather than showing all the different mipmap folders, 0:59 we only see one folder per image containing all the version of that image. 1:03 And the part in parenthesis tells us which mipmap folder that image is actually in. 1:08 The mipmap directory is in a project mostly containing icons, and the different 1:14 suffixes have to do with the different resolutions that Android can run on. 1:19 hdpi is for high definition, mdpi is for medium definition, xh is for 1:23 extra high definition, and xxh, well, you get the idea. 1:28 If we wanted to, 1:32 we could just provide one set of images at whatever resolution we choose. 1:33 And the Android operating system is smart enough to scale it for different devices. 1:38 But the best practice is to provide multiple resolutions that we 1:42 scale ourselves, 1:45 to give the best user experience no matter what device the user is using. 1:47 Let's take a look at what we currently have in these folders. 1:52 If we double click on one of these images, we can open it up right here. 1:55 This is the icon that we're currently using, the default icon. 2:00 It's created when you first create a project. 2:04 All we need to do is overwrite this file with our new one. 2:06 Let's close this and then find our icon in the hdpi folder you downloaded. 2:10 Then let's copy it. 2:21 And paste it into the mipmap folder. 2:25 Then pick the mipmap hdpi folder and hit OK, hit OK again. 2:29 And then hit Overwrite to overwrite the default icon. 2:37 All right, that was the hdpi icon. 2:42 And if we open it, sure enough, there's our new icon. 2:45 Now let's do the same thing for each of the other icons. 2:49 Copy the mdpi icon and let's see if we can just paste it right over this one. 2:58 All right, that looks like it worked. 3:08 So let's do the same thing for the xhdpi icon. 3:17 Copy, paste, overwrite. 3:20 Xx, copy, paste, and overwrite. 3:27 And lastly, we've got triple x. 3:33 Paste and overwrite. 3:38 Looks good. 3:42 For the last step, 3:45 it looks like Android Studio has given us an ic_launcher_round folder. 3:46 In Android, you can specify both square and round icons. 3:50 However, for this project, we only have square icons. 3:55 So lets delete this folder. 3:59 Then let's open up the AndroidManifest and 4:06 delete this line where we set the roundIcon property. 4:09 Finally, we need to test that we can see our icon. 4:15 Let's run the app. 4:18 To see our icon, we can just go back to the home screen. 4:21 And if you haven't already dragged yourself to the home screen, 4:25 you can open up the app launcher and see it in the drawer. 4:28 Then you can drag it out to the home screen, And see our new Fun Facts icon. 4:32 And thanks to its transparency, we can see some of the background shining through. 4:40 Good job. 4:45
You need to sign up for Treehouse in order to download course files.Sign up