Mobile Application Development

CSL 341

Lab Journal 3

Salman Ahmed
01-135201-089

Department of Computer Science

BAHRIA UNIVERSITY, ISLAMABAD
 Lab # 3: Activities and layouts

Task # 1:

1. Design a meaningful Android activity that must have 7 views (at least 4 distinct). The same activity
must be designed using all the following layouts individually, i.e. each time use different layout that
produces the same result. Use all the following layouts to design your activity:
 Linear Layout
 Relative Layout
 Constraint Layout
 Table Layout
 Frame Layout
 Absolute Layout
 Grid Layout

Relative layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/textView6"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="104dp"
android:layout_marginTop="55dp"
android:layout_marginEnd="133dp"
android:layout_marginBottom="62dp"
android:text="Calculator"
android:textSize="34sp" />

<Button
android:id="@+id/button"
android:layout_width="132dp"
android:layout_height="46dp"
 android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_marginStart="66dp"
android:layout_marginEnd="23dp"
android:layout_marginBottom="162dp"
android:layout_toStartOf="@+id/button2"
android:text="CALCULATE" />

<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_marginEnd="98dp"
android:layout_marginBottom="160dp"
android:text="EXIT" />

<EditText
android:id="@+id/editTextTextPersonName2"
android:layout_width="233dp"
android:layout_height="68dp"
android:layout_above="@+id/button"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="82dp"
android:layout_marginEnd="95dp"
android:layout_marginBottom="20dp"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 2" />

<TextView
android:id="@+id/textView5"
android:layout_width="175dp"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName2"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="104dp"
android:layout_marginEnd="131dp"
android:layout_marginBottom="52dp"
android:text="ENTER 2ND VALUE"
android:textSize="20sp" />

<EditText
android:id="@+id/editTextTextPersonName3"
android:layout_width="252dp"
android:layout_height="73dp"
android:layout_above="@+id/textView5"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="68dp"
android:layout_marginEnd="91dp"
android:layout_marginBottom="34dp"
android:ems="10"
 android:inputType="textPersonName"
android:text="VAL 1" />

<TextView
android:id="@+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName3"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="101dp"
android:layout_marginEnd="137dp"
android:layout_marginBottom="43dp"
android:text="ENTER 1ST VALUE"
android:textSize="20sp" />

<CheckBox
android:id="@+id/checkBox"
android:layout_width="187dp"
android:layout_height="66dp"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_marginStart="108dp"
android:layout_marginEnd="116dp"
android:layout_marginBottom="44dp"
android:text="do you like it"
android:textSize="20sp" />

</RelativeLayout>
Linear vertical

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"> <!-- Vertical Orientation set -->
<!-- Child Views(In this case 2 Button) are here -->
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/textView6"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_alignParentEnd="true"
 android:layout_marginStart="104dp"
android:layout_marginTop="55dp"
android:layout_marginEnd="133dp"
android:layout_marginBottom="62dp"
android:text="Calculator"
android:textSize="34sp" />

<TextView
android:id="@+id/textView5"
android:layout_width="175dp"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName2"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="104dp"
android:layout_marginEnd="131dp"
android:layout_marginBottom="52dp"
android:text="ENTER 1ST VALUE"
android:textSize="20sp" />

<EditText
android:id="@+id/editTextTextPersonName3"
android:layout_width="252dp"
android:layout_height="73dp"
android:layout_above="@+id/textView5"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="68dp"
android:layout_marginEnd="91dp"
android:layout_marginBottom="34dp"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 1" />

<TextView
android:id="@+id/textView5"
android:layout_width="175dp"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName2"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="104dp"
android:layout_marginEnd="131dp"
android:layout_marginBottom="52dp"
android:text="ENTER 2ND VALUE"
android:textSize="20sp" />

<EditText
android:id="@+id/editTextTextPersonName2"
android:layout_width="233dp"
android:layout_height="68dp"
android:layout_above="@+id/button"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="82dp"
android:layout_marginEnd="95dp"
 android:layout_marginBottom="20dp"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 2" />

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"> <!-- Vertical Orientation set -->
<!-- Child Views(In this case 2 Button) are here -->

<Button
android:id="@+id/button"
android:layout_width="132dp"
android:layout_height="46dp"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_marginStart="66dp"
android:layout_marginEnd="23dp"
android:layout_marginBottom="162dp"

android:text="CALCULATE" />

<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_marginTop="-210dp"
android:layout_marginLeft="230dp"
android:layout_marginRight="2dp"
android:text="EXIT"
/>
</LinearLayout>
<CheckBox
android:id="@+id/checkBox"
android:layout_width="187dp"
android:layout_height="66dp"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_marginLeft="100dp"
android:layout_marginTop="-120dp"
android:layout_marginRight="2dp"
android:text="do you like it"
android:textSize="20sp" />

