How to Make Android Apps with No Programming Experience | Philipp Muellauer | Skillshare

Playback Speed

  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

How to Make Android Apps with No Programming Experience

teacher avatar Philipp Muellauer, Learn to Make Apps with No Programming Experience

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Lessons in This Class

16 Lessons (1h 30m)
    • 1. Introduction to the Course

    • 2. Tools and Materials (Android Studio 2 and Java)

    • 3. Setup for Android Development on Mac (Android Studio 2)

    • 4. Setup for Android Development on Windows (Android Studio 2)

    • 5. Configure Android Studio for More Productivity

    • 6. Setting up an Android Emulator with HAXM

    • 7. Make a PC Run Faster: Windows Performance Tips

    • 8. What You Will Make

    • 9. Start a New Project and Work with the Theme Editor

    • 10. Generate App Icons and Add Graphics

    • 11. Design a Screen with Nested Layouts

    • 12. Using Variables and Linking Layout Elements to Java Code

    • 13. Use the Logcat and a Listener to Check if a Button is Pressed

    • 14. Create Random Numbers in Java

    • 15. Java Arrays and How to Use Them

    • 16. Where next?

  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.





About This Class

We provide the fastest way to learn how to code and start making industry standard apps. The best part? You don’t need any prior programming experience.


Learning to code is intimidating. There’s all that syntax, all those new words and unintuitive software to get your head around. It’s hard to know where to start.

Beginning App Development was lovingly crafted to be the fast track train that takes you to this new and exciting world.

Whether if you want a change of career or to make your first prototype App, this course is the perfect launch pad.

Don't take our word for it!

Feedback on our online course:

"Great videos, best learning videos I have seen." - Keef Garr

"I like the way you explain, easy to understand, make our life easier." - Rio Lim

We're not your average online tutor.

We at the London App Brewery have spent years training people with no programming experience how to code and make apps in our London classroom. Here we relaxed have small group lectures, one-to-one teaching and you even get beer at the end to reward your coding!

We've been running weekend crash courses for both Android and iOS Development for a long time, so we know all the questions you might have even before you can think of them. We've explained hard-to-understand programming concepts thousands of times, and we've figured out ways of explaining it to the visual, auditory and kinesthetic people. We've seen every variation of programming questions and we'll do our best to answer all of these in our course.

We want to teach the world to code but we don't have enough manpower to meet you all and teach you in person. So that's why we are starting this online course, where we hope to be your companion on your app making journey. But we are more Yoda, less R2D2.

Feedback for our physical course:

"Like a lot of people I have an idea for an app every other day. I was very impressed by Philipp and Angela’s ability to understand, explain and resolve every single problem I ran into. It’s comforting to know you’re in safe hands when trying something new and technical." - Michael Maiga, Entrepreneur.

"I had a great time on the London App Brewery course and it was revelatory to me that I could make so much progress in such a short amount of time. That’s entirely down to the teaching standards, which are top notch. Strongly recommended to anyone who wants to build an app or just understand how they work." - Aidan Russell, Accountant.

"The London App Brewery teaches you how to code and design apps by walking you through the most influential apps in the market. I started with zero Java knowledge and at the end, I found myself in “the zone” solving the “Challenge” (mock app development briefs). All my questions were answered and barriers to app development evaporated. This workshop will kick start you." - James Leung, Product Manager.

Meet Your Teacher

Teacher Profile Image

Philipp Muellauer

Learn to Make Apps with No Programming Experience


I’m Philipp, I’m a data scientist and mobile developer with a passion for teaching. I’m the lead instructor at the London App Brewery for machine learning and Android development, fluent in Python, Java, Swift, Dart, and VBA.

I’ve taught thousands of students in-person in our London classroom and lead our corporate training, used by companies such as Google, Amazon and Twitter. I'm always thinking about how to make difficult concepts easy to understand, what kind of projects would make a fun tutorial, and how I can help you succeed through my courses.

See full profile

Class Ratings

Expectations Met?
  • 0%
  • Yes
  • 0%
  • Somewhat
  • 0%
  • Not really
  • 0%
Reviews Archive

In October 2018, we updated our review system to improve the way we collect feedback. Below are the reviews written before that update.

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

Take classes on the go with the Skillshare app. Stream or download to watch on the plane, the subway, or wherever you learn best.


