How To Make An Android App

Android development can be a great way to turn your idea into reality or start a promising career as an app developer and getting started is probably easier than you think these days, Android development is done with a tool called Android studio.

Android studio is kind of like the Microsoft words of writing Android apps. It helps organize our projects and gives us a user-friendly way to create what we’re. Looking for in this video, we’ll, walk through installing Android studio and then make an app don.

T worry. If you don’t, have any experience with Android or even programming in general. As long as you follow along, we’ll all end up at the same place. Now we’ll, download Android studio in just a second, but first let’s.

Look at what we’ll, be making these days. There are too many choices of everything so to help us choose between a bunch of options. We’ll, make an app that lets us specify how many options there are and then selects.

One at random, when we click a button awesome now that we know where we’d, like to end up, let’s, start by downloading Android studio click, the link below to go to the Android developer website and then click the download Button accept the terms and conditions and then download Android studio once it’s downloaded follow these steps to install Android studio, drag it into the Applications folder and then launch Android studio.

Since you won’t have any previous settings. You can choose, do not import settings, then click, OK, to complete the installation, and now we’re, presented with the Android studio setup wizard on this first screen.

We can just click Next for the install type. Let’s, pick custom and then click Next now we can pick our UI theme. I’ll, keep it as default and then, when we’re selecting our SDK components, I already have the Android SDK installed on my computer, but you & # 39.

Ll want to make sure this is checked, as well as the Intel haxon performance box, and since I’ll be running this on a virtual device. We’ll want to include an Android device as well. This is just a version of Android that runs on our computer.

If you have your own Android device, you don & # 39. T need to include this, but it’s recommended. If you’re going to continue doing Android development, then let’s. Click Next and we can accept the recommended choice here and click Next again and then finish once you’ve, downloaded all the components you might need to type in your password to allow it to install hexam.

Then let’s. Click finish and now that we’re running Android studio, let’s. Pick start a new Android studio project to get started. First, we’ll need to specify our application name. Let’s. Call it randomizer, then, for the company domain, you would put the web address of your company, so for me this will be teamtreehouse.

com, though really as long as you’re, not publishing the app to the Play Store. This can be whatever you want. Lastly, Android used to be written entirely in Java, but recently we’ve, been given the freedom to use Collin, which i think is a big improvement over Java.

Let’s check the include Collin support box and then click Next to continue. Next again – and then finish now, I know you’re, probably ready to get started, but before we get on with the app let’s, take a minute to talk about how an Android app comes together.

The first piece of an app is the layout which describes how the app should look and Android layouts are created by combining different types of views at its most basic. A view is just a rectangular area on the screen, but there are views that contain text, views that act as buttons and even views for holding other views and by combining all these different types of views, we can make pretty much anything the other piece of an App is the activity you can think of the activity as the code behind the layout.

It’s, where you tell your buttons what to do getting back to the code. It looks like we’re looking at our activity. It also looks like we & # 39, ve got an error and it’s, suggesting a solution. So I’ll click that accept the agreement and click Next and then finish that looks much better.

Now I’ll. Take a second to just make my screen a little easier to see and make my font size just a bit bigger. Okay, so Android apps have two parts: the layout and the activity, and right now we are inside the activity and if we look inside this oncreate function, we can see a line that says set content view our layout dot activity underscore main.

This is where our layout gets connected to our activity. As you might have guessed, this makes activity main.xml our layout. Let’s, click on it and see what we’ve got, and I’ll click right here. To hide this side section.

We can bring it back by clicking the project pane on this screen. We can create our layout by dragging and dropping views. We can also delete views by selecting them and then hitting backspace. Let’s, get rid of this hello world text view and then start adding some views of our own, so click it and backspace.

The views are up here on the top left, so if we drag out a button, we’ll get a button. Now, one thing to call out is that we’re. Putting these views inside of another view, called a constraint layout.

What’s? Cool about a constraint layout, is that it lets us position the views inside by using constraints which, let us chain Meuse together. It makes creating a layout super simple. Let’s, try using constraints with our button to make it look like it does and mock-ups to align it to the bottom start by selecting the button, then click on the bottom white circle and drag it to the bottom of the screen to make The connection notice that it doesn’t quite make it to the bottom.

This is because our constraint contains an 8 pixel. You can see the details about a views constraints up here on the right and if you want to change the buffer, you can type in the box or select a value.

Let’s change our buffer to 24. Next, we need to Center our button to Center something in a constraint layout. You just constrain it to both the left and right sides. So let & # 39. S drag the left side to the left and the right side to the right.

Also, you may have noticed that we have two screens here. The left one is showing us what the app will look like and the right one is more of a blueprint view showing us all the little details behind the app you can toggle between showing the design.

Just the blueprint or both by using this button up here so just to make things a little easier to see for this screencast, I’ll, be using the design view, but keep in mind if you want to see the blueprint view it’s, always there awesome now to make our button say roll.

We just need to update the text attribute over here on the right, so we’ll, delete button and type roll, and let me make this just a little wider, so it’s easier to read. We can zoom this into. The last thing we need to do with our button is make it wider to change the width of a view you just update the layout with attribute.

Let’s, make it take up the full width of its constraints. By changing this to match constraint, then to make this match the mock-ups, let’s, change the buffer for both the left and right constraints to 96.

Now that we & # 39, ve got our button, let’s. Add our selector and Android that type of view is called a seat bar to find it click on widgets and then drag out a seek bar discreet. Then let’s constrain the bottom of the seat bar to the top of our button and the sides to the sides of the screen.