</LinearLayout>
 Constraint layout
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"

android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
 android:layout_alignParentEnd="true"
android:text="Calculator"
android:textSize="34sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
tools:layout_editor_absoluteY="35dp" />

<TextView
android:id="@+id/textView5"
android:layout_width="175dp"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName2"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:text="ENTER 1ST VALUE"
android:textSize="20sp"
tools:layout_editor_absoluteX="118dp"
tools:layout_editor_absoluteY="145dp" />

<EditText
android:id="@+id/editTextTextPersonName3"
android:layout_width="252dp"
android:layout_height="73dp"
android:layout_above="@+id/textView5"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 1"
tools:layout_editor_absoluteX="95dp"
tools:layout_editor_absoluteY="365dp" />

<TextView
android:id="@+id/textView6"
android:layout_width="175dp"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName2"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:text="ENTER 2ND VALUE"
android:textSize="20sp"
tools:layout_editor_absoluteX="118dp"
tools:layout_editor_absoluteY="307dp" />

<EditText
android:id="@+id/editTextTextPersonName2"
android:layout_width="233dp"
android:layout_height="68dp"
android:layout_above="@+id/button"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 2"
 tools:layout_editor_absoluteX="89dp"
tools:layout_editor_absoluteY="193dp" />

<Button
android:id="@+id/button"
android:layout_width="132dp"
android:layout_height="46dp"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"

android:text="CALCULATE"
tools:layout_editor_absoluteX="74dp"
tools:layout_editor_absoluteY="498dp" />

<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:text="EXIT"
tools:layout_editor_absoluteX="252dp"
tools:layout_editor_absoluteY="496dp" />

<CheckBox
android:id="@+id/checkBox"
android:layout_width="187dp"
android:layout_height="66dp"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:text="do you like it"
android:textSize="20sp"
tools:layout_editor_absoluteX="95dp"
tools:layout_editor_absoluteY="572dp" />

</androidx.constraintlayout.widget.ConstraintLayout>
 Table layout
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"

android:orientation="vertical"
android:stretchColumns="1">
<TableRow android:padding="5dip">

<TextView
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:layout_span="2"
android:gravity="center_horizontal"
android:text="Calculator"

android:textSize="34sp"
 android:textStyle="bold" />
</TableRow>
<TableRow>
<TextView
android:id="@+id/textView6"
android:layout_width="175dp"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName2"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="104dp"
android:layout_marginEnd="131dp"
android:layout_marginBottom="52dp"
android:text="ENTER 1ST VALUE"
android:textSize="20sp" />

</TableRow>
<TableRow>

<EditText
android:id="@+id/editTextTextPersonName3"
android:layout_width="252dp"
android:layout_height="73dp"
android:layout_above="@+id/textView5"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="68dp"
android:layout_marginEnd="91dp"
android:layout_marginBottom="34dp"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 1" />

</TableRow>

<TableRow>
<TextView
android:id="@+id/textView5"
android:layout_width="175dp"
android:layout_height="wrap_content"
android:layout_above="@+id/editTextTextPersonName2"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="104dp"
android:layout_marginEnd="131dp"
android:layout_marginBottom="52dp"
android:text="ENTER 2ND VALUE"
android:textSize="20sp" />

</TableRow>

<TableRow>
<EditText
android:id="@+id/editTextTextPersonName2"
android:layout_width="233dp"
android:layout_height="68dp"
 android:layout_above="@+id/button"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="82dp"
android:layout_marginEnd="95dp"
android:layout_marginBottom="20dp"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 2" />

</TableRow>

<TableRow>

<Button
android:id="@+id/button"
android:layout_width="120dp"
android:layout_height="46dp"
android:layout_column="0"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_marginStart="66dp"
android:layout_marginEnd="180dp"
android:layout_marginBottom="162dp"

android:text="CALCULATE" />

<Button
android:id="@+id/button2"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_marginLeft="250dp"
android:layout_marginTop="-210dp"
android:layout_marginRight="50dp"
android:text="EXIT" />

<TableRow>
<CheckBox
android:id="@+id/checkBox"
android:layout_width="187dp"
android:layout_height="66dp"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_marginLeft="100dp"
android:layout_marginTop="50dp"
android:layout_marginRight="2dp"
android:text="do you like it"
android:textSize="20sp" />
 </TableRow>

<TableRow>

</TableRow>

</TableLayout>

Absolute layout
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:ignore="Deprecated" >

