2. 2
Course Outcomes
ESC155: Mobile Application Development
ESC255: Lab-III: Mobile Application Development
CO1: Explain Android Ecosystem and features of android operating system (II Understand)
CO2: Configure Android environment and development tools. (III Apply)
CO3: Use different layouts and control flow for designing User interface. (III Apply)
CO4: Design user interface using different UI Components of Android. (III Apply)
CO5: Demonstrate different lifecycles in Android. (III Apply)
CO6: Illustrate process of publishing an android app on google play store. (III Apply)
3. • UNIT-III: Control Flow, Directory Structure, components of a screen,
fundamental UI Design, Linear Layout, Relative Layout
Textbooks/ Reference Books :
1. Composing Mobile Apps , by Anubhav Pradhan, Anil V Deshpande, Wiley
Publication.
2. Android App Development for Dummies , Michael Burton , Wiley
Publication.
3. Android Programming for Beginners , John Horton , Packt Publishing.
3
7. 7
LOGICAL COMPONENTS OF AN ANDROID APP
1. Activity: It is the basis of the UI of any Android app. The overall UI may consist
of other visual elements, layout elements, resources, and many more things,
besides the Activity that forms the foundation of UI
2. Service: Service is another key logical component of an Android app. It runs in
the background, and does not have an UI. To interact with a Service, typically
an UI (Activity) is associated with it.
3. Broadcast Receiver: While the mobile device is being used, there may be
several announcements (broadcasts) which an app needs to capture and
respond to. Announcements such as an incoming call, an incoming SMS,
availability of Wi-Fi spot, or low battery are initiated by the system.
4. Content Provider: Persisting data pertaining to an app and making it accessible
across apps is a crucial aspect of mobile app development. However, as a
security feature, the Android platform prevents one app to access data of
another app. To overcome this constraint, where an app needs to share the
data with other apps, the data has to be exposed, which is done using Content
Provider.
8. 8
Because mobile apps run in resource-constrained
environments, there is a dire need to ensure that they are
optimally designed, responsive, and performant.
The Android SDK comes bundled with a rich set of tools that
not only help developers to cater to these pressing demands
but also provide utilities that help them during the
development of apps.
These tools are broadly classified as SDK tools and platform
tools.
SDK tools are Android platform version agnostic, and are
present in the tools subfolder of the SDK.
Platform tools are specific to Android platform version, and
are present in platform-tools subfolder of the SDK.
ANDROID TOOL REPOSITORY
10. 10
Components of a Screen
• Application components are the essential building blocks of an
Android application.
• These components are loosely coupled by the application
manifest file AndroidManifest.xml that describes each
component of the application and how they interact.
• A Screen is basic elements of GUI which holds the interface
for the user.
• A Screen in android can contain following components,
1. Activity 2. Layout 3. Views 4. ViewGroup
11. 11
• An activity is the single screen in android.
• It is like window or frame of Java.
• By the help of activity, you can place all your UI
components or widgets in a single screen.
1. Activity
2. Layout
• A layout defines the structure for a user interface in your app,
such as in an activity.
• All elements in the layout are built using a hierarchy
of View and ViewGroup objects.
13. 3. Views
• View class represents the basic building block for user
interface components.
• A View occupies a rectangular area on the screen and is
responsible for drawing and event handling.
• View is the base class for widgets, which are used to create
interactive UI components (buttons, text fields, etc.).
• The ViewGroup subclass is the base class for layouts, which
are invisible containers that hold other Views (or other
ViewGroups) and define their layout properties.
• Views may have an integer id associated with them. These
ids are typically assigned in the layout XML files, and are
used to find specific views within the view tree. A common
pattern is to:
13
15. 4. ViewGroup
• A ViewGroup is a special view that can contain other views (called children.)
• The view group is the base class for layouts and views containers.
• This class also defines the ViewGroup.LayoutParams class which serves as the
base class for layouts parameters.
15
16. Fundamental UI Design
Layout / ViewGroup
View
Activities
Fragments
Notification overview
App bar / Action Bar
ViewPager : ViewPager object can animate screen slides automatically
Swipe to refresh
Toast Messages: Simple feedback about an operation in a small popup.
Dialog boxes
Menus
Search
16
17. Layouts
There are many types of layout. Some of which are listed below −
o Linear Layout
o Absolute Layout
o Table Layout
o Frame Layout
o Relative Layout
17
18. Linear Layout
• Linear layout is further divided into horizontal and vertical layout.
• It means it can arrange views in a single column or in a single row.
• Here is the code of linear layout(vertical) that includes a text view.
18
<?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:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”@string/hello” />
</LinearLayout>
19. Absolute Layout
The AbsoluteLayout enables you to specify the exact location
of its children.
It can be declared like this.
19
<AbsoluteLayout
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
xmlns:android=”http://schemas.android.com/apk/res/android” >
<Button
android:layout_width=”188dp”
android:layout_height=”wrap_content”
android:text=”Button”
android:layout_x=”126px”
android:layout_y=”361px” />
</AbsoluteLayout>
20. TableLayout
The TableLayout groups views into rows and columns.
It can be declared like this.
20
<TableLayout
xmlns:android=”http://schemas.android.com/apk/res/android”
android:layout_height=”fill_parent”
android:layout_width=”fill_parent” >
<TableRow>
<TextView
android:text=”User Name:”
android:width =”120dp”
/>
<EditText
android:id=”@+id/txtUserName”
android:width=”200dp” />
</TableRow>
</TableLayout>
21. RelativeLayout
The RelativeLayout enables you to specify how child views are
positioned relative to each other.
It can be declared like this.
21
<RelativeLayout
android:id=”@+id/RLayout”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
xmlns:android=”http://schemas.android.com/apk/res/android” >
</RelativeLayout>