Let’s also update the buffers for those constraints to be 32 for the sides and 24 for the bottom. Finally, let’s change the layout width to match constraint, and we’re good to go the next piece. We need is a textview that says how many let’s, click on the text, tab and drag out a textview.

Then let’s, constrain it to the left edge with a buffer of 24 and to the top of the seek bar with a buffer of 16. Last but not least, let’s change the text to how many next let’s, grab a horizontal divider from the widgets tab and constrain it to the top of how many with a buffer of 16.

For the last step, let’s, drag out one final textview and position it and the middle of the remaining space by adding constraints to each side, one to the left, one to the top one to the top one to the top one to the Bottom and one to the right, then let’s, make the text start empty and change the text size to 144 SP.

If text size, isn’t visible over here on the right click, the view all attributes scroll down all the way to text size and set, it is 144 SP. All right, our layout is all finished, but before we get back to the activity, we should give our views some better IDs.

Let’s, pivot, back to view fewer attributes and change. This last text view from text view to two results text view and then let’s; click on the button and change its ID from button to role, button and click.

Yes, okay, let’s, flip back to main activity and start wiring. Everything together, we’ve, already seen that we connect the activity to the layout. With this set content view line, let’s, add some space below that, and then we need to create variables to represent our views and Kotlin there’s.

Two ways to create a variable, Val or VAR val is for things that don’t change and VAR is for things that do. For example, if we were creating a person, their birthday would be a vowel, since it doesn’t change.

What has something like what they want for dinner would be a VAR let’s start by creating a variable for a role button. Let’s, leave a space after set content view and on the next line, type val role button and set it equal to find view by ID and then inside these two carrots.

Let’s type button and hit enter to make sure it gets imported and then inside the parentheses we’ll, put the ID of our button after our that ID, so our die ID dot roll button. This finds our role button from the layout and assigns it to a new variable named role button.

Now let’s, do the same thing for a results: textview and our seat bar val results, textview equals find view by ID, and we can hit enter to autocomplete. That and inside. The angle brackets well need to make this one a text view and use the ID our die ID that results text view then for the seekbar Val seekbar and this equals find view by ID and then the angle brackets.

This time we’ll. Put a seek bar make sure to hit enter, so it imports itself automatically and then for the ID of the seek bar. It’s, our die ID and it defaulted to seek bar now that we & # 39. Ve got access to each of these views.

The next thing we need to do is make something happen. When we click on a button, let’s, add a space and then on the next line. Let’s type roll button, dot set onclicklistener and choose the option with the brackets then hit enter to give us more space in the brackets inside.

These brackets is where we’ll specify what should happen when we click on our roll button. First, we’ll, get a random number based on the value of the seek bar, and then we’ll, set that random number.

As the text of our textview, so let’s, create a new Val named Rand and set it equal to random and hit enter to make sure it gets imported. Then parentheses dot next int and pick this option where we pass in an integer to bound it.

This will give us a random integer from within a certain range. Let’s type, seek bar dot progress to have it generate a random number between 0 and the value of our seek bar then, on the next line. Let’s, set results, text view dot text equal to R and which is our random integer dot to string since Rand is an integer.

We need to turn it into a string before adding it to our text view and that’s. It now to run the app let’s. Click on this play button up here, then you should have a virtual device from when we installed earlier.

If you don’t, you should be able to connect an Android phone to your computer with a USB cord and see it up here to choose it as a running target. I’ll pick my virtual device. Then we & # 39, ll click proceed without instant run and it should boot up a virtual device and run the app and there we go.

We & # 39, ve got the app and if we click roll, we get random numbers between 0 1 & amp. 2 and if we put it all the way up at 10, we should get between 0 & amp 9, though. Ideally, we’d, have it go from 1 to 10, instead of 0 to 9? Also, we might want to make this text a little bigger and it looks like our divider isn’t quite centered, so getting back to the code first to make.

It show a number from 1 to wherever our progress bar is instead of starting at 0. Well, just add 1 to this number right here, then, to fix the issues with the layout, go back to activity main.xml and let’s.

Make the text bigger by clicking on this coming in to text size and let’s. Try 24s B, let’s, see how that looks. That looks a little big. We’ll back that off to 16. That looks better. Then, for the horizontal divider, if I can click it there, we go.

We’ll just want to constrain that to the right and to the left, and we can check if we got it constrained by looking at the constraints up here on, the right looks like we’re still missing that left constraint there.

We go all right, then we can run the app again by clicking on the green play button and if you’d like it to not show this dialog each time, you run an app. You can check this box down here awesome now.

If we run the app again, it looks much better and we get 1 2 & amp 3. Instead of 0 1 & amp, 2 crate chopped creating the app. I know that was probably a lot to take in and you might be feeling a little bit overwhelmed, but don’t worry that’s, pretty much everyone’s experience.

It takes time and a lot of practice to get good at anything, and while you may not have a deep understanding of Android, you’re off to a pretty good start. I’m, a teacher at treehouse, an online school where you learn at your own pace at $ 25 a month you get access to the beginner Android development track, which has on-demand content.

That includes videos, quizzes and code challenges, teaching you, the ins and outs of Android, one step at a time, click the link at the top of the description to start your seven day, free trial at treehouse and get started on the beginner Android development track.

Buy Now Android Application as from $18