1. Introduction to the Course: Hello, everyone, and welcome to the world's best online programming calls Brought to you by the London AP Brewery. My name is Philip, and I'll be your instructor for the duration of this android app development course. I'm an android developer and also one of the co founders of the London AP Brewery. So what do we do at the lab? We've been running courses in programming, an APP development for a number of years and have taught of a full 1000 students. Our past students included employees working at companies such as Google, LinkedIn and Goldman Sachs, as well a startup founders who have gone on to launch their own app businesses. So what will you be learning on this course? You will be coating up and building over 10 popular APS from the APP store to guide you along your journey. The course includes many hours of video content, complete with clear explanations and beautiful animations. That way you'll understand exactly what it is you're doing as your programming, your own APs and following along with the tutorials, you'll be programming all the android apps natively in Java using Android studio, and after you've built each after, we'll show you how you can run it on your own android phone or tablet. And if you don't have a physical android device, handy, fair. Not You can always run the abs on a virtual device like the Android emulator. The piece of software that will be using to build on the apse is called Android Studio. Android Studio has been developed by Google, and it's free to download and install. And that means you'll be using the same development environment that's used by professional android developers every day to design and program and adapts, as well as to get APs ready to be published on the Google play store. Now I have done plenty of talking, but we relieve and learning by doing and the next videos. I'll show you how to get your machine configured to get set up with Android studio. I'll see you there 2. Tools and Materials (Android Studio 2 and Java): in this video, we're gonna go over all the tools and kids you need to develop Android APS. So first off, you're gonna need a Mac or a PC. You could be running Windows Lennox or Mac OS. That's all fine. As long as you have a laptop or desktop computer that's not a chromebook or a tablet, you'll be all right because on that machine you'll be installing a software called Android Studio, which will be using to make our APS and Android studious. Fantastic, because you, right, hold your code in it, and it makes that a lot easier. But you'll also be using Android student to design the apse. When it comes to running your APS, you'll either use physical android phone or tablet that you have plugged into your computer . And if you don't have one of those, you're gonna be using Android Studios emulator that's going to be running a pretend phone on your machine. However, I'll say this Thea Android emulator isn't the fastest thing in the world, and you might as well invest in a cheap android phone for development purposes because they'll just make everything a lot more fun. Now, question that we get a lot is why not use a cross platform tool to make and adapts? Why do we have to use Android studio to make the app natively? Because there's three popular cross platform tools that people use. There's Phone Gap, which is gonna please Web developers for familiar with HTML CSS and JavaScript. There is Samir in, which is great for, ah, dominant developers who already familiar with C shop. And also there is absolute utter titanium which again uses uses JavaScript. But there's four main reasons why we choose to develop maps natively. The first reason is performance. Most cross platform tools result in APS that are quite sluggish and unresponsive, and it's very difficult to track down why the performance is not great, and it's even more time consuming to try and improve it. The second is the size of the community. What you want when you have a problem, is that when you google it, you want that solution to come up as the first Google search result. If there's fewer people using a particular tool chances on, there's fewer people who've encountered that particular problem that you're encountering, which makes finding a fix a lot more difficult. And for those who have a nap company are looking to hire developers. The have fewer people to choose from when it comes to experience with Zama, rain or phone gap or titanium. And that's an additional challenge if you're running an APP business. They're also design issues associated with cross platform tools. You pull up whats app on iPhone? Next to WHATS app on a android phone, you'll notice that they actually look quite different. The layouts of the app don't match, and that's because iPhone and Android design guidelines are quite different. And any cross platform app that you make that looks the same on both platforms will look really weird to its users. So what ends up happening is that you end up running two separate APs write your code is going to start looking like if Androids do this and look like this, if IOS do this and look like that, and that completely defeats the purpose of the right once and deploy anywhere mantra that thes cross platform tools. Half, However, there's one big exception, and that's games. So for games, there are some fantastic cross platform engines out there, like unity or unreal. You really want that candy crush game to look the same on both IOS and Android. Phones and game engines provide a fantastic structure and framework for making gay maps. The last piece of the puzzle is Thea Android developer account or publishing account, As Google sometimes calls it. This is what you need to publish an app toothy Google play store. And it involves associating a Google account with the Android developer console and paying Google one off $25 fee, which is in contrast to Apple's $99 a year to have your APS listed on the Apple App store. But in both cases, I'd say Hold off on paying any money to Google or Apple on setting up a developer account until you're ready to publish your app. Great. In the next lesson, I'll show you how to get set up with Android Studio and configure your machine for Mac and Windows 3. Setup for Android Development on Mac (Android Studio 2): in this video, we're gonna talk about how to set up for and, er, development on a Mac. If you don't have a Mac and are planning to build, Andrew adapts and a Windows machine skip ahead to the next video. So first off, you need something called the Java Development Kit. The job a development kit includes things like the Java runtime environment and the Java compiler. So how do we check if we've already got it? Click on search and open. You're open your terminal from there. Just type Java space dash version. Now if you've already got Java installed and your version number will public here and we're looking for something 1.8 or higher. So I've got 1.8 point zero underscore 77 and that's fine. If you don't have the job of development and environment installed, you will see a different message. You will see something like this. No java runtime present requesting install. If you don't have the job, a development environment installed or you don't have at least version 1.8. Then type in download Jolla Development Kit into Google and head to the Oracle website on the Oracle website. You should see the latest job a development kit available for download. So just click. Accept license agreement and then over here, download the GMG. Once you've downloaded the DMG, just double click on the icons and go through the regular standard installed process after you've successfully installed the job. A development kit. Let's check the terminal one more time to see if we've got the correct version. So such for terminal and then type in Java hyphen version and just make sure it says at least 1.8 on here. Now it's time to install Android Studio. Let's say Download Android Studio and we're gonna head to developer dot andro dot com And here we're gonna grab Android Studio for Mac. We're gonna accept the terms and conditions and download another DMG. So you opened at the M G and drag it to your application folder, then simply fire up and write studio. It's a big program, so if you've got an older computer might take a while until it fires up. You might also see a prompt like this, so just select. I didn't have a previous version of Android Studio, and I do not want to import my settings, and after it's booted up, you'll be dropped off at this welcome screen. The first thing you actually want to do after you've just downloaded the Android studio is you wanna click on figure and you wanna click check for updates, because chances are there's probably some updates that you can download on install. Great. Now that we've installed Android Studio. If you have a physical device, now is the time that we configure it so that we can install our APS on it. So go to your settings in your phone, and you probably have to squirrel all the way down to the bottom where it's is about or about phone. And there you have to look for something called a build number. So on this HTC, it's under software information, then mole, and there it's buried as, ah, line item. You click on that seven times a tap on its seven times, and after a while you start getting these messages. Your ex steps away from being a developer. After you tap it seven times you become part of the secret club and a secret menu up his that was previously hidden. So under your settings, you should nasty something called developer options, and you click on that. And there you see a thing called USB debugging. So you want to make sure your enable that because that option is crucial for making sure your phone is being recognized when you plug it into your computer. So for comparison, here's a nexus device, and there's again. There's the out about phone section that's organized slightly differently, and the build numbers there in the men, you just have to hunt around for it, depending on what kind of phone you've got. After you have enabled developed remote on your phone or tablet, find your USB cables. Now mind you try to find some quality ones either the ones that came with the device when you bought it, or some good ones that you got off Amazon. Finally, what we're gonna do is we're gonna open Android Studio and start a new project just to check. Everything is working to make sure that our phone is being recognized by the computer. So just start a new project in Android Studio and just click next a couple of times in the Wizard to start a blank project here and just wait for Android studio to create the project . After Androids, did you finish? Is building the project. It should drop you off in a screen like this. Now click the android monitor down here and it will open up this little tap and initialize the so called android debug bridge and this is responsible for talking to your device. Now plug in your android device into your computer and wait for a bit. And what should happen is you should show up here and you should see log messages starting to scroll through the law cat. Now, if you don't see that, then maybe you haven't enabled USB debugging on your device. So double check that the easiest would have checked. That is to look at the status bar on your android device and look for the android shape, the bugging symbol, or you've got a bad or damaged cable. So in my case, you can see that it connected, But then it disconnected right away. And that's because the cable that I've used is not very good, and it's got a bit of a loose connection. So I hope you got everything working and you manage to iron out any issues that you encountered. And the next lesson we're going to configure Android studio so that it's a bit more user friendly and speeds up our workflow. 4. Setup for Android Development on Windows (Android Studio 2): in this video, we're gonna talk about how to get set up for Android development on Windows. I'm gonna show you all the tools that you need to download to get set up for making Android APS on a Windows machine. Now, for part of this demo, I'll be sharing a screen on a machine that's running Windows eight. If you're running, Windows 10 will might be slightly different, but it shouldn't be too far off. The first thing we're going to do is check if we're running a 64 bit or 32 bit machine. So go to your control panel. You can find it under settings control panel and then click on system. And there you'll be able to find your system type. Mind says 64 bit operating system. So make a note. If you've got a 64 bit or 32 bit machine, most modern computers will probably be 64 bit. Now it's time to check if you've got the Java development kit. The Java development kit is what you'll need to make android APs or any job a program for that matter. The J. D. K includes things like the Java runtime environment and the Java compiler. Here's how you can check if you've already got Java installed and can move on to the next step. If you already set up with Java, you should be able to see a little icon on your control panel that reads Java. However, you'll also need to make sure you've got a relatively recent version. So click on the icon and then click about and here you'll see it build number. This should read 1.8 or higher, so don't have the very latest one installed. Mine reads version eight updates 77 Which is fine if you need to get hold of the J. T. K. The easiest ways to type Java development kit into Google and head to the Oracle website on the Oracle website, you'll see the latest Java development kit available for download. To download the Shady K, you first have to accept the license agreement, so click accept and scroll down the list of options now for Windows users, there's gonna be two options that are gonna be relevant. They'll be the 64 bit version, the X 64 then there will be 32 bit version which confusingly is labeled X 86. Now, if you've got a 64 bit machine like myself and almost every computer that you would have bought in the past three years is 64 bit, you're gonna download that X 64 dot exit file. Otherwise, you're gonna pick that file above to match it with your chips it once you've downloaded the file executed and just follow along with the wizard after the J T. K has finished installing, pick your destination folder and endure Oracle bragging How many devices from Java? After a successful install, you'll definitely see that Java icon appear in your control panel, and when you click on it again, you'll be able to double check the version that you've just installed as long as that version number reads eight and above your fine. Now it's time to install Android studio Search for Download Android Studio in your browser , and then we're gonna head to developer dot andro dot com. From there, we're gonna download the latest version of Android Studio. Again. We'll be presented with a wizard where we have to agree to the terms and conditions. How wonder who actually reads thes I'm pretty sure that by now I've promised somebody my firstborn child not 100. Studio is actually a pretty large file, and it seems to beginning Laja with every update. Version 2.1 was 1.2 gigabytes, and version 2.3 is already 1.9 gigabytes. After the download has finished, followed a set of Wizard to install it, you'll probably be presented with some sort of dialogue box just like this. Just click. I do not have a previous version of Android Studio and Click OK, now, after you've done all that, here comes the best thought Fire of and Red Studio. It's time to start that program now, as you could already tell by the download file Size Android. Studious, Pretty enormous, and it's it's pretty greedy program to If it takes ages to run Android studio and your computer is slow and frustrating to use, then check out my other video. We have put together some performance tips to speed things up a little. Now, the first thing you actually want to do after installing 100 studio is check for updates. Click on that a little gear icon word says configure and select check for updates. Chances Are there some updates available that you should install? Okay, so now we've got the JD case sorted and 100. Studio sorted. Now it's time to configure our physical device step. We can install a raps on it. Take your physical android phone and go to the settings and then in the Settings scroll all the way down where it says about or about phone. And there you'll have to look for something called a build number. So on this HTC that I've got, it's under software information and then more and Peritz Berry does a line item. Now start tapping on that build number after you've tapped on it. In a couple of times, you're gonna see these messages. Start appearing. You are X steps away from being a developer, so after you've topped that seven times, you become part of the secret Developer club and a secret menu up his. So if you go back to your settings now, you'll see a menu that was previously hidden, namely the Developer Options Menu. So go into the developer options for your phone and search for an item that reads USB debugging. Make sure your enabled USB debugging because taking that option is crucial for making sure the phone is being recognized by the computer. When you plug it in now, one of the difficulties with Android is that there isn't really one standard, and your menu might actually look slightly differently on your own phone. So let me show you a nexus device for comparison. So this next this device had the build number buried in the about phone section. So the message is, you're gonna have to hunt around a little bit for this stuff, depending on what kind of phone you've got and what kind of version of Android you're running after you've enabled USB debugging on your phone or tablet. It's time to grab some USB cables. We're gonna connect our device to our computer now. One thing I'll say about USB cables is make sure you get some good ones. Either use the ones that came with the device or use some good quality ones that you've got off Amazon. The way we're gonna check that everything's working is we're gonna open up Android studio, start a new project and plug in our phone to make sure it's being recognized and that way we can check that everything's working and we're all set up and good to go. So start a new project in Android Studio and go through the Wizard. Now, it doesn't really matter what you put in these fields for now, because we're just gonna start a blank project after you've gone through. The Wizard Android studio will start building the project, which may take a little while, depending on the speed of your machine. But after it's done, it should drop you off in a scream like this on the tab at the bottom left click on Android Monitor. This will bring up a small window at the bottom of the screen. At this point, you'll probably see a gray message reading initializing 80 B or Android Debug Bridge. This is the name of the tool that enables communication between your computer and your physical android device. Now plug in your android device into your computer. Keep an eye on the phone screen because you might see a prompt where you have to trust the computer that you just plug it into. If all went well, you should see long messages started to scroll in the android monitor. Now, if you don't see your device appeared, the Android monitor and those log messages scrolling There's a problem. Most likely is that you haven't enabled USB debugging. Take another look at the android device that you've plugged in in the status bar. At the top, you should see some symbols that look similar to these. These symbols indicate that USB debugging is enabled, and you should also be able to see this in your notification drawer. Another common problem is a bad or damaged cable. So for this demo of actually used a pretty crappy cable to show you what can happen even though I've got my HTC plugged in, it's currently showing as disconnected. And that's because the cable is pretty shoddy and it loses the connection if it's not at just the right angle. Also, some cables out there just charged the device. They don't actually transfer any data, so it's really worth investing in a decent cable. If you're gonna be doing any android development, it's also worth checking how your android devices connected to your laptop. So if you pull down the notification drawer, you should see something like connected as MTP media transfer protocol, but this might not necessarily be your default option. If you see something else listed here, like transfer files or supply power or use as media device, then click on that option and change it to MTP. Because otherwise Android studio won't necessarily pick it up now. One other thing that we've seen trip people up other than the USB debugging in the cable is , ah, device drivers. Right now, Windows Machine needs a driver for every piece of hardware printer phone that you plug in your graphics card. Everything's got a driver, right? And, ah, if all goes well, windows should be ableto automatically. Download and install the necessary drivers. When you plug in a new device, however, Windows doesn't always get it right, so you might have to actually download and install a driver manually now. Hopefully it won't come to this. But if it does, the Android Studio Developer website is actually good for helping people out on the same page where you've downloaded 100 studio, you can go to user guide and then under build and run your app. You'll see install Oh, am USB drivers. This is under a sub menu called Run APS on a hardware device. And there you'll see that the folks that Google have collated a list of manufacturers websites. So depending on which phone you've got, you can select the relevant one and Donald the driver. So I hope this video was helpful in getting everything set up in working. In the next lesson, we're gonna configure and tweak and with studio tiny bits that it's a bit more helpful with our workflow. I'll see you there. 5. Configure Android Studio for More Productivity: in this video, we're gonna talk about configuring and rates to do to make a workflow easier. But first, we're gonna create a folder on our computer where we're going to save all our projects. I'm gonna create mine under documents. New folder. I'm just gonna call it projects. But if you're on Windows, make sure you create your projects folder right on your local disk. So navigate to your C drive, right click and create a new folder there called Projects. And the reason this is important is because there is a window specific issue that you're gonna encounter if you don't do this later on, so create the projects folder directly on your C drive. Next, we're gonna fire up Android studio and change some of the preferences. So fire up the program, wait for it to load and then go to configure preferences on Windows. It's very similar. That menu is just called settings. Now, if you've already open the project and don't see the splash screen, you can always access the settings under file and then settings. First, we're gonna decide how we want hundreds to do to look and feel. We have a choice between a light theme and a doc theme, and I can tell you this when you're working on the computer for a long time, having it set a dock theme is a lot easier on the eyes. You can easily change the theme by clicking on appearance and behavior. Expand that clicking appearance and then here you can change the theme to document, which will be the doc theme, and if you click apply, you'll see the change applied instantly. The other thing people do is make the font size a bit launcher, so everything is a bit easier to read. So expand editor, then go to fonts and colors. Click on fund, and what you need to do is actually save a custom theme because you can't overwrite the existing default theme's So you just need to click save ass. Call it anything you want. Click OK, and then you're free to change the font size as you see fit. So this is a bit of a trial and error. See what font size looks good to you and then hit apply. The next thing we're going to do is we're gonna tell Android Studio to automatically import packages and components we're going to use. That means Android Studio will automatically insert some code at the top of far code files when it knows which component we want to use. So under the settings Goto, editor general and then click on Auto Import and Change Incident puts on pace from ask to all and then make sure there's a tick box under add unambiguous imports on the fly. Next, we're gonna tell 100 Studio about the naming conventions who want to use. This is more of a style thing, but it's very handy when we tell Entered Studio Toe Auto. Generate some code for us under the editor menu. Expand code style and click on Java. Then go to the cogeneration tab and under name prefix. Put an end there and understanding field type of Lower Case s and that's it again had applied to save your settings. Lastly, we're gonna check the installed SDK platforms. SDK stands for software development kit, and it's a package that allows you to build an android app for a particular version off Android. Under your settings or preferences, go to system settings and then find something called android sdk. You will also be able to type in sdk into the search bar to find this menu much more easily . And here you want to select those versions of Android, which you're targeting with your APS. So maybe pick the latest one and pick that version of Android, which you're running on a physical device that you own. You'll be able to find the android version off the device, probably in the same place we found that build number when we enabled us speed of bugging. Whatever you do, don't put a tick box next to all of these. There's no point in installing all the sdk platforms. All right, so in the next lesson, we're gonna talk about how to set up an emulator, and this is a pretend phone that's going to run on your computer. And it's really handy for testing APS on a device that you don't own 6. Setting up an Android Emulator with HAXM: in this video, I'm gonna show you how to set up an android emulator emulators air pretend phones that run in your computer. They come in handy for three main reasons. First off, you don't have to have a physical android device to test your app. Also, if you have trouble connecting it or you don't have your cable with you, you can always run your APS. Second, you can test your app on devices you don't actually own, so you don't have to buy an android where device to develop maps for the android watch. Lastly, you can run your app onto devices simultaneously. This is really handy. If you're testing a chat application, you can have the emulator up running the app, the same times your physical device. So, without further ado, let's create a virtual device. First, we're going to start a new project. We're going to call it my first app and under project location, we're gonna put it in the Projects folder that we created earlier. So click the three dots and navigate to the Projects folder that you created Windows uses. Remember you You created this projects folder directly on your C drive. Click next, you can leave the default settings here. They're fine. Then select empty activity and click next and finally, click finish. Anderson is gonna build your project, and after it's done it to drop you off at this screen, mind you depending on the speed of your computer, this could take a little while. You can monitor progress on the status bar at the bottom of the screen. Now that 100 studio has finished building our project. We're going to create a virtual device. Bring up the Android Virtual Device Manager. But either clicking the small icon here or going to tools. Android AIVD manager. As you can see, I've already created quite a few, but your list might be blank. So click on Create virtual device and then you see that there's a whole host of devices that you can choose from. You can create tablets, phones, android watches and even simulate Android TV. Let's create a nexus five X emulator so selected and click next. Andrews studio will then recommend a system image, which means they're giving your choice on the architecture er off the pretend phone. Now you want to make sure you choose something with the Intel based architecture because it's gonna run a lot faster. Also, chances are you've got a 64 bit machine. You want to choose something that says X 86 under school 64 If you've got a 32 bit machine and we went over how to check this in the previous video, you want to choose something that says X 86. The choice of a P I level is up to you and will depend on which sdk platforms that you've got installed for the purpose of this course marshmallow lollipop, a nougat will work just fine. So I've got a 64 bit machine. Someone choose Marshmallow X 86 a score 64 click next on the screen. You can customize the emulator a bit more, even to the extent of choosing how much ram you want to give it. So I'm just gonna click finish, and after it's done saving the virtual device, it will appear in your list. So let's test it out, hit the green place symbol and then wait for a bit, and you should see a new window up here and the android emulator starting up. Now, this could take a little while depending on the speed of your machine and depending on if you've got hardware acceleration enabled. So what do I mean by that? There's a component called Intel hacks. Um, the hardware accelerated execution manager that you can install with Android Studio. If you've got hardware acceleration enabled, you're going to see this message emulator running and fast the mode. If you don't see this message, you're emulator is gonna run much, much slower and you should probably install hacks. Um, I'll quickly show you how to install that. If you don't have it already, you'll find all the 100 studio components that you can install in the sdk manager. So either click on this little icon or go to tools and open the sdk manager. And here you can even launch the standalone sdk manager to get a much more granular view off all the different components. If we scroll right to the bottom, then we're going to see the Intel X 86 emulator accelerator hacks, um, installer. And this is what we need. We need to put a check mark there and click installed package, accept the license agreement and install now chances are when you first install 100 studio , it would have already prompted you and ask you if you wanted to install hacks. Um, but if you haven't, this is how you can find it. It's important to note that you're not done yet, even though it says installed. And also some anti viruses actually prevent you from installing this component successfully . So you might actually have to disable your anti virus in order to go through with this. The next step is navigating toe where you've got the android sdk installed. So this is under android sdk sdk location. Copy this path and then your explorer or finer navigate to this location. The quickest way of doing this is you go to the folder directly by pasting in the sdk location, and here we are, right, And you can see the path here Library, android, sdk. Then you would go to extras Intel hardware manager. And here it is. There should be that install file under extras intel and then this long folder name here, double click on the install file and follow through Ruthie install instructions. This is the point where you might have to disable your anti virus for a successful installation. Great. Now you should be all set up with your android emulator. But I think it's worth mentioning. There are some popular alternatives to the stock emulator that comes bundled with Android Studio. One of the most popular ones is Jeannie Motion. Now for a long time thes stock Android Emulator was very, very slow. But with Android Studio 2.0, it's gotten a lot lot quicker, and the main selling point of Jean emotion has always been speed. So I think for most of us, the standard emulator will work just fine. But for those of you are curious. And when I check out some of the other features these guys have packed into the product, head over to jean emotion dot com, and you can try out a free version of Jean Emotion. Just be aware that some of the advanced features may be locked behind a paywall 7. Make a PC Run Faster: Windows Performance Tips: Android Studios a big program, and it requires a lot of resource is to run. And if it's lag your slow, it can make the whole development experience quite frustrating. So we're gonna go over four quick tips to speed up your PC. Tip one is close All other programs. If you've got chrome or other things running, they take up quite a lot of resource. Is press control out? Delete and bring up your task manager. If you see this view, press more details and here you've got an overview over all the things that are currently running on your computer. So you want to make sure you close Ah lot of the other programs that are running simultaneously with Android Studio, and that includes particularly greedy programs like chrome. Also, click down here and see if there's anything else that's fired up during your startup. Like Skype or Ah, If there's anything running in the background that's taking a pre sources, you can check which start up programs are enabled by hitting the startup tab and six. Seeing which one is enabled. You can right click and disable them if you don't want them to fire up when you boot your computer took to after you've closed all the programs that you don't need and that run in the background, You can also give programs that are currently running mawr juice. So if you click on details and you sought by memory, you'll see that 100 studio is gonna be way up there. And if you right click and go to set priority, you can go to set priority high. And that means that the computer is gonna allocate Android studio mawr. Resource is, and this will make it run faster. Tip three is disabled. Or temporarily suspend your anti virus A B, G, McAfee, Norton. All those guys take up quite a bit of resource, and they continue checking and bright ing and reading from your disk as you're working. Now it's part of this tutorial. You're not gonna be doing anything dodgy. You're not gonna be torrente ing anything so you can safely disabled the anti viruses that you're running while working with Android Studio. That said, you're probably going to have to dig around in the options quite a bit because each anti virus program is different and they don't always make it easy for you to suspend or disable them. Tip full. You can also optimize windows to improve your performance, and this works by disabling animations and transparency, ease and a couple of other things. So open your control panel. If you see it like this, change it to large icons, then go to system an advanced system settings. And here on the advanced tab, you'll see performance. You can click on settings, and then you can either have a custom setting. Or you can click the radio button to adjust for best performance and click OK. 8. What You Will Make: In this tutorial, we will be making at Las Vegas dice up from scratch. Dicey is a fully fledged app that you can run on your phone to settle any school and satisfy all your gambling needs. Over the course of this tutorial will first design a fairly complex layout and then show you how to write the Java code so you can roll the dice and give dicey that authentic Las Vegas feel. Let me run the finished app in an emulator so you can see what it's all about. When I tap on the custom app icon, it will bring us to the main screen. In this layout, we have the logo up top and in the middle we have the two dice images, and at the bottom we have a button that we can press to change the dice images displayed on screen. The dicey app is an ideal app to get you started on android development because it brings so many things together when you build it. For example, here some of the key things that we will cover in this tutorial you will learn how to work with the layout editor to arrange elements on screen and create a complex layout. And you will also learn how to use and manipulate XML, which is the source code powering many files in an android project. And in the last part of the tutorial, we'll be diving deep into coding and address the most fundamental parts off building a working android app. In the process of building the sap, you will learn how to write the Java code to link the programming logic to the layout, how to detect taps on screen, how to implement ran immunization and how to use a raise to hold a collection of data. I can't wait to start teaching you guys so head on over to the next lesson. 9. Start a New Project and Work with the Theme Editor: in this video, we're going to create a new project, work with the theme editor and download the graphics for the dicey app to create a new project we're going to use Android Studio Set up Wizard. You can do this from the splash screen or, if you've got a project open, just goto file. New new project, said the application name too dicey with two e's for the company domain, you can have any value you want. This is only important for APS that you're looking to publish on the APP store. I leave mine as London apurate dot com, but you can use the name of a domain that you own or use your full name instead. For the Project location. You should save the dicey app to your projects folder that we set up. Remember, if you're a Windows user, this Projects folder should be directly on your C drive, then click next to go to the next step in the Wizard now 100 studios, asking us about the target devices. You can leave the default value for the minimum sdk. Here we're specifying the oldest possible device that can run the dicey app. In my case, the default is said to a P I Level 16 reading The little note from Android Studio were informed that based on the current usage stats, Dicey will be able to run on 95.2% off all android devices in the world. So if you're setting the minimum sdk for a P I level 16 you've pretty much got all the phones out there covered. Click Next and now Android Studios Wizard will give you a choice off a bunch of starter templates. Far app. Out of all these starter templates, select the empty Activity. It's pretty cool that the team at Google included these templates, since it really helps save time. When you get started and want to include some specific functionality, click next again and here we can leave the activity name and the layout, file names with their default values and now click finish. So you and I have to be patient Now, while the great ill bill tool sets up a project, you can monitor the progress at the bottom of Android Studio in the status bar. Once the project has finished building, we should be dropped off at the main activity dot Java file and all the red underlines on the text to disappear. Now let's check out the activity. Underscore main dot XML layout file to see what our app would look like at the moment. This is the layout template that's been given to us by Android studio set up Wizard. You can also find this layout file under APP rez and then lay out. Now, what you see on your machine at home may not exactly match what I've got on my screen right now. Depending on when you're watching this video, the layout template is generated by the set up wizard. And with every version of Android Studio, Google seems to be making small tweaks to the templates that there, including so the layout template generated with Android studio version 2.3 is not exactly the same as the one you'd see if you generated the layout with version 2.1. But don't worry. We're going to edit the layout so that both you and I will be on the same page in a few steps. If you click on design at the bottom of the screen, you're going to switch to the design view for this file and we can see here that the set up wizard gave me an action bar in our template. The first thing I will do is change my theme to get rid of this action bar at the top in the project. Pain on the left. Expand the directories until you see a file called Styles XML. With the project Pain displaying the android view, you confined the styles XML under APP Rez and then values the styles that XML file configures the overall style off our dicey app. We can enter the code in this file directly, but you can also see that Android Studios encouraging us to use the so called theme editor , either click on the suggestion or you can find a theme editor under Tools Android and then theme editor in the theme editor. We can see the styling, various android components in our app. If we were to add a button to the APP, it would be start like this and if we were to add a check box tore up, the default style would look like this. The look of all these components, from buttons to progress bars, two switches will depend on how we've configured our theme on the right hand side. For example, if we change the accent color to something else like green, we can see that all the radio buttons and check boxes and spinners will now use the green accent color by default. And we can also change the parent theme by choosing a different one from the drop down. The parent theme is just a theme on which the theme of our app is based on Go to show all themes to bring up a new window and then narrow down this list by putting in a filter. We only want to display themes in this list that do not have an action ball type in no action bar as one word and then pick a theme that does not have an action bar. Mind you, the list you see will depend on which android sdk is you have installed. I'm gonna choose the Apcom pat light, no action bow. But you could also choose the material no action bar or any of the other ones. But this one will do for me. After you've chosen your theme, click ok and navigate back to the activity. Underscore main dot XML layout file. We should now see the action part disappear in our preview. And if we navigate back to the styles dot xml file, we can also see that the style XML file reflects the changes to the accent color. And not only that, the parent theme is now also the one that we chose in the theme editor. In my case, I chose the APP compact thought, light dot no action bar Apparent theme. Now it's time to get hold of all the graphics that we will use in our app. We'll need to change the images on the DI after all right. Also, those default launcher icons that shipped with the template are really met. So open your favorite browser and navigate to the Ural that were including in the description off this video. This will send you to a location where you can download the ZIP file that contains all the image assets that we're gonna use in the APP You for using a Mac, simply double click on the zip file to extract the contents. And if you're on a Windows machine, right click on the ZIP file that you just downloaded and go to extract all. Now you have to specify where the files should be extracted to believe the bit of the end of the file path. And make sure you extract the contents to the downloads folder, then had extract. In the next video, we'll show you how to include these graphic assets in your android project and how to generate your launcher icons. I'll see you there. 10. Generate App Icons and Add Graphics: in this video, we'll show you how to include the graphic assets that you downloaded in the previous video in your project and generate the launcher icons with Android Studio. Let's take a look at the launcher icons that were shipped with the template when we created our project with the Wizard An android APS lan Try Cones are stored in the Mitt map folder under the Resource is folder. So let's expand the mid map directory and take a look at the contents. Here we can see several PNG files. Let's double click on the one tack with HDP I. And now let's open the icy launcher tagged with Triple X HDP I we can see that it's the same launcher icon just larger. In other words, the template for android app came with multiple versions of the same launcher icon. But these icons differ in their resolution. DP I stands for adults per inch, and the H prefix stands for high and, as you might have guessed, stands for Medium and Triple X stands for very high because the team at Google lacks imagination in there. Naming my bet is that large icons going forward will be in a new category. Quadruple x HDP I because that's how things are going. Now let's take a look at the official Android documentation on launcher icons and see what it has to say about this. There we can see under size and format that the triple X HDP I icons should be 192 pixels tall and 192 pixels wide. In contrast, an LDP I launcher icon is only 36 by 36 pixels. But this begs the question. Why do we need so many different sizes for the same launcher icon within our app in the first place? And the answer is, is that when we publish an app, we don't know what kind of device the APP is going to run on. Someone with a high end, non exploding Samsung phone could download and try to run a rap. Or, alternatively, my grandma, with her crummy five year old HTC, could be trying to run it as well. Point being, the APP needs to look good on both a large high resolution display as well as a small, low resolution screen, and this is why we ship multiple versions off our icons with our app and then let the android operating system off the device that the APP is running on. Choose which one to use and how it would be an absolute pain to try and create all the app icons individually and add them to our project one by one. Lucky for us Android Studio will come to the rescue right click on the rez directory and then go to a new image acid Select launcher icons as the icon type. Leave the file name as it is, and then for acid type pick image. Now we will point Android Studio to the location off a large version off the launcher icon . Click on the three dots and navigate to your downloads folder. Here. You should have extracted the dicey launch icon Master PNG as soon as we had OK to confirm our choice, we see that all the previews off the launcher icons have been updated. Now we can also check out this file directly in our Donald's folder. There you can see that the large version of this icon is 512 by 512 pixels, and this will serve as the base for creating all the smaller launcher icons. Click next in Android Studio and on this screen 100 studios, telling us where in our project, thes launcher icons are going to go and you can see hit that the launcher icons will all sit in the mitt map. Subdirectories of the Resource is folder. The largest icon will be in the Mitt map hyphen, Triple X HDP I folder and the smallest icon will be in the mid map Dash MDP I folder. The text is highlighted in red because Android studios warning us that we are about toe override and replace the existing default launcher icons from the template. And this is because we're using the exact same name for those launcher icons. But that's fine. It finish, and then we're done. Now let's verify that this actually worked in the mid map directory in the project. Pain Open one of the launcher icons to double check that it's definitely the new icon. Now, if we hadn't overridden our launcher icons but specified a different name instead would have to open another file called the Android manifest and point our app to the new launcher icons here by the file name Now it's time to add the remaining graphics to our app. Navigate to the folder with the graphic assets that you downloaded and there you should see several draw global folders. A draw global HDP I folder a draw ble no DP I folder and a draw Global X HDP I folder. While the mid map folders contain the launcher, icons that draw double folders contained the graphics that are used inside the APP. Let's have a look inside the draw Herbal x HDP I and the draw ble HDP. I folders there we should see six thighs, images and the casino logo. The draw Global No DP. I folder, on the other hand, has the velvet background image for the app. All we have to do now is add these folders to our project are android app will only know about the images that are located inside its resource is directory, so we need to move the graphics from our downloads folder to the directory off the APP. So how do we know what the correct folder is for android app in the project Pain inside Android studio, right click on the rez directory and choose reveal and Finder if you're using a Mac, if you're using a Windows machine, this part of the menu will read. Show an Explorer. Now click on showing Explorer to bring up the Project folder for the Android App on your hard drive. Make sure you've got the rez directory open and then simply Dragon Drop three. Draw herbal folders into it. So now the rez directory should have four different draw herbal folders. One without an extension, one with HDP I and one with the ex HDP I extension as well as one with the no. Dp I extension Back in Android Studio. This project pain should refresh automatically and 100. Studio will now recognize that the new graphics have been added to the project. If we explode the Draw Herbal folder, we should see to dice. One image is listed an HDP I dies. One image and an ex HDP id ias. One image again. These air the same dice images, but they're just scaled for different resolutions. Brilliant how we've added all the graphics for the app in the directories where 100 expects them to be. We've had it. The new launcher icons to the MIT Matt folder, and we've got the in APP graphics sitting in the draw will folder Now we're ready to start designing our app. I'll see you in the next video. 11. Design a Screen with Nested Layouts: in this video will dive deep orange, designing the look and feel of our app to design what elements are shown on screen will be working with a layout XML file now, since her up will only have one screen. We've only got one layout file to worry about the activity. Underscore main dot xml. File what you see on your screen right now. My not exactly mirror what I'm showing you at the moment. First off noticed there's a toggle between the source code of the layout file and this design view. I've got the design you selected at the moment. Selecting text here at the bottom will show the source code off the layout file instead. Also, there's different ways for you to style the preview in the middle of the screen in the toolbar above the phone preview we can set if we want to show the design or show the blueprint. Or so both the design and the blueprint we have itself to blueprint. We only see the outlines of the components on screen now. Finally, what's shown in the middle of the preview will depend on what came shipped with the template when we created the project. In essence, Android studio updates over time. Each version off the software has a slightly different starting template in 100 studio version 2.3. The template comes with a constraint layout and a text view for this video. We're not gonna be working with the constraint layout just yet. Instead will be working with another type of layout to help us understand how to arrange things on screen. First, we're gonna make sure that no matter when you're watching this video, that both you and I have the same starting point. Otherwise, it's gonna be really difficult to follow along. And to do that, we're gonna delete all the components that came with the template like this text view here to switch over to the source code in the layout file, but hitting the text toggle at the bottom and then copy all the XML code in the description off this video to replace the source code in the layout XML file simply select all and then hit paste. When we switch back to the design of you, we can see that we're gonna be working off a relative layout in the component tree. Now the goal of this tutorial is to get you familiar with designing a layout as a first step will be designing our layout with a particular device in mind. And only afterwards will we show you how to design a layout that looks good on various different screen sizes. So the first thing I will do is adjust the previews that it mirrors a device on which I will install my app. So I've got an older HTC, which is 4.7 inches, which matches the dimensions of the nexus full. If I was designing for a larger phone, I could pick the next six p, which is 5.7 inches. Or I could even pick the Nexus nine if I was designing for a tablet. If you're not entirely sure of your phone's screen dimensions, you can always head over to GSM arena and search for your model. I always wondered how big those exploding galaxy note seven Swor, and it turns out they're 5.7 inches, so that's quite a big phone to be catching fire. So if I had a galaxy note seven lying around and I wanted to design an app for it, I would probably pick the next six preview so that what I seen hundreds studio will be closely mirrored when I run the app. Next, we want to drag a button on screen that we can press to roll the dice, click and drag a button from the palate to the screen. Preview. Move the button into place so that you can see the dotted lines showing that the button is centered in the relative. Lay out and let go. Now you've done exactly what I have done. You should be able to check the source code and see the following two properties. Click on text and you should see layout center vertical and layout center horizontal set to true. This indicates that the button will be centered within its container. Now let's change the button text. After all, having a button read button isn't very useful. Remember, the best place to store arbitrary text like this is within the strings. XML So let's open it up here and add a new string. Let's call the string button text when I open my angle brackets, Type s and already also suggest will suggest string and had tab on my keyboard and then give my string the name button text when I move my coast over here and closed the angle bracket 100 studio will already helpfully close the whole XML tack for me as well. Now all I have to decide on is the value for that string I just made. I'm gonna put in role because that's what I want my button to read. Now I'm gonna go back to my layout. And when I changed this button text property to the string, I just made someone a type in that string and Anderson, who will already help me out with a suggestion. So you click the down arrow on my keyboard and hit, Enter and behold, the text of my button has updated because it now points to the string. Next, I'm gonna give that button a bit more of a descriptive I d. Every element on your screen should have an i. D. And it should be descriptive because this is the name that young used to refer to it later on. For example, if you were to have four buttons on screen and they were all called button one button to button three button full, then you will have a tough time figuring out what they do. So the more descriptive your name is, the better. So we give this button the I D roll button, and this is how will refer to it later on. So for those of you who are watching the video and building the app alongside me, I've got a mini challenge for you. Can you make the button blue and that button text white. To do that, you'll have to look at two properties. One of them is called text Color and the other one's called Background. I recommend you pause the video before I give you the solution in a bit. All right, here's how I would do it. I would go back to the design screen and look at all my button properties. Then I would scroll down until I find text color. Click on this and set it to white here. Then I would scroll back up and find the background color click on the three dots, so like color and said, it's a blue hair. Okay, now we're gonna start adding a few more elements to the screen, scroll down on the palate and find the relatively out, click and drag it into your component tree. Here, you can see it sitting right below the button. Now we're gonna add the button to this relatively out. We're gonna put the roll button and signed this relatively out. We could do that simply by selecting it and drying it down slightly so that black Arrow is right here and letting go. Now you can tell by the indentation that the roll button isn't signed the relatively out, which is inside another, relatively out. Let's check back to the source code click on text, and you should see here that the indentation of the XML code reflects what we saw in the component tree. Now we want to change the top level layout to a linear layout, and we could do that very easily by selecting the opening tag here and by typing L I N. And then using auto complete to insert the rest for us. When I hit Tab, both the opening tag and the closing tag are updated to read the nearly out. You can think of all these layouts as containers for arranging things on screen. You'll see how this works exactly in a bit a linearly out will arrange its contents at the vertically or horizontally, and we can set this in a property. So if you come in here and type orientation and hit tab, we have a choice off setting the orientation to horizontal or vertical pick, vertical and hit. Enter not. Let's set the background for AP simply by adding the background property to the linear layout. Start typing bank and use auto complete to help you out it tab and then scroll down until you find at reliable new background and hit Enter. Great. So now we've got that nice felt canvas thing going on. Let's switch back to the design of you and then add another relatively out to our component tree. Now you'll notice that can be a bit tricky putting this in the right place. What you want to do is you wanna have that little back arrow pointing at activity on the school main at our top most linearly out. If you do that, you'll have the same indentation between these two layouts. However, if you missed, you might end up with something like this where you've put this new relatively out inside the layout, where you've got the button, just click and drag it back up to make sure these air indented by the same amount. Next, we're gonna add an image. You to this relatively out that we just added, We're gonna scrolled on and from the palate. When a groundless image you here, drag it down to the component tree and let go. When that black arrow is to the left of the new relatively out, then I'm going to select our Las Vegas dicey logo. Click. OK, fantastic. So in the component tree, we now have a relative layout that contains an image view, another relatively out that contains the roll button. Wait a second. Where's the button? On the preview? It's Ah, it looks like it's off screen That has to do with how much space this relative layout, with the image you takes up, can see the preview that it takes up the entire screen. So let's take a look at these properties. We've got layout height said to match Parent, the parent is whatever is indented to the left, so the parent of the relative layout is the linearly out. The parent of the image view would be the relatively out, and the parent of the roll button would be this relatively out. In other words, the indentation helps us figure out if a component is contained within another one. So let's change the relatively outs. Layout high property from match parent to wrap content. This means that the relative layout isn't gonna be as big as a screen anymore. It's only gonna be as big as whatever it contains, which is the image you with the dicey logo we can see here as soon as we select that the button pops back on screen and the blue box shrinks to the height of the logo. No, we left the layout with set to match parent, which is why the blue box still goes across the whole screen. Okay, let's add another layout toe are component tree. This time we're gonna grab a horizontal linearly out. We're dragon. Drop it so it's in the same level as the two relatively outs. And again, if we drop it here, we see that everything is pushed off screen because this linear layout that we just added has layout height set to match parent as a default, so takes up the entire screen. At the moment, it doesn't contain anything. So if we change this to content, it will shrink and take up none of the space. So let's leave it at that. Next, we're gonna add another true image views thes. They're gonna hold our dice images in the palate. We're gonna go to images and media and drag and drop the first image you into the linear layout. They're going to select dice one. We do the same again and select. Say nice to and click OK. And here you can see the two image views arranged next to each other inside the linear they up. And this is because it is a horizontal than nearly out, in contrast to our top most linear, that which is vertical. So the horizontal linearly out arranges its contents next to each other. The vertical in nearly out arranges them from top to bottom. We can play around with us to make this more clear, so if you select linearly out and then you go over here to the properties and you change the orientation from horizontal to vertical, the dice images arranged like this. Let's change that back to horizontal also, let's move these layouts around a bit, ideally want the logo to go on top and the die in the middle with the button at the bottom . So in the component tree, we're gonna grab this relatively out here and try and move it so that it goes at the top so I can drop it off here or I can drop it off here. And at least now we've got them said in the right order. The other thing I want to show you is that you can do more than just set the layout high to wrap content and match parent thes air. Essentially, rules used to tell the relative lay out how to size itself. However, you can also give it a hard value. For example, if I put in 150 DP and hit enter, then my relative layout will shrink to 150 density independent pixels. And if I said that value to something like 300 DP, then I'll get a bit more space below the image to make this look good on the nexus, for I would probably have to set it to around 250 dp The other thing I might want to do from a design perspective is I want to set a rule somewhere to send toe this logo and have two ways I can do this. If I click on the image view that contains the logo and I looked through the properties, I will find a property that says Layout sent a horizontal and if I ticket, my logo will be centered in the middle of the screen. Another way to do it is to select the relative layout itself and fund a property called Gravity. Here you would be saying the rules that apply toe all the contents off the relatively out. So if there was another image, you inside or a button, this would apply in tow all of the components that are nested inside this relatively out. So if I click on gravity and I say sent a horizontal, I would be able to accomplish the same thing. You remember how we were talking about giving the individual elements a descriptive name, image view, imagery to image. You three are not very helpful. So let's take a look at our source code again and change the I. D. S for these image use for the image. You containing the logo? We're gonna give it the i d image under school logo for the image view containing the left ice. We're gonna call it image under school left dice. And for the image you containing the right dies. You guess that we're not gonna be very creative here, going to call it image under school, right? Dice these air good descriptive names which will help us identify these image views in our Java code later on, when it comes to changing the dice faces. Okay, cool. So let's do a quick recap of the things that we discussed in this video. First off, a linear layout that's vertical arranges its contents from top to bottom. Linearly out that's horizontal arranges its contents from left to right. If we look at the component tree, the indentation helps us figure out which elements are contained inside other elements. So we have a logo that's contained inside a relative layout, a relative layer that's contains at a linearly out. And here we have two image views displaying that die that are contained inside a horizontal linearly out, which in turn is contained inside vertical in nearly out in Andrew Lingo. The view that's contained inside is called the Child, and the container, for that view is called the Parent, and we've seen these words used in the properties. Wrapped content will size the container as big as its contents, while Match parent will size something as biggest, its container. Finally, we've seen two ways of centering things. We can set a rule in the container itself to pull all its contents to a particular place by setting its gravity. Alternatively, we can set the property on the individual view, to align itself to the right of the parent to the left of the parent or centering itself. And that's it. We've completed the design for the APP. Next, we're going to start writing Java code. 12. Using Variables and Linking Layout Elements to Java Code: in this video, we're gonna get our hands dirty and write some java code. The first thing that you'll need to do is you have to make sure you're in the main activity . Don't Java file, which you'll find under this job a folder here. And this is where we will create the link between the Java code and those elements in the layout file our image views and our button. Now, a lot of this code would look very unfamiliar at first. However, don't worry about understanding every single line of code right away. We will work through the syntax bit by bit over the course of the tutorials. Think of it as us putting together when those big 1000 piece puzzles, we're going to start at the edges and then slowly work our way in to fill in the gaps until we have a clear picture. So how do we link the Java code to the elements in the layout file Previously with used at reliable and at string to let the layout resource XML file know about something in another XML file. However, with Dr A code linking to an element in an XML file is a little different. We're going to use a two step process. First, we will create a variable that will hold the layout element. Say the button and then we will retrieve that layout element and stored in that variable that we just created. Now what I mean by variable, you can think of a variable as a box. This box can be empty or it can contain data. They have a variable called my age. I can then assign it the value of 32 and come next year, I can change that value to a new value by assigning my age the value of 33. Here's how you credit variable that will hold the button. Gonna enter some your lines here. I'm gonna type button and then roll button done. So roll button is the name for the variable and button is the type of the variable. The key thing to understand about variables is that they all have a type. Now what I mean by type A type is the category that a variable or a piece of data belongs to Check out the Java Cici below this video to see examples of common data types. There you can see that whole numbers are into GIs belong to the category. Decimals have the float category really large or really accurate that simple numbers are of type double, and pieces of text are marked with quotation marks and belong to the string type. Here's another example and my number. Here we have a variable called My Number in its of type int instance for Inter. Just so my number can only hold whole numbers. That's the important thing to note about variables. The type of the data has to match the type of the variable. A good analogy of how variables and types work is that Children's shaped fitting toy. If I wanted to assign a variable of type string, a piece of text, it would fit without a problem. However, if I wanted to assign that variable a value off a different data type, say, interject, I would get an error and it wouldn't work. So Roll button can only hold buttons, and my number can only hold whole numbers or inter GIs. Giving these variables of value is easy. All we have to do is use the equal sign, so if you want my number to be equal to four. We just say my number is equal to four. And if we want my number to be equal to the answer to life, the universe and everything, we make it equal to 42. Okay, so the first time you create a variable, you have to specify the type. But once it's been created already, you could just refer to it by its name. So to recap real quick to create a variable, you have to specify the type. You have to give the variable and name to assign value to a variable you right equals and then put whatever you want to put inside afterwards and importantly, the type of the data that goes inside the variable has to match the category or type of the variable itself. Now let's delete these two lines, so all we have left is a roll button. But this roll button is currently empty, so let's retrieve our button element from the layout. XML. The way you retrieve any element from a layout is you find it by its i d you find it by its name. We're gonna see find view by I d. And we're gonna look for our button within our resource is so gonna say, are I d don't And here we have it. The roll button. Now we're gonna put a semi colon in the end. I mean, take a look. This code, we're gonna find a view by its i. D. And here we're gonna give the idea of the view that we want to find. This is where those ideas that we said in the layout XML come in handy now Android Studios underlining this code and red, which means it's something we have to fix about it. We hover over it. We see incompatible types, which means that the value we're trying to assign to our variable doesn't fit its type. It's not a button, and that's because fine view by D actually gives us something very generic. It just gives us a view, which is the generic category for anything that goes on screen, however, are variable can only hold something for a specific category of the category button. So we're going to specify that what we retrieved with fine view by D is indeed a button. By adding this code hip, let's do the same thing for our to image views that they're displaying our dice images will create a variable called left ice for our left image view. So first we have to specify the type image view. It's time. Then we give it a name, call it left dice and then we're gonna give left I so value again we're gonna use fine view by i d The idea that we're looking for within our resource is is image underscore left ice enter and that semi colon at the end. And until Androids do that, what we're finding is indeed an image view. Great. Now see if you can do the image you for the right dice on your own. I'm gonna give you a few seconds before I show you how once again we create a variable off type image. You we'll give it a name, right? Nice. And it's definitely gonna hold an image. You we're gonna find that right, dice image you by its i d. And here it is, and that's it. With linked are three elements for my layout XML to the Java code with lengthy image. You displaying the left dice to a variable called left dice. And we've linked an image view that displays the right dice image to a variable cold right dice. We've also introduced you to a bit of programming theory in the form of types and variables . Types are the category that a piece of data or a variable belongs to, and variables are the containers that hold on to a piece of data. The next video. I'm gonna show you how to make that button, listen for clicks and taps on screen. 13. Use the Logcat and a Listener to Check if a Button is Pressed: to detect taps on screen. We need something called a listener. Since we wanted to tech taps on the button. We need to set that listener on the button. And the way we're gonna do is this. We're gonna use our role button, put it down after it. An android studio will already suggest to set on on click listener on the button. This is exactly what we wanted to do. You don't have to type any of this code out if you hit Tab and use auto complete to inserted for you. Now that we've specified, we want to set a unclip listener on the roll button. All that's left to do is create the listener, so type new and then capital o n and an dress to do will already suggest to create the on click listener for you Hit tab on your keyboard and you should see Androids to do. Insert this block of code Now every time the roll button is pressed, the code in between Thies too curly braces will get executed at the moment. This is empty. So let's add something here to test out our app. We're gonna add a very simple lock statement to print to our console and check if our button is working. Type log, Doc. D Then put down the name of the APP and have a message here. There's a button has been pressed. Excellent. The Red Square line is showing that we're missing the semi colon at the end. Can add that now. And here we go. Now is the time to plug in your android device. If you've got one, I'm gonna be running my app in an emulator so you can see what's going on. But if you've got an android device, plug it in, click on the android monitor and it should show up here with some messages scrolling in this window here that show you what's going on on the device. I'm gonna come up here to the run menu and click run app, but you can also press the screenplay button. And as you can see, I've got nothing plugged in at the moment. But your devices show up here, so I'm gonna fire up one of the emulators that I've already configured. I can tell you that in previous versions of Android Studio, this thing used to really take a long time. It's gotten a lot faster, but it's still no match for the iPhone simulator. But Google is working on it to make it faster, that's for sure. For those of you who are running things in an emulator, you can keep it open. You don't need to close that every time you re run the app, so you only need toe Wait once until it boots up. Then you can just keep it in the background and run the abstinent Command command. Okay, great. So that devices put it up and here's my app. Brilliant. I'm gonna pull us over here. Andi, I'm gonna switch the window here to show the android monitor and I can see for the device I've got my emulator listed. I'm filtering the messages inside the law Cat inside this window here by my app some Onley gonna show the message is that pertained to my app and I'm gonna show all the messages Verbose. Okay, so I've got my app running in my emulator and I'm gonna test out my button when I tap on the button. I'm expecting that all the instructions between these two curly braces will get executed. President Geun I should see it. And so every time I press this button, I will see this message of my law. Cat log messages are very handy for checking up. What's going on inside. Her app were able to see in this window here which bits of code get executed. All log messages have a severity level, and you can filter how serious of particular messages by clicking on this drop down and which you can change from verbose to debug to info as well as two era. But so by selecting error, I only see log messages that report errors. In our case, we've used long dot de, which makes the button has been pressed a D buck message. So I filter on D book. I only see the debug messages and those messages, which are considered a bit more serious, like info messages and up here. Some warnings. I can also use the search box here to filter the messages to only show me those with a particular piece of text, for example, I put in dicey. It only shows me the messages that contain that piece of text. Okay, let's do a quick recap. A listener will report on a certain event happening, and the on click listener will report if it detects a click. We can set a non click listener on the button simply by writing the name of the button and then a dot and then set on click Listener. We then created the listener itself with the new key would and had auto complete insert this block of code for us. Finally, we started using the long count to check on what's going on inside around in the next video , I'll show you how to generate random numbers. 14. Create Random Numbers in Java: to simulate our dice roll, we're gonna need some random numbers. And to generate those random numbers, we're gonna need help from a specific object that has this ability. The first thing we're gonna do is create a variable that can hold this object. The Java component that has this ability is off type A random. So are variable. Also needs to be of type random. We're gonna call are very build random number generator similar to creating that listener. We're going to create the random object using the new key would followed by the name of what we want to create. Great. So now we've stored our random object inside a variable called random number generator and we can use that to create random numbers. Let's do that. Now. We'll save it for another variable called number, and that will be an integer. So I'll be type int Call it number. And now we'll use the random number generator to generate the value similar to how we set a non click listener on the roll button. We're going to access the random number generating facility through the dot notation so select next into which generates an integer and provide an upper bound. So we want to generate a number between zero and five. So we'll say next into six and then cynical and at the end, and this line will store a random number between zero and five. Inside are variable called number. Let's print out to the law cat and make sure it works. Let's add another lock statement la de dicey. And now we'll print out the value that stored inside our variable called number. We have our text. The random number is an A plus. And then the name of the variable to combine the two into one long piece of text. Now hit the run at button again. In our emulator, we just saw the toast message, applied changes and restarted activity. That means that the app that showing is running the latest version of the code that we wrote. So what happens? Not when you press the old button. I'm gonna clear the law cat by pressing on this rubbish bin symbol and I'm gonna hit that button. Okay, Just like last time. We'll see. The button has been pressed. Then we create around the number generator we make it generates a random number and down him. We're printing out what that number is, and I'm here. I see the random number is too. If I press that button again, I could see two more messages. And again with the random number is two. That doesn't seem very random. Let's try again. Random numbers, too. Mm. Two. Okay, four times. Okay, here we go. Zero 20 to 5. Full zero. Ok, OK. Looks. It looks like it's random. After all, while printing the round the numbers to the lock had us. Great. We're not updating our dice faces yet. I'll show you how to do that in the next video. 15. Java Arrays and How to Use Them: in this video, I'm gonna show you how to update the display to show random dice image and how to use a race. Before we update what's on screen. We're gonna need a convenient way of referencing our collection off dice images. And for this we're going to use an array. What do I mean by array? Think of an array as an egg cotton that holds a collection of objects and the objects in the collection must all be of the same type. Just like you can't have an egg Contin that holds both eggs and doughnuts. You can't have an array that holds both strings and inter jizz. Now let me show you the syntax of how to get hold of a particular item in an array. There's two important things to note about a raise one. Programmers like to start counting from zero and two. You get hold of an element in an array, but where it sits by its position or index, and that index is specified between the square brackets. So let's think which egg would I retrieve it in next one? Would I be storing the striped egg or the spotted egg and the my AEG variable because programmers like counting from zero, the striped exits at Index zero on the spotted egg would be the one that sits it in next one. So that's the one I would be retrieving in this case. Within our app, we're going to create an array that will hold our collection off nice images. Let's create that ray here as always. First we have a type, and because it's in Oregon at some funky square bracket syntax, we're gonna call it Dice Array. That die story's gonna contain Six of our resource is Here's how we get hold of the first ice image when a CR draw global because our dice images in the draw Bill folder Don't nice one common gonna add the 2nd 1 now r dot trouble and you guess that dies, too, and so on. I'm slowly running out of screen space here. So put each one of these on a new line just so that it's easier to read and read Susan. Kind enough to show middle preview of each image on the left hand side. Okay, so we've created a die Serie with six elements. Now we just have to figure out how to use it. The part of the code that will make use of our die Serie is going to be our own click listener. The thing about the listener using the dice array is that we have to assure the listener that the dice a rate will not change. In other words, we have to promise that we're not going to change what's in the die Serie in another part of the app, and that the listener won't be in for a surprise when it tries to use the dice array. To do this, we simply declare The Die Serie Final will just add the final keyword toe where we created the die Serie Now the dice array variable can't change anymore. We've actually made it a constant Let's do the same with the two image views. With that done, we can set the image on the left dice Inside the on click listener Well type left ice dot to get hold of the functionality set image resource hit tab, and now it's time to get something from our array from our collection. So we'll se dice arraign and use the square brackets. And so the question is what index should we use So Thais? One. Since that position. Zero. Because that's where programmers start counting dyes to since that position one and so on Until Die six, which sits at Position five. However, we don't want to put a hard number in there. We want to put in a random number, which restored in our number. Variable cool. Let's see if that works. Hit the green play button and let's wait for the app to update. OK, so I can see that it closed it and fired it up again. Now the moment of truth. Press the roll button. Ah, so the left ice images updating Brilliant. That just leaves the right dice image. See if you can do this one on your own, I'll give you a few seconds to pause the video. Did you do this right? Nice set symmetry source dice array and then give it the number. Let's see what happens when I run this code. Mm. So federal This both. I always show me the same number. That's not what we want. We're gonna have to add something here. We're gonna have to generate a new random number for the right dice. image. Let's reuse the number of variables that we created, and it's simply stick a new round of number into it. We're gonna use a random number generator next interview. Next int six Senate Colon. Okay, now what happens the first time round? We're going to generate a random number between zero and five. When a print The number that we generated to our law cat, when I use that number to get hold of one of the images in our array and we're gonna set the left dice to that image, then we're gonna generate a new round of number and replace whatever we had in our number variable. And now we're gonna set the right dice to whatever we grabbed from the array. Let's run it again. See what happens. Changes applied. Activity restarted. That's what I wanted to hear. Moment of truth. Clicking the robot. Ah, that's more like it. Brilliant. You just created a fully functional dissect. Congratulations 16. Where next?: All right. So now that you've built Dicey, it's time to think about the next step. The most important thing is just to keep going. Don't stop now. You already got all this mo mentum at the London AP brewery. We've built an entire curriculum that been refined, untested through teaching in our in person classrooms in London. The idea is to slowly ramp you up, taking you from the end of dicey and getting you to build APS. That'll teach you some of the core programming fundamentals. The next month is about app design on. We teach you various aspects off user interface design as well as user experience to sign. Essentially, how do you craft a beautiful app that people will love when we get you to build wire frames , markups, prototypes, you name it. Month three, you'll be going back to programming, and we're going to get you to build more advanced abs. So these are APS that leverage a cloud based database, and we're also getting you to retrieve data from the Internet. So we're gonna teach you how to tap into a P eyes that'll grab weather data or Bitcoin data , and we're also teaching you What is good practice in professional programming on Finally on month four. It's all about focusing on your business. So we delve into some of the growth hacking techniques, how to acquire your 1st 1000 customers and also things such as how to get featured on the APP store on much, much more. So this is a complete curriculum that is going to take you from beginning to end. We're gonna teach you everything that you possibly need to know in order to build a successful at based business On. On top of that, when you sign up to the online platform, you get free updates. For two years, the course will remain updated on an ongoing basis, so that even when I was 11 comes out I was 12 or these pieces of software change their look and feel. It doesn't matter because all the course materials will be continuously updated. And for our students, that is a huge bonus because very often, you know, you're on YouTube. You find a tutorial, you get halfway into it, and then you realize, Oh, this is actually from last year, Andi. Now it looks completely different, and everything's breaking that won't happen on online course. On top of that, you get access to support from the instructors as well as over 1000 off our current students. So we have a private slack channel where students can look for co founders and collaborators. Because we've got a lot of designers. We've got a lot of Web developers, but we've also got dedicated channels for IOS and Android. So if you have any questions that you want to ask any of the instructors or any of the other students than this is a great form. Plus, we know that even though there's hours and hours off HD video content, we know that sometimes people like to supplement what they're learning in the videos with some background reading. So if you sign up to the online platform today, you also get access. Teoh, our 200 page course manuals, their full color on again. These e books are living, so they get updated whenever X coda and Rocio gets updated. So that's another thing you get access to. Um, we're not sure if we're going to keep that in the package in the future, but if you do get the course today it does include full access to the E books as well. So on top of all of that, once you've completed all of the trato rials and you've submitted all the coursework, we actually issue you with a digital Lincoln certificate that certifies that you've been trained in various aspects of android app development or IOS app development with Java or swift. So that's something that you can show off to other LinkedIn users or when you're looking for a job in the future. Now, finally, once you've complete in the entire course, then you're ready to start building your own APS. So, for example, one of Austrians Mylar building up court next speech, which is a voice to text diary. Another one of our students built an app that is the uber for doctors, so helps doctors find temporary jobs. Andi, if you've completed our course on you've built your own app, then email us about it and will include you in the newsletter that goes out to thousands of students so that they can check it out, too. So when you're ready to join the online platform, just head over to online dot lawns papery dot com, the links in the text below, and I look forward to seeing you on one of our courses