Android programming basics
Download as PPTX, PDF2 likes159 views
This document provides an overview of Android basics including UI elements, views, view groups, common layouts, buttons, text views, lists views, grid views, and fragments. It discusses the view hierarchy and how views and view groups are arranged in a tree structure. It provides examples of linear, relative, grid and list layouts and how to define buttons, text fields, labels and other widgets. It also covers topics like event handling, populating spinners and pickers, and using fragments in an Android application.
Android programming basics
- 1. ANDROID BASICS J M GITHEKO
- 2. AGENDA • UI ELEMENTS • View and ViewGroup • Layouts • Relative, Linear, Grid, ListView • Frame • Buttons • TextView • • • • • See: http://developer.android.com/guide/topics/ui/layout/listview.html
- 3. ELEMENTS OF A UI
- 4. VIEWGROUP AND VIEW • ViewGroup can contain Views • A View can contain widgets such as buttons, EditText, TextView… • They are grouped in a tree structure
- 5. CREATING VIEWS Define a view/widget in the layout XML file and assign it a unique ID: <Button android:id="@+id/my_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/my_button_text"/>
- 6. VIEW CONT’D Then create an instance of the view object and capture it from the layout (typically in the onCreate()method): Button myButton = (Button) findViewById(R.id.my_button);
- 7. VIEWS CONT’D • Defining IDs for view objects is important when creating a RelativeLayout. • In a relative layout, sibling views can define their layout relative to another sibling view, which is referenced by the unique ID. • An ID need not be unique throughout the entire tree, but it should be unique within the part of the tree you are searching (which may often be the entire tree, so it's best to be completely unique when possible).
- 8. LAYOUTS NOTE THAT LAYOUTS ARE VIEWGROUPS
- 9. LINEAR LAYOUT EXAMPLE <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="I am a TextView" /> <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="I am a Button" /> </LinearLayout>
- 10. LAYOUTS: TRY TO BE SIMPLE AND ELEGANT
- 11. DECLARING LAYOUTS • XML use is recommended due to its simplicity and easy visualization of the design • You can create layouts in code but difficult to debug • XML allows you to create layouts customization for different orientations (landscape, portrait) • XML allows you to create Internationalized layouts (different languages, same app)
- 12. LINEAR LAYOUT • Vertical Alignment • Horizontal Alignment • Similar to same layout in App Inventor
- 13. LINEAR LAYOUT EXAMPLE <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <TextView android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello, I am a TextView" /> <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello, I am a Button" /> </LinearLayout>
- 14. <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="16dp" android:paddingRight="16dp" > <EditText android:id="@+id/name" android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="@string/reminder" /> <Spinner android:id="@+id/dates" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_below="@id/name" android:layout_alignParentLeft="true" android:layout_toLeftOf="@+id/times" /> <Spinner android:id="@id/times" android:layout_width="96dp" android:layout_height="wrap_content" android:layout_below="@id/name" android:layout_alignParentRight="true" /> <Button android:layout_width="96dp" android:layout_height="wrap_content" android:layout_below="@id/times" android:layout_alignParentRight="true" android:text="@string/done" /> </RelativeLayout> • Widgets are positioned relative to each other • Use layout parameters such as: • android:layout_toRightOf=“@id/btnx” • Android:layout_below=“@id/times” RELATIVE LAYOUT
- 15. LIST VIEW • Displays a list of scrollable items. • The list items are automatically inserted to the list using an Adapter that pulls content from a source such as an array or database query and converts each item result into a view that's placed into the list. • See: http://www.tutorialspoint.com/android/android_list_view. htm
- 16. LIST VIEW EXAMPLE <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".ListActivity" > <ListView android:id="@+id/mobile_list" android:layout_width="match_parent" android:layout_height="wrap_content" > </ListView> </LinearLayout>
- 17. GRID VIEW • GridView is a ViewGroup that displays items in a two- dimensional, scrollable grid. • The grid items are automatically inserted to the layout using a ListAdapter
- 18. EXAMPLE (SIMILAR TO JAVA GRID LAYOUT) <?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/gridview" android:layout_width="fill_parent" android:layout_height="fill_parent" android:columnWidth="90dp" android:numColumns="auto_fit" android:verticalSpacing="10dp" android:horizontalSpacing="10dp" android:stretchMode="columnWidth" android:gravity="center" />
- 20. • Buttons • Text Fields • Label • Checkboxes • Radio Buttons • Spinners • Pickers
- 22. ONCLICK BUTTON LISTENER • In OnCreate method: Button button = (Button) findViewById(R.id.button_send); button.setOnClickListener( new View.OnClickListener() { public void onClick(View v) { // Do something in response to button click } }); Details: http://developer.android.com/guide/topics/ui/controls/button.html
- 25. CHECKBOXES <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <CheckBox android:id="@+id/checkbox_meat" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/meat" android:onClick="onCheckboxClicked"/> <CheckBox android:id="@+id/checkbox_cheese" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/cheese" android:onClick="onCheckboxClicked"/> </LinearLayout>
- 27. SPINNERS<Spinner android:id="@+id/planets_spinner" android:layout_width="fill_parent" android:layout_height="wrap_content" /> To populate the spinner with a list of choices, you then need to specify a SpinnerAdapter in your Activity or Fragment source code. The choices you provide for the spinner can come from any source, but must be provided through an SpinnerAdapter, such as an ArrayAdapter if the choices are available in an array or a CursorAdapter if the choices are available from a database query. See: http://developer.android.com/guide/topics/ui/controls/spinner.html To populate the spinner with a list of choices, you then need to specify a SpinnerAdapter in your Activity orFragment source code.
- 28. PICKERS • See: http://developer.android.com/guide/topics/ui/controls/pickers.html
- 29. EVENT HANDLERS • Create an event listener • Register event listener • Create an event handler • Event occurs • Event listener fires • Handler is called • Example:
- 30. package com.example.myapplication; public class MainActivity extends ActionBarActivity { Button b1; //declare a button @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //Select activity
- 31. b1=(Button)findViewById(R.id.button); //Instantiate button b1.setOnClickListener( new View.OnClickListener() { //Create listener & register @Override public void onClick(View v) { //Event handler TextView txtView = (TextView) findViewById(R.id.textView); //Create textview txtView.setTextSize(25); //Set textview size } });
- 32. FRAGMENTS • Is a part of an Activity; a sub-activity • Can receive input events • Has its own lifecycle but can not exist outside Activity • A fragment can be added or removed while the owner Activity is running • It can be re-used
- 33. CREATE FRAGMENT IN JAVA import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.ViewGroup; public class ArticleFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // Inflate the layout for this fragment return inflater.inflate(R.layout.article_view, container, false); } }
- 34. LIFECYCLE METHODS • Fragments like Activities have lifecycle methods • The key one is onCreateView() which is mandatory • In Activities, onCreate() is mandatory • Others are: • onStart() • onResume() - app running • onPause() - app visible in the background • onStop() - app hidden in the background • onDestry() – app removed from memory • onRestart() – app restored from onStop() condition – made visible in foreground • When app is launched, onCreate(), onStart() and onResume() are called()
- 35. OR ADD A FRAGMENT TO AN ACTIVITY USING XML <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="fill_parent"> <fragment android:name="com.example.android.fragments.HeadlinesFragment" android:id="@+id/headlines_fragment" android:layout_weight="1" android:layout_width="0dp" android:layout_height="match_parent" /> <fragment android:name="com.example.android.fragments.ArticleFragment" android:id="@+id/article_fragment" android:layout_weight="2" android:layout_width="0dp" android:layout_height="match_parent" /> </LinearLayout>
- 36. APPLY THE LAYOUT TO YOUR ACTIVITY:
- 37. EXERCISE: TEMPERATURE CONVERTER – FAHRENHEIT TO CELSIUS • Requirements – Interface, language, platform • Design – UI,… • Construction – • UI – XML • Activity template • UI elements • Event listeners and handlers • Testing • Deployment • Submit as Bitbucket link
- 38. VCS - BITBUCKET• Create free account • Create repository (Git) • Download and install Git on your PC • Create project in Android Studio • Configure VCS (Git) • Push project (Give Bitbucket repository URL)
- 40. DEFINE REPOSITORY IN A/STUDIO
- 41. READY TO PUSH
- 42. PUSHING
- 43. PUSH COMPLETE
- 45. BITBUCKET
- 46. REPOSITORY URL