Android App

From Sinfronteras
Jump to: navigation, search

Android Basics: User Interface

XML syntax

< TextView                                          //open tag
    android:text=“Happy Valentine’s Day”                // attributes
    android:background=“@android:color/darker_gray”     // attributes
    Android:layout_width=“150dp”                        // attributes
    Android:layout_height=“75dp”/>                      // attributes and close tag
1.png

For the width / height to be precisely with the size of the content the value will be = “wrap_content”

2.png
3.png
4.png

or

5.png

https://plus.google.com/+AndroidDevelopers/posts/gQuBtnuk6iG

Hex Color

6.png
7.png 
<TextView
    android:text="Happy Valentine's Day Ale eu amo vc de montao :) !"
    android:textColor="@android:color/black"
    android:background="#FF0266"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="45sp"
    android:textStyle="bold"
    />

Image

8.png
9.png 
<TextView
    <ImageView
    android:src="@drawable/cake"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:scaleType="centerCrop"/>

ViewGroups

10.png
  • LinearLayout
  • RelativeLayout
11.png 
<TextView
    <LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <TextView
        android:text="Guest List"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="24sp"  />

    <TextView
        android:text="Kunal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="24sp"  />

</LinearLayout>

12.png
13.png 
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/darker_gray">

    <TextView
        android:text="VIP List"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#4CAF50"
        android:textSize="24sp" />

    <TextView
        android:text="Kunal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#4CAF50"
        android:textSize="24sp" />

    <TextView
        android:text="Kagure"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#4CAF50"
        android:textSize="24sp" />

    <TextView
        android:text="Lyla"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#4CAF50"
        android:textSize="24sp" />

</LinearLayout>

14.png

https://developer.android.com/guide/topics/ui/layout/linear.html?utm_source=udacity&utm_medium=course&utm_campaign=android_basics

15.png
16.png
17.png
18.png
19.png
20.png
21.png
22.png
23.png
24.png
25.png

https://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html?utm_source=udacity&utm_medium=course&utm_campaign=android_basics

26.png
27.png

Documentation with all the parameters.

28.png

https://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html?utm_source=udacity&utm_medium=course&utm_campaign=android_basics

29.png 
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FF8000">

    <TextView
        android:id="@+id/lyla_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:textSize="24sp"
        android:text="Lyla" 
        android:layout_marginBottom="20dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="5dp"
        android:background="#00FF"
        android:textColor="#FFFF"/>


    <TextView
        android:id="@+id/me_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@id/lyla_text_view"
        android:textSize="24sp"
        android:text="Me" 
        android:layout_marginBottom="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="5dp"
        android:background="#00FF"
        android:textColor="#FFFF"/>

    <TextView
        android:id="@+id/natalie_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_above="@id/lyla_text_view"
        android:textSize="24sp"
        android:text="Natalie"
        android:layout_marginLeft="13dp"
        android:background="#00FF"
        android:textColor="#FFFF"/>

    <TextView
        android:id="@+id/jennie_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:textSize="24sp"
        android:text="Jennie"
        android:layout_marginBottom="20dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="5dp"
        android:background="#00FF"
        android:textColor="#FFFF"/>

    <TextView
        android:id="@+id/omoju_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_above="@id/jennie_text_view"
        android:textSize="24sp"
        android:text="Omoju"
        android:layout_marginRight="10dp"
        android:background="#00FF"
        android:textColor="#FFFF"/>

    <TextView
        android:id="@+id/amy_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_above="@id/omoju_text_view"
        android:textSize="24sp"
        android:text="Amy" 
        android:layout_marginRight="10dp"
        android:layout_marginBottom="5dp"
        android:background="#00FF"
        android:textColor="#FFFF"/>

    <TextView
        android:id="@+id/ben_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:textSize="24sp"
        android:text="Ben" 
        android:layout_marginLeft="5dp"
        android:layout_marginTop="20dp"      
        android:background="#00FF"
        android:textColor="#FFFF"/>


    <TextView
        android:id="@+id/kunal_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_toLeftOf="@id/ben_text_view"
        android:textSize="24sp"
        android:text="Kunal" 
        android:layout_marginTop="20dp"
        android:background="#00FF"
        android:textColor="#FFFF"/>

    <TextView
        android:id="@+id/kagure_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@id/ben_text_view"
        android:textSize="24sp"
        android:text="Kagure"
        android:layout_marginLeft="15dp"
        android:layout_marginTop="20dp"          
        android:background="#00FF"
        android:textColor="#FFFF"/>

</RelativeLayout>
30.png
31.png
32.png
33.png 
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ImageView
        android:src="@drawable/ocean"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:scaleType="centerCrop"/>

    <TextView
        android:text="You're invited!"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@android:color/white"
        android:textSize="45sp"
        android:background="#009688"
        android:paddingTop="16dp"
        android:paddingRight="16dp"
        android:paddingLeft="16dp"
        android:paddingBottom="8dp"/>

    <TextView
        android:text="Bonfire at the beach"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@android:color/white"
        android:textSize="24sp"
        android:background="#009688"
        android:paddingBottom="16dp"
        android:paddingRight="16dp"
        android:paddingLeft="16dp"/>

</LinearLayout>
34.png 
In layers view 														Overlapping view

position attributes

35.png
36.png
37.png
38.png
Retrieved from "http://wiki.sinfronteras.ws/index.php?title=Android_App&oldid=10053"