Create new Android project in Android Studio Add Button and TextView to layout Learn how to use buttons to call methods. Modify strings.

Size: px

Start display at page:

Download "Create new Android project in Android Studio Add Button and TextView to layout Learn how to use buttons to call methods. Modify strings."

Steven Tate
5 years ago
Views:

Hello World Lab Objectives: Create new Android project in Android Studio Add Button and TextView to layout Learn how to use buttons to call methods. Modify strings.

1 Hello World Lab Objectives: Create new Android project in Android Studio Add Button and TextView to layout Learn how to use buttons to call methods. Modify strings.xml What to Turn in: The lab evaluation form checked off and signed by your TA 1 Using Android Studio and the Android SDK for the First Time: On the lab machines there is a shortcut in the start menu called Android Studio. Click this shortcut to open the Android Studio. Or if you would like to use your personal computer for Android development then download the Android Studio from this site: Open Android Studio. It will ask you to select an Install type. Select Custom. This screen will pop up, then select the SDK location. 1

2 The SDK to use is under: C:\Android\sdk 2

3 Accept the terms and conditions, wait and then hit finish. Select Start a new Android Studio project 3

4 Configure your new project with the following properties. From here, follow the instructions detailed for adding an activity and starting your project. Enjoy! 4

5 Adding Layout Elements: 1. A new project folder with your Android application should be created. Now we will add elements to the user interface. 2. In your project folder go into res/layout/ and open the only XML file available. 3. Make sure that you have the graphical layout tab selected. You should now have a window showing your layout with a standard text field saying Hello world. 4. On the left hand side of the screen in the palette there is a Form Widgets section. Drag a button and drop it onto your activity layout. You may choose to customize your layout in any way that you see fit as long as it contains one button and one text view. 5. The text of the button is currently hard set in the XML file. However, Android has a much better way of organizing strings through the use of XML files. Open res/values/strings.xml. In the resources tab you will be able to add strings to the file. Add a string named button with the value Change Text. 6. In your activity s XML file, choose the activity_main.xml tab just below the editing window near the Graphical Layout tab, and change the android:text value for the button to "@string/button". Note: xml is case sensitive, does make a difference. 5

6 Creating an onclick Listener: CPRE 388: Hello World 1. In order to give the button functionality you will have to specify a method to run once the button has been clicked. 2. Open the.java file found under the src folder and package. This file will be named the same as your project. 3. After the last method but before the end of the class add this method to be called on a button click: public void changetext(view view){ } Hint: You will need to import the View class. In Android Studio use the auto import feature. You can go to File -> Settings -> Editor -> General -> Auto Import -> Java and make the following changes: change Insert imports on paste value to All mark Add unambigious imports on the fly option as checked or You can press Alt + enter placing cursor on the line to auto import in android studio. 4. Now go back to your activity s XML file and choose the tab besides the Graphical Layout that displays the xml code. Here you will find a text representation of the button. 5. Within the button s declaration after <Button but before /> add this line: android:onclick="changetext" Note how the name matches the method that was just created. Using the android:onclick attribute for a button is one of the ways we can set its functionality. 6. We also need to give our TextView an id so we can get access to it programmatically later. Within the TextView s declaration after <TextView but before /> add this line: android:id="@+id/textview1" This value may already be included depending on your IDE s settings. If it is set it to match the value above. Making Messages Display: 1. Now we want to have the method actually do something. Add these variables to the beginning of the class. 6

7 private String[] messages; private Random random; You will need to import the Random class. 2. Also in the oncreate method (a method that is called whenever the layout is loaded) add these lines of code: protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); } random = new Random(); messages = new String[10]; messages[0] = "Hello Dave!"; messages[1] = "These are not the Droids you're looking for."; messages[2] = "All your Androids are belong to us!"; messages[3] = "Thank you! \nbut our Android is in another castle."; messages[4] = "It's a Me! \nandroid!"; messages[5] = "Would you kindly press the button again?"; messages[6] = "It's dangerous to go alone, take this. \nthe screen doubles as a flashlight!"; messages[7] = "Hey! Look! Listen! \npress the button again!"; messages[8] = "Fus Ro Droid! \n unrelenting Android "; messages[9] = "The apple is a lie!"; and in the changetext method add these lines of code: public void changetext(view view){ TextView text = (TextView) findviewbyid(r.id.textview1); } text.settext(messages[random.nextint(10)]); Note: in Java, the only things can be put under class declaration are instance variables; anything else should always be contained by a method. Running Your First Android Application on an Android Device: If you are using a Nexus 7 device you will need to enable the developer options on the device before you can use Andriod Studio to install apps that you develop. Specifically for the Nexus 7, to enable the developer options go to Settings > About tablet and press the Build number 7 times. This will allow you to see the developer options in the Settings page. Go back to Settings then choose Developer options and enable USB debugging. You should now be able to run your application on the device. If you would like to get your personal Android device to work with a lab machine, please ask a TA for assistance. To use the build in Emulator: 1. Under the Run menu on the top of the window select Run + App name 7

8 2. There is a choose device option pops up, select Launch emulator 3. Then click ok, the emulator will start and your app will run automatically. Note: If you find the default Gradle Scripts were using the wrong version and causing build errors. To fix this, do these steps: 1. In the left pane select "Project" 2. Expand "Gradle Scripts" 3. Double-click on "build.gradle (Module: app)" 4. Replace "com.android.support:appcompat-v7:23.0.0" with "com.android.support:appcompat-v7:22.2.1" as shown below... dependencies { compile filetree(dir: 'libs', include: ['*.jar']) compile 'com.android.support:appcompat-v7:22.2.1' } Hello World Application Demo: If completed correctly, the app should display a TextView saying Hello World! and a button saying Change Text. When the button is pressed the text field should cycle randomly through a list of predetermined phrases. Part of this lab is based on creativity. Use your design skills to make this application more creative. Some examples include making the button an ImageButton, changing the background color, add an animation or whatever else you can think of. 8

9 For documentation on the Android API you can go to: The Android API guides are also a good place to look for ideas and can be found at: Demo your application to your TA and have them fill out the lab evaluation form. You have completed your first lab and Android application! 9

University of Stirling Computing Science Telecommunications Systems and Services CSCU9YH: Android Practical 1 Hello World

University of Stirling Computing Science Telecommunications Systems and Services CSCU9YH: Android Practical 1 Hello World Before you do anything read all of the following red paragraph! For this lab you