build your first android mobile app
TRANSCRIPT
![Page 1: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/1.jpg)
BUILD YOUR FIRST ANDROID MOBILE APP
![Page 2: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/2.jpg)
This should be a very short (beginner) introduction/tutorial how to create a mobile app for Android. The tutorial is based on API Level 17 and Android 4.2 (Jelly Bean). Our goal is to start from scratch and have at the end a mp/h to km/h converter.
![Page 3: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/3.jpg)
What Do You Need?
![Page 4: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/4.jpg)
1. Basic XML knowledge
2. Basic Java knowledge
3. Basic Eclipse knowledge
4. 2h of your time
![Page 5: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/5.jpg)
Pre requisites:
![Page 6: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/6.jpg)
1. Before you can start you need the Android SDK and a IDE. Android offers a special bundle for that: Android SDK Bundle
2. Download the bundle, unzip and run the “SDK Manager.exe”.
3. start Eclipse
![Page 7: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/7.jpg)
Create An Android Virtual Machine
Create An Android Virtual Machine
![Page 8: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/8.jpg)
• To run, test and debug your Application you can create and run a virtual android machine on your computer. Later you can deploy your Application to this virtual machine.
• Click on “Windows” at the navigation toolbar
• Open “Android Virtual Device manager“
![Page 9: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/9.jpg)
Create a “New” Virtual Device:
Be sure that “Use Host GPU” is enabled. This allows the AVD to use the Host GPU and this helps to render the AVD much faster.
![Page 10: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/10.jpg)
After that you can start the AVD:
![Page 11: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/11.jpg)
Create a new Project:
![Page 12: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/12.jpg)
• Open “File“
• “New“
• “Android Application Project“
![Page 13: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/13.jpg)
Choose a new for your Project:
![Page 14: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/14.jpg)
Configure Project:
![Page 15: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/15.jpg)
Configure Launcher Icon:
Here you can choose a Launcher Icon that will be displayed on your mobile phone.
![Page 16: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/16.jpg)
Create a new Activity:
![Page 17: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/17.jpg)
Configure Your Activity
![Page 18: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/18.jpg)
After finishing Eclipse looks similar to that:
![Page 19: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/19.jpg)
Implement the Look & Feel:
![Page 20: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/20.jpg)
Navigate in the package explorer to “/res/layout/” and open “activity_main.xml“
Right-click on “Hello World” and delete
![Page 21: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/21.jpg)
Create static Attributes:
Select “/res/values/strings.xml“
“Add” a new entry
Select the Color entry – press OK and set the following attributes:
![Page 22: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/22.jpg)
Add a few more String(!) Attributes:Name/value: “miles” / “to Miles“Name/value: “kmh” / “to km/h“Name/value: “calc” / “Calculate“
![Page 23: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/23.jpg)
Switch from “Resources” to “strings.xml” and make sure that your code look similar to that snippet:
![Page 24: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/24.jpg)
Add Views
Select “/res/layout/activity_main.xml“Open Android editor via double-clickYou have two possibilities. You can create new Views via drag and drop or you can edit the XML source code. In this tutorial we add the Views via drag and drop So let’s start building our App. At first we have to add a “Text Field” for the input.
![Page 25: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/25.jpg)
Drag this Text Field to your Application.Afterwards select the “Form Widget” section and drag a RadioGroupto your App and make sure that the RadioGroup has twoRadioButtons. Finally you can add a normal Button.
![Page 26: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/26.jpg)
Switch from “Graphical Layout” to “activity_main.xml” and make sure that your code looks similar to that:
![Page 27: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/27.jpg)
![Page 28: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/28.jpg)
Edit view properties
You can edit properties of Views via right-click on the view or via XML.
Navigate to “res/layout/” and open the Graphical Layout of your “activity_main.xml“
right-click on the first Radio Button and open “Edit Text”
![Page 29: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/29.jpg)
![Page 30: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/30.jpg)
• Assign the miles property to the second Radio Button
• Set the “Checked” property for the first Radio Button (Other Properties -> inherited from compoundbutton -> checked -> true)
• Set the “Input type” property for the Text Field to “numberSigned” and “numberDecimal“
• Assign “calc” to the Button and set “calculate” for the “onClick” property (Other Properties -> inherited from view -> onClick)
• Set Background-Color (Right-click on an empty space on your Application -> Edit Background)
![Page 31: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/31.jpg)
After that change the Background should be #eeeeee! I think it can be difficult to see the difference.
![Page 32: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/32.jpg)
Implement the Logic
After we implemented the Frontend-View we have to implement the logical part with Java!
Switch to “src/com.example.tutorialapplication/” and open “MainActivity.java“
![Page 33: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/33.jpg)
![Page 34: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/34.jpg)
![Page 35: Build your first android mobile app](https://reader034.vdocuments.us/reader034/viewer/2022042611/587541d61a28abb8208b5319/html5/thumbnails/35.jpg)
This short but useful tutorial courtesy goes to MARC KLEIN.
To know more about technologies log on to http://ekipa.co !A one stop solution for all your programming needs.