<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="123dp"
android:layout_y="24dp"
android:text="Calculator"
android:textSize="34sp" />

<EditText
android:id="@+id/editTextTextPersonName"
android:layout_width="231dp"
android:layout_height="73dp"
android:layout_x="85dp"
android:layout_y="183dp"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 1" />

<EditText
android:id="@+id/editTextTextPersonName2"
android:layout_width="231dp"
android:layout_height="73dp"
android:layout_x="88dp"
android:layout_y="341dp"
android:ems="10"
android:inputType="textPersonName"
android:text="VAL 2" />

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="117dp"
android:layout_y="132dp"
android:text="ENTER 1ST VALUE"
android:textSize="20sp" />

<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="114dp"
android:layout_y="299dp"
android:text="ENTER 2ND VALUE"
android:textSize="20sp" />

<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
 android:layout_height="wrap_content"
android:layout_x="87dp"
android:layout_y="471dp"
android:text="CALCULATE" />

<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="229dp"
android:layout_y="474dp"
android:text="EXIT" />

<CheckBox
android:id="@+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="130dp"
android:layout_y="562dp"
android:text="do you like it"
android:textSize="16sp" />
</AbsoluteLayout>
 Frame Layout

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent">

<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content"
 android:text="Calculator"
android:textSize="34sp"
android:layout_gravity="top|center_horizontal" />

<EditText
android:id="@+id/editTextTextPersonName"
android:layout_width="231dp"
android:layout_height="73dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="150dp"
android:layout_gravity="top|center_horizontal"
android:text="VAL 1" />

<EditText
android:id="@+id/editTextTextPersonName2"
android:layout_width="231dp"
android:layout_height="73dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="320dp"
android:layout_gravity="top|center_horizontal"
android:text="VAL 2" />

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="100dp"
android:layout_gravity="top|center_horizontal"
android:text="ENTER 1ST VALUE"
android:textSize="20sp" />

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="280dp"
android:layout_gravity="top|center_horizontal"
android:text="ENTER 2ND VALUE"
android:textSize="20sp" />

<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="100dp"
android:layout_marginTop="440dp"
android:layout_gravity="top|left"
android:text="CALCULATE" />

<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
 android:layout_marginLeft="230dp"
android:layout_marginTop="440dp"
android:layout_gravity="top|left"
android:text="EXIT" />

<CheckBox
android:id="@+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"

android:layout_marginTop="510dp"
android:layout_gravity="top|center_horizontal"
android:text="do you like it"
android:textSize="16sp" />

</FrameLayout>
 Grid layout
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/favorites_grid"
android:layout_width="match_parent"
android:layout_height="match_parent"

android:rowCount="2"
android:columnCount="2">

<TextView

android:id="@+id/textView4"

android:layout_row="0"
android:layout_column="0"
android:layout_marginLeft="120dp"
android:layout_marginTop="10dp"
android:text="Calculator"
android:textSize="34sp" />

<TextView
android:id="@+id/textView1"
android:layout_row="01"
android:layout_column="0"
android:layout_marginLeft="110dp"
android:layout_marginTop="18dp"
android:text="ENTER 1ST VALUE"
android:textSize="20sp" />

<TextView
android:id="@+id/textView2"
android:layout_row="01"
android:layout_column="0"
android:layout_marginLeft="110dp"
android:layout_marginTop="200dp"
android:text="ENTER 1ST VALUE"
android:textSize="20sp" />

<EditText
android:id="@+id/editTextTextPersonName"
android:layout_width="231dp"
android:layout_height="73dp"
android:layout_row="01"
android:layout_column="0"
android:layout_marginLeft="90dp"
android:layout_marginTop="100dp"
android:text="VAL 1" />

<EditText
android:id="@+id/editTextTextPersonName2"
android:layout_width="231dp"
android:layout_height="73dp"
 android:layout_row="01"
android:layout_column="0"
android:layout_marginLeft="90dp"
android:layout_marginTop="300dp"
android:text="VAL 2" />

<Button
android:id="@+id/button2"
android:layout_row="01"
android:layout_column="0"
android:layout_marginLeft="100dp"
android:layout_marginTop="400dp"
android:text="CALCULATE" />

<Button
android:id="@+id/button3"
android:layout_row="01"
android:layout_column="0"
android:layout_marginLeft="250dp"
android:layout_marginTop="400dp"
android:text="EXIT" />

<CheckBox
android:id="@+id/checkBox"
android:layout_row="01"
android:layout_column="0"
android:layout_marginLeft="110dp"
android:layout_marginTop="480dp"
android:text="do you like it"
android:textSize="16sp" />

</GridLayout>