Android FrameLayout in Kotlin

Android Framelayout is a ViewGroup subclass which is used to specify the position of multiple views placed on the top of each other to represent a single view screen.

Generally, we can say FrameLayout simply blocks a particular area on the screen to display a single view. Here, all the child views or elements are added in stack format means the most recently added child will be shown on the top of the screen.

But, we can add multiple children view and control their positions only by using gravity attributes in FrameLayout.



The FrameLayout can be defined using the code below:

filter_none

edit
close

play_arrow

link
brightness_4
code

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
  
   // Add items or widgets here
</FrameLayout>

chevron_right


activity_main.xml file

In this file, we declare the FrameLayout and start adding multiple view like textView, editText, and Button etc. All the view are placed on each other but we displace according to our requirement.

First, we add an image in the background and add other widgets on the top. On the screen, we can see the beautiful login page having an image in the background.

filter_none

edit
close

play_arrow

link
brightness_4
code

<?xml version="1.0" encoding="utf-8"?>
  
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="5dp">
  
    <ImageView
        android:id="@+id/imgvw1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:src="@drawable/img" />
  
    <TextView
        android:id="@+id/txtvw1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:background="#286F24"
        android:padding="10dp"
        android:text="Login Details"
        android:textColor="#FFFFFF"
        android:textSize="20sp"
        android:layout_marginLeft="100dp"/>
  
    <EditText
        android:id="@+id/editText1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="80dp"
        android:background="#ECEEE8"
        android:padding="10dp"
        android:hint="Enter your email" />
  
    <EditText
        android:id="@+id/editText2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="150dp"
        android:background="#ECEEE8"
        android:padding="10dp"
        android:hint="Enter password"/>
  
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text= "Submit"
        android:layout_marginTop="240dp"
        android:layout_marginLeft="110dp"/>
  
</FrameLayout>

chevron_right


MainActivity.kt

When we have created layout, we need to load the XML layout resource from our activity onCreate() callback method and access the UI element form the XML using findViewById.

filter_none

edit
close

play_arrow

link
brightness_4
code

package com.geeksforgeeks.myfirstKotlinapp
  
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
  
  
class MainActivity : AppCompatActivity() {
  
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        // finding the UI elements
  
  
    }
}

chevron_right


FrameLayout Output:

We need to run using Android Virtual Device(AVD) to see the output.



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.




Article Tags :

Be the First to upvote.


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.