Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set the fixed position for floating action button above very long listview in Android?

I am developing an Android app that is mostly working with listview. But I am having a problem using Floating Action Button together with Long ListView. My problem is as below.

When the list view is only has a few item. Floating item can be seen.

This is the screenshot:

enter image description here

As you can see above, Floating Action Button is still can be seen.But when ListView has so many items and become excessive to the screen, Floating Action Button cannot been seen.

This is the screenshot of Long Listview

enter image description here

For the second screen shot, it cannot be scrolled down any more.

What I want to achieve is, I want the floating bottom always at the bottom right of screen above Listview. Like fixed position in HTML and CSS.

I want Floating Action Button always here no matter how tall the Listview is

enter image description here

This is my layout file

<?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">
        <ListView
            android:dividerHeight="@dimen/list_item_divider_height"
            android:padding="@dimen/list_padding"
            android:divider="@color/whitesmoke"
            android:id="@+id/listview_podcast_list"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"></ListView>

        <TextView
            android:textSize="17dp"
            android:textStyle="bold"
            android:textColor="@color/black"
            android:textAlignment="center"
            android:id="@+id/tf_no_records"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/stop_podcast_button"
        android:background="@color/colorPrimary"
        android:src="@android:drawable/ic_dialog_email"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"/>
</LinearLayout>

How can I fix my code to achieve it?

like image 705
Wai Yan Hein Avatar asked Feb 11 '16 11:02

Wai Yan Hein


3 Answers

Try using RelativeLayout instead of LinearLayout. And for FloatingActionButton add attribute like this,

    android:layout_alignParentBottom="true"
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"
    android:layout_gravity="end|bottom"
like image 52
ajantha Avatar answered Oct 22 '22 08:10

ajantha


Try using with CoordinatorLayout

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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"
    android:fitsSystemWindows="true"
    tools:context="listview.anubavam.com.listview.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" >

        </android.support.v7.widget.Toolbar>


    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_menu_camera" />

</android.support.design.widget.CoordinatorLayout>
like image 5
sree Avatar answered Oct 22 '22 08:10

sree


Don't place button in a Linear Layout .

Use

FrameLayout so you can place Views on top of others

like image 1
Gaurav Avatar answered Oct 22 '22 09:10

Gaurav