ScrollView white space at bottom - android

I'm having an issue with ScrollView which leaves a blank space at the bottom. It is filled with few TextViews and GridViews and should fill the whole RelativeLayout parent.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context=".showPictures">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView.../>
<GridView.../>
...
</LinearLayout>
</ScrollView>
</RelativeLayout>
Does anybody have an idea what's wrong?

Make your relative layout height match parent, also use android:fillViewPort = "true" in your scroll view
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".showPictures">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
//...

you can use this code to avoid extra padding on bottom of scroll view:
android:overScrollMode="never"

In my case I had a GridView inside a ScrollView that was causing this issue. It turns out the the layout_gravity in the GridLayout as 'center' was causing this issue.
'center_horizontal' makes more sense for a ScrollView anyway, but I added the ScrollView after the original layout was done (using 'center'), when I saw that the elements were going off-screen on some devices, hence the issue.
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal" // having this as android:layout_gravity="center" causes extra space at bottom!
android:columnCount="2">
....

Give weight to every child in the scroll view including linear layout with value 1

Related

Android Scrollview Won't fill parent space

I have a relative layout fills the entire screen. I want to add a scrollview in the middle of it to wrap a bunch of content so that I can make it pan up when the soft keyboard gets displayed. However, as soon as I wrap it in a scrollview, the bottom most layout stops filling the remainder of the screen.
Here is the XML where I have the ScrollView commented out.
<include
android:id="#+id/top_bar_with_save_button"
layout="#layout/top_bar_with_save_button"/>
<FrameLayout
android:id="#+id/log_entry_title_frame"
android:layout_below="#id/top_bar_with_save_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/log_entry_title_frame"
android:layout_alignParentBottom="true">
<!--
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/log_entry_title_frame"
android:orientation="vertical"
android:background="#f00">
<!-- Lots of stuff in here -->
<EditText
android:id="#+id/log_entry_notes"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="8dp"
android:gravity="top|left"/>
</RelativeLayout>
<!--
</ScrollView>
-->
</LinearLayout>
It looks like this:
But as soon as I remove the comment from the ScrollView it immediately compresses like this:
Why does this happen? I need it to fill the entire space on the screen, and I cannot figure out what is happening. Can anyone tell me how to fix this? Thanks!
You need to add the fillViewport="true" attribute to your ScrollView tag. Or you can add it programmatically with scrollView.setFillViewPort(true);. Otherwise, the ScrollView will wrap to its child's content height.
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
... >
layout_height of scrolling container should be "wrap_content".

How to Prevent Scrolling within FrameLayouts and Instead Have the Parent LinearLayout Handle all Scrolling?

I have a scrollable LinearLayout parent with a few FrameLayouts nested inside it as follows:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:scrollbars="vertical"
android:orientation="vertical">
<FrameLayout
android:id="#+id/hb_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<FrameLayout
android:id="#+id/gn_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<FrameLayout
android:id="#+id/yt_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
I would like FrameLayouts to take up the space they need, allowing for scrolling of the full view through the LinearLayout.
Issue is: the LinearLayout will only take up the screen, it won't scroll, instead the FrameLayout's will scroll if the content overflows the bottom of the screen.
To be clear, I just want the FrameLayouts to fill whatever space they need, and the LinearLayout can scroll it like one long view. Must I fix the FrameLayout heights to achieve this? If so, is there risk of my layout breaking on different screen sizes/densities (or does DP really work in all cases?).
Thank you immensely!
EDIT: I have confirmed that setting fixed heights in the FrameLayout does exactly what I want this to do: scroll as one. However, why doesn't wrap_content measure the height and then go from there? That is what I expected the case was... I'm not certain how to judge the right heights for each element.
Try adding a scrollview to the layout
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:orientation="vertical">
<FrameLayout
android:id="#+id/hb_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<FrameLayout
android:id="#+id/gn_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<FrameLayout
android:id="#+id/yt_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</ScrollView>

LinearLayout does not return onFling?

I expect to display one picture each time and horizontally swipe to another picture through onFling(). The problem is I have to use ScrollView to wrap my ImageView so as to get response from onFling. If I use Linearlayout to wrap the ImageView, nothing happens when I swipe. I don't want to use scrollview because the picture can be scrolled vertically though it is the exact screen size. How can I achieve it? Below is my layout.xml
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:id="#+id/iv_tutorial"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
</ScrollView>
I fixed it by adding an attribute android:longClickable="true" to the LinearLayout.

Elements get hidden in ScrollView

I have the following:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/layout_question_types"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="18sp"
android:layout_marginTop="18sp"
android:orientation="horizontal" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- some content -->
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="18sp"
android:gravity="right"
android:orientation="vertical" >
<!-- some more content -->
</RelativeLayout>
</LinearLayout>
</ScrollView>
However, when I turn the phone horizontal to force the scrollbar, the scrollbar appears but the content at the bottom of the screen gets hidden.
Any ideas? There are similar questions on SO but they don't seem to fix the problem. Thanks.
Reason of this are margins and ScrollView parent FrameLayout which has some margin problems. Margins are ignored in measuring and scroll view measure its size without these margins and that is why the bottom part of inner views in ScrollView is not visible.
You can solve it simple wrapping child LinearLayout with another LinearLayout without margins.

Layout Weights do not work inside a ScrollView

I want to assign layout weights to several items within a LinearLayout inside of a ScrollView. However, the ScrollView ignores the LinearLayout weightSum.
My goal is to divide the layout with weights of 2, 1, 1 (for a total sum of 4), but this does not work properly inside of a ScrollView.
How can I solve this layout problem?
main.xml
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:weightSum="4">
<LinearLayout android:id="#+id/logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="2"
android:background="#FFFFFF" />
<LinearLayout android:id="#+id/logo1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1"
android:background="#000000" />
<LinearLayout android:id="#+id/logobutton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="1"
android:background="#4B4B4B" />
</LinearLayout>
</ScrollView>
I have faced this problem before. Just use android:fillViewport="true" in your ScrollView and it will fill up the screen.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
This won't work as you have done it. The child view of a ScrollView should be set to wrap_content. If you set it to fill_parent, it will fill the area of the ScrollView and never scroll, because it won't be larger than the ScrollView.
The idea of layout_weight is to fill a specific area proportionately.
You should set all of the child LinearLayouts layout_height to either wrap_content or a specific size (in dp) and the parent LinearLayout layout_height to wrap_content
As said you need to remove the additional
xmlns:android="http://schemas.android.com/apk/res/android"
if it's not the root (first) element of the layout.
just put this in your scroll view:
android:fillViewport="true"
In my experience, fillviewport=true works bit strange.
I solved this problem by wrapping LinearLayout with another Layout like FrameLayout.
I hope this helps.
Add below line in your ScrollView it will be work fine.
Only single child must be there for ScrollView
android:fillViewport="true"

Categories

Resources