CODEWITHSUNDEEP
javaandroidxmlandroid-layoutandroid-fragments
Simon Sessingø
Simon Sessingø

Reputation: 335

Android: Box that fills entire screen with content below

I've been trying to figure out how to place a container that fills the entire screen vertically inside a ScrollView that has content below.

Something like this:

This is the content I would like below the box: http://myupload.dk/handleupload/ce34836ostt

I've tried everything - it seems like i can't position stuff absolute to the container that fills the entire screen. I can make a box that fills the entire screen, but everything i adds below it squeezes the box together.

It works when I add a size to the box, like this:

<com.github.ksoichiro.android.observablescrollview.ObservableScrollView

    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal|top"
    android:minWidth="25px"
    android:minHeight="0px"
    android:paddingTop="0dp"
    android:fillViewport="true"
    android:id="@+id/scroll">

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

        <!-- THIS BOX I WOULD LIKE TO FIT THE ENTIRE SCREEN -->

        <android.support.v4.view.ViewPager
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:id="@+id/cardsPager" />

        <!-- THIS CONTENT SHOULD BE BELOW THE BOX ABOVE -->

        <fragment android:name="bonnier.hvadsynes.fragments.DetailsFragment"
                  android:id="@+id/details_fragment"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"/>


    </LinearLayout>
</com.github.ksoichiro.android.observablescrollview.ObservableScrollView>

Really appreciate your help!

Upvotes: 1

Views: 102

Answers (2)

Juanchi
Juanchi

Reputation: 116

You can do it this way:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

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

    <LinearLayout
        android:id="@+id/layout1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#A5CB3A"
        android:orientation="vertical" >


    </LinearLayout>

    <LinearLayout
        android:id="@+id/layout2"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:orientation="vertical" >

        <!-- here goes your textview -->

    </LinearLayout>
</LinearLayout>

And in the onCreate method of the Activity

  Point size = new Point();
  getWindowManager().getDefaultDisplay().getSize(size);
  int screenHeight = size.y;

  LinearLayout layout = (LinearLayout)findViewById(R.id.layout1);

  ViewGroup.LayoutParams params = layout.getLayoutParams();
  params.height = screenHeight; //here you can substract the height of the top bar, if your app has one

  layout.setLayoutParams(params);

You are just setting the height of the screen to the inner layout.

Upvotes: 2

Silicide
Silicide

Reputation: 311

My idea is to set the height of the screen-filling-box programmatically.

When and Where: depends on what you use e.g.in onResume there surely are better places but for now it works. How: add an OnGlobalLayoutListener to your viewtreeobserver and then copy your scrollviews height to 'the box'.

<!--Whatever the whole things height should be, e.g. match_parent or 100dp or or or-->
<ScrollView
     android:background="#0f0"
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:id="@+id/scrollview">

     <LinearLayout
         android:orientation="vertical"
         android:layout_width="match_parent"
         android:layout_height="wrap_content">

         <!-- THIS BOX I WOULD LIKE TO FIT THE ENTIRE SCREEN -->
         <!-- Any height works as we overwrite it anyway-->
         <View
             android:id="@+id/makebig"
             android:background="#f00"
             android:layout_width="match_parent"
             android:layout_height="300dp" />

         <!-- THIS CONTENT SHOULD BE BELOW THE BOX ABOVE -->
         <View
             android:background="#0ff"
             android:id="@+id/details_fragment"
             android:layout_width="match_parent"
             android:layout_height="100dp"/>

     </LinearLayout>
 </ScrollView>

In your Activity or wherever: e.g. in onResume()

final View makebig = findViewById(R.id.makebig);
final View scrollview = findViewById(R.id.scrollview);

final ViewTreeObserver viewTreeObserver = scrollview.getViewTreeObserver();
viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {
        //only do this all once
        scrollview.getViewTreeObserver().removeOnGlobalLayoutListener(this);

        makebig.getLayoutParams().height = scrollview.getHeight();
    }
});

Upvotes: 2

Related Questions