Home > Tricks & Tips > Create floating view using FrameLayout

Create floating view using FrameLayout


Today, something just poped-up on my mind: how to make some views keep visible on the screen? After doing some searchings I’ve found that it can be achieved by using FrameLayout.

Look up at Android Developers’  Reference on FrameLayout.

I took it in practice: creating a layout containing a TextView and a ListView, in which the TextView is always floating on the top of the screen.

Floating View 1

Floating View 1

This is what it looks like at initial state and when I scroll down the list, the TextView should also stay at the top as well.

Float View 2

Float View 2

As you see, it still stays on top of the screen.

Here a sample of using FrameLayout in order to achieve floating state for View:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
>
	<TextView
		android:id="@+id/tvTop"
		android:gravity="top|center_horizontal"
		android:layout_width="fill_parent"
		android:layout_height="20dip"
		android:text="FLOATING VIEW - TOP"
		android:textColor="#000000"
		android:textStyle="bold"
		android:background="#FFFFFF"
	/>

	<LinearLayout
	    android:orientation="vertical"
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	>

		<ListView
			android:id="@+id/lvMain"
			android:layout_width="fill_parent"
			android:layout_height="wrap_content"
		/>

	</LinearLayout>

</FrameLayout>

This design probably makes your application look cooler.
Hope you like it!

Cheers,
Pete Houston

  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: