Android

Lecture 3 Application
Structure
 Android Project folder Structure
Android Manifests Folder
Android | res/values folder
Outline Android | build. Gradle
Styling and theming the user interface
User Interface Design
Project Folder Structure
Android Project folder Structure
The android project contains different types of app modules:

1.Manifests Folder
2.Java Folder
3.res (Resources) Folder
1. Drawable Folder
2. Layout Folder
3. Mipmap Folder
4. Values Folder
4.Gradle Scripts
 Manifests Folder
• Manifests folder contains AndroidManifest.xml for creating our android application.
• Contains information about our application such as the Android version(Android API ),
metadata.
• This file include nodes for each of the Activities, Services, Content Providers and
Broadcast Receiver that make the application and using Intent Filters and Permissions,
determines how they co-ordinate with each other and other applications.
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http:// schemas.android.com/apk/res/android"
package="com.geeksforgeeks.myapplication">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />

</intent-filter>
</activity>
</application>
</manifest>
Permission
Permissions (which the application needs in order to access protected parts of
the system, such as External memory or Internet connection.
Manifest the document using the <permission-uses> property

<manifest ...>

<uses-permission android:name="android.permission.INTERNET" /> <uses-

permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.CAMERA" /> <uses-
permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
</manifest>
Android Screen Orientation

The ScreenOrientation is the attribute of activity element. The orientation of android activity can be
portrait, landscape, sensor, unspecified etc. You need to define it in the AndroidManifest.xml file.

Syntax:

<activity android:name="package_name.Your_ActivityName"
android:screenOrientation="orirntation_type">
</activity>

Example:

<activity android:name=" example.javatpoint.com.screenorientation.MainActivity"

android:screenOrientation="portrait">
</activity>
<activity android:name=".SecondActivity"
android:screenOrientation="landscape">
</activity>
 Java folder
• The Java folder contains all the java and Kotlin source code (.java) files.
• These files are used as a controller for controlled UI (Layout file).
• It gets the data from the Layout file and after processing that data output will
be shown in the UI layout.
• It works on the backend of an Android application.
 Resource (res) folder

The resource folder is the

most important folder
because it contains all
the non-code sources
like images, XML layouts,
and UI strings for our
android application.
App resources
Static content or additional files that your code uses
● Layout files
● Images
● Audio files
● User interface strings
● App icon
res/drawable folder
It contains the different types of images used for the development of the application. Drawable may take a
variety of file like Bitmap (PNG, JPEG).

res/mipmap folder
This folder contains launcher.xml files to define icons that are used to show on the home screen. It contains
different density types of icons depending upon the size of the device such as hdpi, mdpi, xhdpi.

res/layout folder
The layout folder contains all XML layout files which we used to define the user interface of our application. It
contains the activity_main.xml file.
res/values folder
Values folder contains a number of XML files like strings, dimensions, colors,
themes and style definitions.
•Houses various XML files that define reusable resources for your app, promoting
organization, maintainability, and adaptability.
•Resources can be customized for different device configurations and languages.

Accessing Resources:
•In code: Use the R class (e.g., getString(R.string.app_name) ).
•In XML layouts: Reference resources using the @ symbol (e.g., @color/primaryColor).
String resources
Basic function of the strings.xml is to define the strings in one file so that it is
easy to use same string in different positions in the android project.

Declare string.xml
Found In res/values/string.xml:

<resources>
<stringname="app_name">NameOfTheApplication</string>
<string name="checked">Checked</string>
<string name="unchecked">Unchecked</string>
</resources>
Accessing Strings

•In code: Use getString(R.string.string_name).

•In XML layouts: Reference strings using @string/string_name.
Color resources
Centralizes reusable color definitions for your app.
Separates color values from code and layouts, enhancing readability and
organization.
An Android project contains 3 essential colours namely:
•colorPrimary
•colorPrimaryDark
•colorAccent
Declare color.xml
A way to name and standardize colors throughout your app
In res/values/colors.xml:
<resources>
<color name="purple_200">#FFBB86FC</color>
<color name="purple_500">#FF6200EE</color>
<color name="purple_700">#FF3700B3</color>
<color name="teal_200">#FF03DAC5</color>
<color name="teal_700">#FF018786</color>
...
</resources>
Accessing Colors

•In code: Use getResources().getColor(R.color.colorName).

•In layouts: Set colors for views using the @color resource reference
(e.g., android:textColor="@color/text_color").
Dimension resources
•Stores predefined dimensions (sizes and margins) for layout elements in your app.

•Centralizes these values for easy modification and consistent use across your UI.

•Promotes adaptability by offering flexible dimension definitions for different screen sizes and
devices.
Declare dimens.xml
Declare your dimension values in res/values/dimens.xml:

<resources>
<!-- Default screen margins, per the Android Design
guidelines. -->
<dimen name="activity_horizontal_margin">16dp</dimen>
<dimen name="activity_vertical_margin">16dp</dimen>
<dimen name="nav_header_vertical_spacing">8dp</dimen>
</resources>
Accessing Dimensions

•In code: Use the getResources().getDimension method with the dimension name
(e.g., float margin = getResources().getDimension(R.dimen.padding_small);).
•In XML layouts: Set dimensions for views using the @dimen resource reference
(e.g., android:layout_margin="@dimen/large_margin").
Styles
● A style is a collection of view attributes, specific to a
type of view.
● Used to specify the visual design of your app.
● Use a style to create a collection of reusable styling information, such
as font size or colors.
● Good for declaring small sets of common designs used throughout
your app.
Declare a style
In res/values/styles.xml:

<style name="DescriptionStyle">
<item name="android:textColor">#00FF00</item>
<item name="android:textSize">16sp</item>
...

</style>
Apply a style
On a view in a layout file:

<TextView
style="@style/DescriptionStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"

android:text="@string/description_text" />
Themes
●Collection of named resources, useful broadly across the app
●Named resources are known as theme attributes
●Examples:
○ Use a theme to define primary & secondary colors in the app
○ Use a theme to set the default font for all text within an activity
Declare a theme
In res/values/themes.xml:
<style name="Theme.MyApp" parent="Theme.MaterialComponents.Light">
<item name="colorPrimary">@color/orange_500</item>
<item name="colorPrimaryVariant">@color/orange_700</item>
<item name="colorSecondary">@color/pink_200</item>
<item name="colorSecondaryVariant">@color/pink_700</item>
...
</style>
Apply a theme
In AndroidManifest.xml:

<manifest ... >

<application ... >
<activity android:theme="@style/Theme.MyApp" ... >
</activity>
</application>
</manifest>
In layout file:

<ConstraintLayout …
android:theme="@style/Theme.MyApp">
 Gradle Scripts folder
• Gradle means automated build system
and it contains a number of files that are
used to define a build configuration that
can be applied to all modules in our
application.
• Manages the build cycle via a series of
tasks (for example, compiles Java
sources, runs tests, installs app to
device)
 Why is Gradle Needed?
A Gradle takes all the source files (java and XML) and applies appropriate tools.
Converts the java files into dex files and compresses all of them into a single file
known as apk.
There are two types of build.gradle scripts
•Top-level build.gradle
•Module-level build.gradle
 Assets Folder
In Android one can store the raw asset file like JSON, Text, mp3, HTML, pdf, etc in two possible locations:

1.assets

2.res/raw folder

an Assets folder in which we usually use to keep

the web files like HTML.

The raw folder in Android is used to keep

mp3, mp4 files, etc.

Components of an Android Application
There are the following main components of an android app:

Activities
Activities are said to be the presentation layer of our applications.
public class MainActivity extends Activity {
}

Services
Services are like invisible workers of our app. These components run at the backend,
updating your data sources and Activities, triggering Notification, and also broadcast
Intents.

public class ServiceName extends Service {

}
Content Providers

It is used to manage and persist the application data also typically interacts with the

SQL database. Responsible for sharing the data beyond the application boundaries.

Broadcast Receivers

Broadcast Receivers make our application react to any received Intent thereby making

them perfect for creating event-driven applications.

Intents: It is a powerful inter-application message-passing framework.

Fragments: Fragments are like parts of activity.

Additional Components

• Views: UI elements that are drawn on-screen including buttons, lists forms etc.

• Layouts: View hierarchies that control screen format and appearance of the views.

• Widgets: These are the small visual application components that you can find on the

home screen of the devices.

• Notifications: Notifications are the application alerts that are used to draw the user’s

attention to some particular app event without stealing focus or interrupting the

current activity of the user.

User Interface
What is User Interface?
User Interface (UI) defines the way humans interact with the information
systems.

User Interface (UI) is a series of pages, screens, buttons, forms and other
visual elements that are used to interact with the device.

No need to learn complex commands/languages for working with UI.

Usage of blocks and typography makes user experience better.

XML
• Extensible Markup Language (XML) is a markup language that defines a set of rules for encoding
documents in a format that is both human-readable and machine-readable.
• XML is a markup language much like HTML used to describe data.
• XML only contains tags.
• XML tags define the data and used to store and organize data.
• In Android XML is used to implement the UI-related data.

The simple syntax of XML is

<tag_name>Hello World!</tag_name>

<string name="app_name">GFG Article</string>

Different Types of XML Files Used in Android Studio
Layout XML files: responsible for the actual User Interface of the application.
AndroidManifest.xml file: This file describes the essential information about the application.
Drawable XML files: provide graphics to elements like custom background for the buttons and its ripple effects.
strings.xml file : contains texts for all the TextViews widgets.
themes.xml file: defines the base theme and customized themes of the application.
colors.xml file: is responsible to hold all the types of colors required for the application.
dimens.xml file: is responsible to hold the entire dimensions for the views.
Layouts in Android UI Design
• All the elements in a layout are built using a hierarchy
of View and ViewGroup objects.
• Android Layout is used to define the user interface that holds the UI
controls or widgets that will appear on the screen of an android
application or activity screen.
• You can display your contents effectively by using the right
combination of layouts.
Android Layouts
The most commonly used layout classes that are found in Android SDK are:
• Linear Layout
• Constraint Layout
• Relative Layout
• Grid Layout

LinearLayout RelativeLayout
Linear Layout
Linear Layout is the most basic layout in android studio, that aligns all the children sequentially either
in a horizontal manner or a vertical manner by specifying the android:orientation attribute.

All the child elements arranged one by one in multiple rows and multiple columns.

Horizontal list: One row, multiple columns.

Vertical list: One column, multiple rows.

Declare Linear Layout in XML file
XML
<?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

TextView
// Add another child elements here like
// EditText, button etc TextView
</LinearLayout>
Android Relative Layout
Android Relative Layout is a View Group subclass, used to specify the position of
child View elements relative to each other like (A to the right of B) or relative to
the parent (fix to the top of the parent).
Declare Relative Layout in XML file
XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk
/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="10dp"
android:paddingRight="10dp">

// Add other view or ViewGroup here

</RelativeLayout>
 Constraint Layout
● Constraint Layout provides you the ability to completely design
your UI with the drag and drop feature provided by the Android
Studio design editor.
● Solves costly issue of too many nested layouts, while
allowing complex behavior
● Position and size views within it using a set of constraints
What is a constraint?
A restriction or limitation on the
properties of a View that the
layout attempts to respect
Declare Constraint Layout in XML file
<?xml version="1.0" encoding="utf-8"?>

<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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MyActivity">

</androidx.constraintlayout.widget.ConstraintLayout>
FrameLayout
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
TextView
android:layout_height="match_parent"
android:text="Hello World!"/>
</FrameLayout>
Views
●Views are the user interface building blocks in Android
○ Bounded by a rectangular area on the screen
○ Responsible for drawing and event handling
○ Examples: TextView, ImageView, Button
●Can be grouped to form more complex user interfaces
View attributes
●Use view attributes to set attributes explicitly for each view
●You can use every property that can be set via styles or themes
●Use for custom or one-off designs such as margins, paddings, or
constraints
Size of a View
●wrap_content
android:layout_width="wrap_content"
●match_parent
android:layout_width="match_parent"
●Fixed value (use dp units)
android:layout_width="48dp"
width and height are the dimension of the layout/view which can be specified in terms
of dp (Density-independent Pixels), sp ( Scale-independent Pixels).

•Use dp for all of your layout dimensions.

•Use sp for text sizes.

android:layout_width=wrap_content tells your view to size itself to the dimensions

required by its content.
android:layout_width=fill_parent tells your view to become as big as its parent view.
 Android devices
● Android devices come in many different
form factors.
● More and more pixels per inch are being
packed into device screens.
● Developers need the ability to specify
layout dimensions that are consistent across
devices.
Thank
you