Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adding view to bottom of layout inside a scrollview

So my layout looks basically like this:

<ScrollView>     <RelativeLayout>         <BunchOfViews/>         <ImageView android:layout_alignParentBottom="true"/>     </RelativeLayout> </ScrollView> 

I have the ScrollView so all of the layout always is visible no matter the height of the screen. The problem is that on a very high screen, I still want my ImageView to be at the bottom. However, a child of a ScrollView don't seem to have a defined bottom. The View is placed at the top of the layout. How can I solve this problem in a neat way?

like image 513
pgsandstrom Avatar asked Mar 10 '10 13:03

pgsandstrom


People also ask

How do you set a view at the bottom of a linear layout?

You will have to expand one of your upper views to fill the remaining space by setting android:layout_weight="1" on it. This will push your last view down to the bottom.

How many views can you use within a ScrollView?

Only one view can be included in a ScrollView .

What is fillViewport in ScrollView?

fillViewport allows scrollView to extend it's height equals to the full height of device screen's height in the cases when the child of scroll view has less height.


2 Answers

I ran into the same issue. I never could find a very pleasing solution, but here is how I did it. Maybe someone else has a better way, I hate adding layouts that don't do anything.

My hack was to add a dummy linearlayout at the bottom of the scrollview that has fill_parent to take up all the room and force the scrollview to fill the screen. Then add whatever component I want to that linearlayout.

Here is one of my layouts that does this:

<ScrollView     android:layout_width="fill_parent"     android:layout_height="fill_parent"     android:layout_weight="1"     android:fillViewport="true" >      <RelativeLayout         android:layout_width="fill_parent"         android:layout_height="fill_parent"         android:layout_marginTop="15px" >          <!-- bunch of components here -->          <LinearLayout             android:layout_width="fill_parent"             android:layout_height="fill_parent"             android:layout_below="@+id/spinner"             android:layout_marginTop="5px"             android:gravity="center_horizontal|bottom"             android:paddingTop="2px" >              <Button                 android:layout_width="wrap_content"                 android:layout_height="wrap_content"                 android:paddingLeft="20px"                 android:paddingRight="20px"                 android:text="Delete" />         </LinearLayout>     </RelativeLayout> </ScrollView> 
like image 110
dweebo Avatar answered Oct 08 '22 21:10

dweebo


I had the same issue and found this page:

http://www.curious-creature.org/2010/08/15/scrollviews-handy-trick/

Basically, you set the ScrollView's android:fillViewport to true, which will allow the child view to expand to the same height as the ScrollView itself, filling out the space. You then just need to have one of the child controls' layout_height set to fill_parent and layout_weight to 1, causing that control to "spring" to fill the empty space.

Note that if the contents of the ScrollView are already tall enough to fill the ScrollView, the android:fillViewport has no effect, so the setting only kicks in when needed.

My final XML looks like similar to this:

<ScrollView     android:layout_width="fill_parent"     android:layout_height="fill_parent"     android:fillViewport="true">     <LinearLayout         android:orientation="vertical"         android:layout_height="wrap_content">         <LinearLayout             android:layout_height="fill_parent"             android:layout_weight="1">             <!-- this expands to fill the empty space if needed -->         </LinearLayout>          <!-- this sits at the bottom of the ScrollView,         getting pushed out of view if the ScrollView's         content is tall enough -->         <ImageView             android:layout_height="wrap_content"             android:src="@drawable/footer_image">         </ImageView>     </LinearLayout> </ScrollView> 
like image 37
Joel Malone Avatar answered Oct 08 '22 23:10

Joel Malone