Android App Development for Complete Beginners | Lee Falin | Skillshare

Android App Development for Complete Beginners

Lee Falin, Software Developer and Data Scientist

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
9 Lessons (38m)
    • 1. Introduction / Trailer

      1:15
    • 2. Installing Android Studio

      1:37
    • 3. Create the user interface

      8:45
    • 4. Testing your app with the emulator

      3:49
    • 5. Adding behaviors

      7:37
    • 6. Testing your app with a real device

      3:09
    • 7. Making the app more interesting

      6:03
    • 8. Making the app look better

      5:21
    • 9. Conclusion

      0:28
83 students are watching this class

About This Class

833cb367

Whether you have prior experience programming or not, this class will take you step-by-step through the process of creating your very first Android app.

You'll learn how to get up and running with Android Studio, how to create a basic user interface, and how to make the application interactive. I'll also show you how to install and test your app on your own Android device.

Once you finish this class, check out part 2 below:

Transcripts

1. Introduction / Trailer: Hi, My name is Lee failing, and today I'm going to teach you how to create a very basic android application. Now I'm going to assume that you know absolutely nothing about Android development. It would help if you know something about programming. But even if you know absolutely nothing, you should still be able to follow my easy step by step instructions to create your first android app. I'm going to assume they have access to a relatively modern computer one built in the last 45 years. You have access to an android device and an Internet connection. Now, if you don't have access to an android device, that's OK. We'll be able to build and test the application without an android device. But if you have one, it will make the experience a lot cooler for you. Now, even though I'm going to assume that you know nothing about programming going into this process and I'm gonna give you step by step instructions, sometimes those instructions may seem a little overwhelming. If you're getting lost, just back up the video, pause it until you catch up and then move forward if you need to slow it down go back and re watch something. Whatever it takes to keep on track. Once you've finished your app, make sure you post a screenshot for the whole class to see. Now let's get started. 2. Installing Android Studio: Okay, so the first thing you'll need to do if you haven't already is download and install Android studio. Just go to Google and type in download Android studio. Click on the first link and that'll take you to this page where you can download Android Studio for your system. Now this download can take a while, so you might want to pause the video while you're waiting. After you've downloaded and installed the program, Go ahead and launch it and you should see something like this screen. Just click OK to say that you don't have any settings to import with Android Studio, you can create APS for lots of different types of devices smartphones, tablets, watches, televisions, cars and even Google glasses. Now this next screen will ask you what type of installation we want. We can choose either standard or custom. We'll go ahead and select custom because that will let us set some options that will save us time later. Next, we need to choose whether you want the light or the dark theme. I like the dark theme. It's a little easier on the eyes if you're staring at the screen for a long time, but you can always change it later. Finally, you're asked if you want to download some different components, these components will have to download eventually, so we might as well do it. Now you should check every box. These are things that we're gonna need for testing out our app once we've written it. So go ahead and check all those and then click next and then click finish to confirm. And now it might be a good time to go binge. Watch something on Netflix because this part will take a long time. So pause the video. Come back when everything's downloaded. Once you see the screen, that means everything's done. So click finish and you'll be greeted with the welcome screen, and now you are ready to begin your first Android studio project. 3. Create the user interface: So we're going to start by creating a new android application, and the first thing we need to decide is what the AP's gonna be called. Doesn't really matter what we put here. It should be something interesting that describes the app. We can always change this later if we need to. For your company domain, you can also type whatever you want. Android Studio uses this and combines it with the application name to create what's called the package name. The package name has to be unique for every application installed on the device. So if you have a website address, go ahead and type that in here. If you don't have a website address, just put your name dot com and that should probably be fine. So you can see is I change this value. How it changes the package name underneath. That's the unique name that we need for our app. Now the project location underneath is going to be just where the application is gonna be saved. So click next and were taken to the target screen on the target screen. Were asked what type of device and what version of android we want a target with our application, we can select any version of Android we want. But whatever version we select, our application will only run on that version and higher. As we change this setting Android studio will tell us what percentage of devices in the world will be able to run our application. Selecting a lower number allows us to run on more devices, but selecting a higher number gives us access to more features. Now there are a few different schools of thought about which version of Android to target. Some people say Take the latest version, go back one and that's what you should target when you're creating a new app. Other people say you should target the earliest version that you possibly can. That still allows you to create an app that does everything you want it to dio. In our case, we're gonna go ahead and select Android version six just because that's the version of Android I have running on my phone. If you have a different version on your phone, you should pick that now. Once we've chosen that, we'll go ahead and click next and then were taken to the activity screen and android every screen you see in your application is called an activity. Android Studio provides lots of different activity templates. Weekend used to start our app just to kind of kick started a little bit, but here we're going to choose. Just The empty activity will explore some of the other types and future classes, but for now, trees empty activity and go ahead and click next. Now every activity has two different files associated with it. One is called the Code File or the Java file. That's the one listed here as Main activity, and the other file is the layout file here, as it's called Activity Underscore Main. Now we're going to let Android Studio create both of those forests just to help us. Out of it will click finish, and then we'll wait a little bit while Android Studio creates all the different files for our program and connects them all together. Now, once the application starts to load, you'll notice a lot of the code is red, showing different error messages. There's a progress indicator at the bottom of the screen. This is happening because Android Studio is indexing the project and figuring out where all the files are and synchronizing everything. So we want to wait until that process is finished before we start editing anything. So we just wait for those progress indicators to finish. The code will change from red. Back to normal. You'll see the final indexing screen scroll across the bottom of the Progress Bar and then once progress bars air finished, we're ready to start now. You should see an editor here on the right and on the left a list of files and folders, if you don't. If you see something like this where you just have the editor click on this Project tap. And if it's set to the default project view, we want to switch that to the android view that will make it easier for us to find the files we want. And this is the view we should have when we start working on our project. Every screen in your android app is made from two files, an XML file that controls the appearance and a Java file that controls the behavior the XML file sometimes referred to as the layout while the Java files referred to as the activity the job of file for our main activity is shown here in the editor. When we first launched the program, the layout or XML file can be found in the resource is directory under the layout folder. Android Studio provides multiple ways for looking at our layout. This side by side view shows the preview of the layout as well as a wire frame mock up. We can talk back and forth between just the preview. Just the wire frame, mock up or the side by side view. Most of the time will be working just with the main preview. Another view of our layout will work with is the text view. Clicking into the text to you shows us the raw XML code that generates the layout. The design view shows us the preview of that layout again most of the time will stay in the preview mode, but sometimes we'll switch over to the text view in order to do some fine grained adjustments. All of the screens in our android app are comprised of layout containers. These containers hold controls that display things on the screen, such as text or button. When we have text on the screen, for example, it's held inside of a control called a text view. Likewise, and we have a button on the screen. It's held inside of a control called a button. These controls contained properties that we can modify in our layout file in order to change their appearance. If we click on this text inside of our layout, we'll see that this is a text view, a control that contains information about text to display in our layout. The main property for text fuses the text field, but we also care about the i d of the text view. By setting the idea of the text view, we'll be able to connect with it in our code file. We can use in a unique word to define our i D. So long as it doesn't contain spaces or other special characters. Many people like to add a prefix to the I D to indicate what type of control it iss, such as txt for a text. If you we'll also change the text of our text you instead of just saying Hello world will display a message to the user. Don't tap the button when we modify this property. Notice how it's immediately changed in the layout as soon as we leave the text property field by default. The text view is just big enough to hold the texts, which is what wrapped content means. We can modify that to match parent, which will make it big enough to fill the entire with of whatever container it's inside. We can then center the tax and modify its style, making it bold and slightly bigger. We can also modify the color of the text by clicking on this box next to the text color property were given a list of pre defined Android Resource is by selecting color, will see a list of all the different colors that Android Studio has pre defined for us. These air colors built into the android system. We can select this nice red color or we can define our own for now, will select one of the pre built ones. Notice again how the text immediately changes in the layout preview. Next, we'll add a button to our screen. We'll go over to the widgets, list a list of different built in controls and drag a button onto the screen notices we drag it around. Layout guides help indicate how the button will be laid out on the screen easily out properties are important because our app needs toe work and look good in various screen orientations and indifferent device sizes. Android Studio will let us preview How are apple? Look in different device sizes, such as a tablet in landscape mode compared to a phone in portrait mode. Notice how, when we select an item in the layout, the properties inspector changes to show the properties for that item, We'll give our button and i d of the button and modify its text to say Tap me. An important thing to note is, as we change these properties, it appears that the layout previews changing. But what's actually changing is the text that generates that layout preview. For example, here is the XML code for generating our text. You and here is the code for generating are but notice that the text has been set to tap me . If we modify the text directly in the XML file and then switch back to design view, we'll see those changes have been made there as well. Changing it back immediately reflects the change in the designer. We can also change the layout of our button in the designer by moving it up closer to our text to you. And then if we switch back to our XML, look, we'll see that those changes have been reflected in the layout properties. No matter how are device orientation or size changes are, button will always be 61 pixels below the text view. For now, let's put it right back in the center of the screen. 4. Testing your app with the emulator: There are two main ways to test your android app. First, if you have an android device, you can set it into developer mode. Plug it into your computer with the USB cable and test it that way. But if you don't have a device, you contest your android app using what's called the Android Emulator, a piece of software that's built right into Android Studio, which simulates an android device right on your computer. First, we'll look at how to test your app using an emulator. Then we'll look at how to test it. Using a real device, it started. Click on the Green Arrow at the top of the screen that will bring up the deployment target window. Since we've never used in emulator before. This window is currently empty, showing no USB devices or emulators to create an emulator for testing. We'll click the Create New Virtual Device button, which will bring up our hardware selection screen. We can choose to emulate any type of android device that's built into Android studio, from tablets to phones to TVs. For now, let's just choose the Nexus five and click Next on. The next screen will select which version of Android we want installed on the device. We can pick any version, but some of the versions will have to download beforehand. Since we already have version 7.1 point one downloaded, we'll go ahead and test with that version and click next on this screen weaken, specify additional options and give our emulator and name. You can just leave it with the default name or name it something that will help you remember exactly which version of android you have installed. Another device options. Once we're all set, click finish and our android emulator will be created. Now our newly created emulators shows up on the screen is an available virtual device that will select that and click. OK, now we only have to go through this process one time after that, this virtual device, this emulator will always be available. We can create new ones if we need to. Once we click OK, Android studio will start building and launching our emulator. Now this process can take a considerable amount of time the first time you run it. Especially if you're running Android studio on a lower budget PC. This little notification pop up. We see in the top right about the great ally invocation finished just means that our application built correctly and there no problems with it. So we'll just wait for the emulator to load. And then Android Studio will copy our application onto the emulator. Once the emulator does load, you'll see that there are several different controls connected to it that we can use to interact with the device. And as we move the emulator screen around, those controls will follow it from side to side. If we click on the orientation buttons, we can simulate rotating the device in two different directions. We can also power it off, adjust the volume, take a screenshot, zoom in and also interact with the home screen buttons that are available on all devices. Once the emulator finishes booting up, Android Studio will begin copying our app to the emulator. You can see kind of the status messages here along with the Progress Bar. Eventually our app will appear on this screen and there it is on. Then we can interact with it. Just a ziff. We had a real device. Now, right now, our app doesn't do anything, but it does look and behave exactly like a real android device would, and we can interact with the phone just like we would tap the home button to come back to this screen, weaken, swipe up using our mouths, find our app in the recently used apple ISS and rerun it now, since the emulator typically takes a little while to get up and running, my advice is not to quit the emulator. Don't click the quit button. Just click this red square in the top of the android studio window that disconnects android studio from the emulator. We can also minimise this emulator status window by clicking on this button on the right hand side. The next time we want to test our app. Since the emulator is already running, the process will go much more quickly. 5. Adding behaviors: in order to make our application Two interesting things. We now have to connect the layout elements to the code. Remember how we gave each item in our layout? An i d. When we compile the app Android studio collects all those ideas and put them together into a resource Is list organized by the I. D. Name in order for our Java file To be able to modify those elements, we have to use a function called find view by i d. This command will allow us to access those items in the resource is list to use it, we first type out, find view by I d and then tell it which i d we're looking for. Android studio provides a convenient way to do this using the r object by specifying are dot i d dot text message weaken access the resource with the idea of text message which corresponds to a text of you in our layout file. Once we have that resource, we can then store it inside of a variable of the correct time. This will allow us to modify the properties later on in the code here. We're going to store it in a variable called MSG, which is just short for message notice. The type of variable is text view, the same type of thing we put into the layup. With this stored, we can modify the properties of the control directly in our code, which will then change how the APP looks and behaves. We'll use this pattern over and over again, and our android development so and the behavior to our app. We need to modify the Java file that goes with this screen. You can find it in the Java directory. Now there are three directories here. We want the one that doesn't say test. Inside of there is a file called Main Activity, and this contains all of the behavior for that main screen of our application. Switching back over to the layout will select our button control and will verify that we know what the idea of the button is. Now. We go back to our job a file, and whenever we modify the Java file, it's nice to put in a little comment, just a little message to ourselves, reminding us of what we're doing. We can create a comment by using to forward slashes, anything we right after those slashes on the same line is ignored by Android studio. Now make sure you add the code in between these two sets of curly races. These belong to the on create function, the function that's gonna run automatically when the activity starts. Now, as I mentioned in the introduction, when we use the find view by I d function, we need to store that view into a variable the correct type, which in this case, is gonna be button. Unfortunately, when we use button, Android Studio tells us it doesn't know what a button is. That's because this file is missing the statement that tells Android studio how buttons work. If we hover over the button text, we can see that there's a way to add this automatically. To do so, just hold down the altar key or the option key. If you're on a Mac and press, enter Android studio, then automatically add the correct import statement to give you access to all of the properties that a button has another shortcut you'll notice as we start typing. If Android Studio recognizes the function we're trying to use, we can press tab or enter toe automatically finished typing that function. Now we've connected the button from our layout to a variable called the button inside of our code. However, before we can use it, there's still one more thing we have to dio See this red squiggle that indicates an error. This particular error is caused because the find view by I. D Function returns a generic view. But we're expecting something. Weaken store is a button, so we have to tell Android Studio that we know that this I d corresponds to a button. We can do that through a process called casting. Now, if we top on this, impress all to enter or option in Toronto, Mac once again, Android Studio will automatically fix this air for us. We'll just select cast to Android Button, and then it will insert the correct code to make this line work. When we're connecting things between the code and the layout, we need to make sure we know not only the I d, but the exact type of thing we're connecting. So when we click on our message here at the top, we can see that the type of thing is a text view. We can see that shown here on the left inside the component tree as well is in the XML view , switching back over to the designer. We can also verify the I D and then come back to our code and repeat the exact same process we used for connecting the button, including using our all to enter or option into a shortcut to import the correct library, creating the variable name. And we'll go ahead and cast ahead of time, since we know we're gonna have to do that and then use our find view by I d function to access the correct resource from our layout that we want to connect to now notice. Here I used a different name for my message variable than I used for the idea of the text message. These don't have to be the same, but it's usually best practice to make them the same. So we'll go ahead and change that, and now we'll add the behavior for our button. What we want to do is when the button is tapped, we want to change what's inside the text message. An important concept, an android Development is the concept of event listeners when certain actions take place in our applications, such as tapping a button or swiping the screen that is called an event. We can create event listeners designed toe listen for specific types of events. For example, when a button this tap, we could have something called an on click listener set up toe. Listen for that event so that when we tap the button, the listener will be notified. And then the code inside of the listener can execute, affecting how our app behaves. Coming back to our Java code, we can create an event handler or button listener by starting typing set on Android studio . Provide us a list with all the different types of event listeners available for the, but you'll notice there are a lot of different event listeners, one for each type of event that a button could particularly create. In this case, the default one is listed at the top, and that's the one we're gonna use set on clicked listener. There's a fair amount of code that goes in an event listener, but if we start out by typing new on and then press enter, Android Studio will create all of the code scaffolding we need to create an event listener that will respond to the buttons on click of It. Now, once again, our goals to change the text when the click happens. So we're going to get the text message variable and say text message dot set text. Then we'll put the string of characters that we want to display when that happens, in this case will say no. So let's review what we've done. We started with a button which we connected to the layout using the fine view by I D function. We also got a reference to our text view, which contains the message that the user is going to see when we topped the button, we added a non click listener to our buttons so that whenever someone caps the button, the code inside of the on click event will execute, setting the text of the button. Once again. This is a general pattern for android development. Get the views we using their I DS add some event listeners and then have code that executes in response to those events estar app again by clicking the green play button, selecting the emulator we created earlier and clicking OK If we can't see our emulator, we just need to select it since we left it running. And then Android Studio will begin copying our application over to the emulator, and then we'll launch it. Once our application launches weaken, tap the button and watch the message change in the text view. Congratulations. You just created your first android application. Once again, Don't close the emulator. In case you want to make some changes, just click the red stop button and you can modify the code. You can modify the layout and play around and see what else you can create. 6. Testing your app with a real device: Now, if the emulator is not working for you or if you just want to test with the real phone, you can do that by going into your settings and then scrolling down until you see the about button. Tap that and scroll down to the build number and cap it seven times. You should then see a message that says You are now a developer that puts your phone into developer mode. Back up one screen, and then in your settings, you'll see a new option. Developer options. Tap that and scroll down until you see something that says USB debugging. Switch that on and that will allow your phone to connect to Android Studio so that you can copy applications to it directly from your computer. The last thing you need to do is just plug your phone into your computer using a USB cable . You should be ready to go now when you're in Android Studio and you click the green play button to test your application, you'll see your phone listed in the available devices list. Notice how it shows with a blue rectangle instead of a purple to indicate that it's a real device. Now if you don't see your phone in that list, the problem is probably with your USB cable. Not all USB cables Air created equal. In order to save money, some manufacturers will leave out wires in the cables Onley, including the ones necessary for charging your device. But in order to connect to Android Studio, you need a riel data USB cable. The best option is to use the one that came with your phone. Now, once your devices in the list, if you click OK and the stream shakes and gives you a red air message, this means that the minimum sdk version or android version you selected for your app is higher than the one on your phone, which means your phone is too old to run your app. But we can fix that. All you have to do is go over to the left and select the option for great all scripts, Breydel scripts or files that contain information that Android studio uses to build your app. In this case, we're gonna want the second option on the list, not the top level build file, but the one that says module app. The 2nd 1 here, you'll see that there's a compile STK version and a minimum SDK version. We want to change the minimum version to the one that your phone supports. Once you've done that, click the sink now button and then wait a few seconds while the application re synchronizes with the new script. Once that status bar disappears, click the green play button at the top of the window again. Select your phone in the device list and click OK. Android studio will then ask you if you want to install the instant run library. Installing this library on your device will allow you to copy changes from Android Studio to your device much more quickly. But for now, we'll just say proceed without it. You can always add it later. Android studio. Then begin building your application, and once it's finished, it will install it on your phone and you'll be able to test it out just the same way you'd be able to use the emulator. However, what's nice about this is the application is now permanently installed on your phone until you delete it so you can disconnect the USB cable and show your friends and family the great android app you created 7. Making the app more interesting: Now, let's make our app a little bit more useful. So we'll switch back over to the Java tab. And instead of just setting our text to this static message that we're gonna use every single time, let's change it up a little bit and make it so that our app can tell a joke. Now, to set this up, we're gonna use something called strings. A string is a type of container we can use in Java to hold some text. So we'll create something called a static final string, which is a technique we use an android development Will. We want to create a string that we're gonna use somewhere in our app, some text we're gonna use, and we want to be able to refer to it by a name. In this case, the name is gonna be questioned. One. And the question string. The text we're going to use will just be knock, knock. This will be the first question of our job. I will create another static final string called Answer One, and this is the text we're gonna show on our button. So when we press this button, it will be like we're giving this answer, and the answer will be Who's their classic answer for a knock, knock, show the question or will then respond with the second question, which will be Boo. And then we will give the classic response to the knock knock joke for Answer number two, which will be Boo Hoo. And finally the questioner will give the punch line for a question three. Which will be Why are you crying? Not the funniest joke, but it will demonstrate the point. So there are the strings we're gonna use for our joke telling up. Let's go ahead and get rid of this old code that we have inside of our on click Candler. And now, before we set up the click handler, we want to create the starting text for both the message, text view and the button. So we're going to set the message text view to be starting with Question one, and then we'll set up the button so that its text will start with Answer one so that when we launch the app, the message will say Knock, knock, and the button will say Who's there now? Previously, when we tap the button, the on click Candler would run and change the text of the message. But now we're gonna want to change the text of both the message and the button. But we're gonna change them to different things, depending on where we are in the joke. At the heart of our Joe cap will be an if state an If statement is a block of code that says If this certain condition is true, then execute all of the code inside of this block. We can also tag on an else statement which says, If that condition is not true, then instead we should do this other block of code. This is how we're going to set up our knock knock joke application. So inside of our click handler for our button, we're going to use an if statement and find out what the current value of text messages by using the get text function will then compare that to our first question. If those are the same, then that means it's time to move on to the second part of the job. Notice inside of our if statement that we have to use a double equal sign to test if two things are equal. That's because a single equal sign will make one thing equal to another, whereas a double equal sign will just compare if they are equal. So if our message text is currently on the first part of the question, we want to set the message text to the second part of the question, and then we want to set the text of the button to the second part of the answer. So now our question message should say, Boo and our button message will say Boo hoo Now when we capped the button again will want to move on to the next part of the joke. So we'll add another question here using else. If that will say, if the first condition isn't true, then let's check the 2nd 1 to see if the message is currently set to the second question. Now, if that is true, then we're going to set the text view to the third part of the question, and we'll set the button text to the third part of the answer. So in this case, the text message should now say, Why are you crying? We don't actually have 1/3 part of the answer for the button. Instead, we want the button toe. Let us start the joke over so we'll add the third answer String to the top here, setting another static final string and we'll just have it's a start over. And then if we're on the final part of the joke where the message text is showing, the punch line will change the button text to say, Start over. We'll add a final else clause here so that if we are now in the last part of the joke, we will set the text view back to the first part of the joke and the button back to the first part of the answer. This way we can go through the joke as many times as we want, and it will always start back from the beginning. So let's review briefly what we've done first. Here at the top, we created a bunch of static final strings. To be able to cycle through is part of our joke. We set up the initial strings that are text view and our button would use. Then, in our on click handler, we set up a bunch of conditional expressions using if statements to be able to change the text of the text view and the button depending on what part of the joke we're on. So now let's test it out. Click the green button at the top of the screen, select your emulator your device and click OK, And if you're emulators not showing, select it. And now we can see our knock, knock, joke and only top are button. We're gonna be able to cycle through all the different parts of our joke, and we can run through this as many times as we want. So now you know how this process works. You can go into the code and change the text of the joke just by changing these message strings that we created at the top. Or you can change the entire format and do something different by switching up how the condition ALS work, experiment and post your ideas to the class 8. Making the app look better: So now that our application is more functional, let's work on making it a little bit nicer looking. First of all, let's style this background. So instead of a plain white background, we might want to change this color. Now you'll notice it in the properties view. There actually no properties related to the background color. That's because when we click on an item in the Designer, it shows us just the properties that thinks are most relevant for that particular type of control. If we want to see all properties, we can click either the View All Properties link or this double set of arrows at the top. Once we do, we'll see the complete set of properties related to the view that we've selected. I'm gonna go ahead and click on the background, and I'm gonna set its color to use the primary dark color. Now those pre defined colors are defined in the resource is directory. Underneath the Values folder, there's a file called Colors, and in here you can see three colors defined for our app. The primary color, which is used for the action bar at the top of the screen. The primary dark color which we have just selected. And then the accent color, which is used for controls that need an accent to offset it from the background. Now coming back to our application screen. So let's select our text and get rid of that garish red color and just make it a nice white and we'll go back to just the standard set of properties, and we're gonna make that text a little bit bigger. Let's make it 50 and we will not bold it. And instead of San Serif will go a Sand Saref light, which is a little bit thinner toe of a font. So now let's work on this button. So when we click on the button, we see that it's a very plain, but it's not the standard material design style of button. If we go appear to the style drop down, we see that there are a few different options we can choose from. Let's select the AP compatible button colored option. You'll notice that the color of the button is now the same color as our accent color in our colors dot xml file. So now that we've got our button style, let's go ahead and move it a little bit, so let's slide it down here until the layout Aero shows it is an offset from the bottom. And then if we switch over to the text view, we see that now we've got it. It's a line to the bottom with a margin of 89 pixels. If you ever see this message, you can just click the refresh button and usually that'll clear things up. Sometimes the layout designer gets a little out of sync with the XML. Let's make the text on the button a little bit bigger by changing the text size. Now, if you don't like the All caps, lick you can Congo that off in the textile property here, leave that on and then let's go ahead and actually bump this up a little bit bigger. We'll set it to 70. So now let's go ahead and run the app in the emulator and see how it looks on a real device . When that's done, building, it'll launch notice are knock knock joke text is there didn't tap that button? Get our answer. We can cycle through the joke and our font and our colors look a lot better than they did before now. One problem we had with our app is that every time the text changed for the button, the button change size. That's because the button layout with its set to wrap content, which means it will be just wide enough to hold the amount of content inside of it. We can fix that by setting it to match parent. That will give the button of fixed size, which will take up the entire width of the screen. Now that might be too big in some situations, such as this one, where it looks a little bit strange. I also noticed that in landscape mode are Button comes way up, overlapping the text. That's because of the margin between the button and the bottom of the screen. So let's fix both of those problems Now. We can fix both of these problems using the layout margin. Let's switch over to all properties, expand layout margin and let's set the bottom layout margin to just 10 device pixels, and we'll set the left and right to 30 that will shrink the size of the button. We switched a landscape mode. Now we're no longer overlapping the text up here, and also we're no longer extending all the way to the edge of the screen. Let's make one more change with our text. We'll click on that and go back to just the standard set of properties, and we'll change it from San Serif light toe, uneven, thinner font using the Sand Saref thin font setting. That'll make the text crisper and take up less room, and now we're ready to test again. Now there are lots of other customization is you can make your app, fonts, colors, styles, other controls you can add, experiment and have fun and make sure you post a screenshot of your project of the class. 9. Conclusion: Congratulations. You just made your very first android app that you can run on your own phone or tablet and show all your friends and family. So play around with it. Try to modify the tax, the colors, the layout at extra buttons and functionality, using the patterns that we covered in the lessons and post a screenshot of what you've created to the class, share it with the world and check out some of my other skill share classes where you can learn to create other, more complex after for both Android and IOS. Thanks for watching.