Types of Android UI layouts

Layout is used in android to describe the user interface for an app or function, and it will carry theAndroid UI elements that appear to the user. In this article let us discuss different types of layouts inAndroid UI.

To learn android course visit:android development course

Android UI layout
An Android layout is a class that arranges how its kids show up on the computer. Anything that is a View (or View inherits) can be a layout body. All of the layouts are inherited from ViewGroup (which View inherits) so you can nest layouts. You can also create your own custom layout by creating a class which is inherited from ViewGroup. The image below illustrates the hierarchy of inheritance between views in Android.

In the android app, the user interface is made from a set of View and ViewGroup objects. For instance, one or more tasks will be found in the android apps, and each activity is one screen of the app. The activities can contain multiple components of the Android UI and those components of the Android UI are instances of subclasses of View and ViewGroup. The View is a base class for all components of the Android UI in android and is used to build interactive components of the Android UI such as TextView, EditText, Checkbox, Radio Click, etc. and is responsible for handling and drawing events.The ViewGroup is a View subclass, and will serve as a base class for parameter layouts and layouts. The ViewGroup will provide a transparent container for holding certain Views or ViewGroups and definingproperties for the layout.

Check out this Android View and ViewGroup to learn more about View and ViewGroup in smartphone apps Within android, we can define a layout in two ways:

● Declare Android UI elements in XML
● Instantiate Layout

The android framework will allow us to use one or both of those methods to define the Android UI of our application.
Declare Android UI elements in XML In android, by using default View in android XML and ViewGroups in the XML format, we can build layouts the same as web pages in HTML. The layout file must contain only one root element, which must be an object called View or ViewGroup. After the root element is specified, additional layout objects or widgets may be added to build the View Hierarchy which defines our layout as child elements.
The example below is the description of a layout in an XML file (activity main.xml) using LinearLayout to hold a TextView, EditText, and click.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/fstTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter Name"
/>
<EditText
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10">
</EditText>
<Button
android:id="@+id/getName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Get Name" />
</LinearLayout>
Load XML Layout File from an Activity
Once the layout has been generated, we need to load the XML layout resource from our onCreate()

protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}

If you look at the above code, we name our l. Here our file name xml is activity main.xml so we used activity main as the file name.
In general, the onCreate() callback method will be called by android framework during the start of our application

in order to get the correct layout for an application. Instantiate Layout Elements at Runtime We need to build our own custom View and ViewGroup objects with appropriate templates programmatically if we want to instantiate layout elements at run time.

To learn android complete course visit:android course

The following is the example of building a layout using LinearLayout to programmatically keep a TextView, EditText, and Button in an operation using custom View and ViewGroup objects.
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
TextView textView1 = new TextView(this);
textView1.setText("Name:");
EditText editText1 = new EditText(this);
editText1.setText("Enter Name");
Button button1 = new Button(this);
button1.setText("Add Name");
LinearLayout linearLayout = new LinearLayout(this);
linearLayout.addView(textView1);
linearLayout.addView(editText1);
linearLayout.addView(button1);
setContentView(linearLayout);
}
}

Width and height
Using attributes layout width and layout height, when we define a layout using XML file, we need to set width and height for each View and ViewGroup feature.
The following is an example of setting the width and height in XML layout file for View and ViewGroup components.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/fstTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter Name" />
</LinearLayout