Data Science Posts and Resources

Articles on Data Science

Android Layout - Basics

Introduction to Android Layout

Laxmi K Soni

6-Minute Read

Layout

A Layout represents a invisible component in an Android user interface. Layout in android are similar to Layout of rooms on a plot of given size. Layout is a container for different visible UI controls for example a Layout can hold “TextView”, “EditText” , “Button” which represents the different visible components on the UI screen of an Android application

There are different arrangements possible with given UI controls within a Layout therefore we have many different kinds of layout in an Android application.

In Android the term layout means describing how the View components are displayed on the screen relative to each other.

Android Layout

Android Layout means the UI interface which has the UI controls or widgets that will appear on the screen of an android application or activity. Every app is comprised of View and ViewGroup. As we know, an android app contains a many number of activities and we can say each activity is one page of the application. So, each activity has multiple UI interface components and those UI components are the instances of the View and ViewGroup.

View And ViewGroup

A View is the user interface which is useful to create an interactive UI components such as TextView, EditText, Radio Button, etc. and it responsible for event handling and drawing. A ViewGroup acts as a base cls for layouts and layouts params which hold many other Views or ViewGroups and to define the layout properties.

Types of Layouts

Linear Layout: LinearLayout is a subclass of ViewGroup and is means to provide child View elements one by one either in a particular direction either horizontally or vertically depending on the orientation property. The important properties of Linear Layout are Orientation, Fill model, weight, Gravity. Orientation takes values either horizontal or vertical and means the child views will be aligned either from left to right or from top to bottom. Fill model means to fill the available space with the given view for instance if there are three child views(200dp) to be rendered in 400dp width then the first child will take the width 200dp then the second view will be rendered to fill the width of 200dp since already the total width of 400dp is filled the third child will endup taking the width of 0dp. The third important property is weight. The weigh property specify how to split the available space between multiple child views. Suppose we want to layout ok and cancel button. Then we can use the weight property for splitting the space between two buttons equally. We can use weightSum property of the parent along with weight property of the child for dividing the screen among the children views.The gravity property means to slide the contents of the view in a particular direction. That means how a particular child view should be positioned within the parent. Gravity allow you move the content inside a container. (How sub-views will be placed).layout gravity allow you to override the parent gravity behavior ONLY along x-axis.

Relative Layout: RelativeLayout is a subclass of ViewGroup and is means 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 parent).

Frame Layout: FrameLayout is a subclass of ViewGroup and means to specify the position of View elements it contains on the top of each other to display only single View inside the FrameLayout. For example placing text over an image.

Table Layout: TableLayout is subcls of ViewGroup and is used to show the child View elements in rows and columns.

Web View: WebView means browser which is used to display the web pages in our activity layout.

List View: ListView is subclass of ViewGroup and means to display scrollable list of items in single column.

Grid View: GridView is a subclass of ViewGroup and is means to display scrollable list of items in grid View of rows and columns.

Properties

android:id : Used to specify the id of the view.

android:layout_width : The width of View and ViewGroup

android:layout_height: Used to declare the height of View and ViewGroup

android:layout_marginLeft: Declare the extra space used in the left side of View and ViewGroup in px (pixels), dp (density-independent pixels), sp (scaled pixels based on preferred font size), in (inches), and mm (millimeters).

android:layout_marginRight: Used to declare the extra space used in the Right side of View and ViewGroup in px (pixels), dp (density-independent pixels), sp (scaled pixels based on preferred font size), in (inches), and mm (millimeters).

android:layout_marginTop : Used to declare the extra space used in the Top side of View and ViewGroup in px (pixels), dp (density-independent pixels), sp (scaled pixels based on preferred font size), in (inches), and mm (millimeters).

android:layout_marginBottom : Used to declare the extra space used in the Bottom side of View and ViewGroup in px (pixels), dp (density-independent pixels), sp (scaled pixels based on preferred font size), in (inches), and mm (millimeters).

android:layout_gravity : Define how child Views are positioned in the layout.

Linear Layout

Linear layout is a Viewgroup containing different View. Linear arranges views in sequence. Orientation can be horizontal or vertical

Example

<LinearLayout

android:layout\_height="match\_parent"
android:layout\_width="match\_parent"
android:orientation="horizontal"
xmlns:android="http://schemas.android.com/apk/res/android" 
/>

Relative Layout

Relative layout is a Viewgroup containing different Views. Relative layout displays child views in relative positions. The position of each view component can be specified as relative to siblng elements (such as to the left-of or below another view). It can eliminate the neid for nested ViewGroup. Instead of nesting many LinearLayout we can just use RelativeLayout

Table Layout

ViewGroup that shows child elements in rows and col. It has structure similar to HTML table.In each cell you can use any kind of view element arran like columns in horizontal linear layout

ListView

ListView is a ViewGroup that makes a list of scrollable items. ListView is implemented by importing android.widget.ListView class. ListView makes use of the Adapter which in tern add the content from data source (such as string array, array, database etc) to ListView. Adapter bridges data between an AdapterViews and other Views (ListView, ScrollView etc).

Grid Layout

Places its children as rectangular grid. The grid is composed of a collection of infinitely thin lines that separate the viewing area into cells. All components in the layout are given equal size.

Tab Layout

TabLayout is used to implement horizontal tabs. TabLayout was released by Android after deprecetion of ActionBar.TabListener (API level 21). It provides horizontal layout to show tabs on the screen. We can display more screens in a single screen using tabs. We can quickly swipe between the tabs

Say Something

Comments

Nothing yet.

Recent Posts

Categories

About

about