Lecture_04_Android

Document Sample
Lecture_04_Android Powered By Docstoc
					                                1




Mobile Computing
Views & Layouts



                   Lecture#04
                                                       2


Lecture Contents
User Interface
Views Hierarchy
Views (TextView, EditText, Button, ImageView)
Layouts (LinearLayout, RelativeLayout, FrameLayout,
 TableLayout)
                         3


User Interface (UI)
Made up of View &
 ViewGroup objects
Many types of views &
 viewgroups
View is base class of
 widgets
ViewGroup is base
 class of layouts
View is a graphical
 element and occupies
 rectangular area of
 screen
                                                  4


TextView
<TextView
     android:text="red"
     android:gravity="center_horizontal"
     android:background="#aa0000"
     android:layout_width="wrap_content"
     android:layout_height="fill_parent"
     android:layout_weight="1“
     android:text=“This is Label on TextView"/>
                                        5


EditText
<EditText
 android:id="@+id/EditText01"
 android:layout_height="wrap_content“
 android:layout_width="wrap_content"
 android:singleLine="true"
 android:text="Edittext example"/>
                                           6


Button
<Button
    android:id=“@+id/click_button"
    android:layout_height="wrap_content"
    android:layout_width=“fill_parent"
    android:text="Click to Execute"
    android:onClick="selfDestruct" />
                                                            7


Button & Click Handler
<Button
    android:id=“@+id/click_button"
    android:layout_height="wrap_content"
    android:layout_width=“fill_parent"
    android:text="Click to Execute" />

Button button = (Button) findViewById(R.id.click_button);
     button.setOnClickListener(new OnClickListener() {
         public void onClick(View v) {
           // Perform action on click
         }
     });
                                         8


ImageView
<ImageView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content“
  android:src="@drawable/my_image"/>
                                                     9


LinearLayout
A Layout that arranges its children in a single
 column or a single row
The direction of the row can be set by calling
 setOrientation() or android:orientation in XML
You can also specify gravity, which specifies the
 alignment of all the child elements
Children can grow to fill up any remaining space
 in the layout by setting the weight of element
The default orientation is horizontal
10
     Linear Layout XML
11


     Layout Output
12   Orientation=Vertical
                       13

Orientation=Vertical
                                                           14
                     <TextView
Weight Does Matter
                     android:text="red“
                     android:gravity="center_horizontal“
                     android:background="#aa0000“
                     android:layout_width="fill_parent“
                     android:layout_height="wrap_content
                       “
                     android:layout_weight="2"/>
                                                15


RelativeLayout
RelativeLayout is a ViewGroup that displays
 child View elements in relative positions
The position of a View can be specified as
 relative to sibling elements or in positions
 relative to the RelativeLayout area
A RelativeLayout is a very powerful utility
 because it can eliminate nested ViewGroups
Several nested LinearLayout groups can be
 replaced with a single RelativeLayout (same
 affect can be produced)
16   RelativeLayout
17   RelativeLayout Output
              18


FrameLayout
19   TableLayout
                                                    20


Layout in Code
public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 LinearLayout.LayoutParams lp;
 lp = new LinearLayout.LayoutParams
 (LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
 LinearLayout.LayoutParams textViewLP;
 textViewLP = new LinearLayout.LayoutParams
 (LayoutParams.FILL_PARENT,
 LayoutParams.WRAP_CONTENT);
 LinearLayout ll = new LinearLayout(this);
 ll.setOrientation(LinearLayout.VERTICAL);
 TextView myTextView = new TextView(this);
 myTextView.setText("Hello World, HelloWorld");
  ll.addView(myTextView, textViewLP);
  This.addContentView(ll, lp);
 }

				
DOCUMENT INFO
Shared By:
Stats:
views:3
posted:6/25/2011
language:English
pages:20