How do I make a FrameLayout fill the height of its parent so the whole page scrolls together?

Question

I have a FrameLayout that loads Fragments by tapping on tabs in a TabWidget. I can't figure out how to make the height of the FrameLayout as tall as its content, so that the whole containing ScrollView will scroll together as one instead of a separate scrolling view.

Here's a visual example of this Fragment's structure:

As you can see, the Frame Layout Visible Height only reveals one row of the Fragment, when in fact, there are a few. I can scroll within the FrameLayout to see the other rows as it is now, but that's not what I'm going for. The FrameLayout is made up of a LinearLayout containing a GridView with their layout_heights set to wrap_content.

I tried hardcoding the height of the FrameLayout to something like 500dp and it works great except for the fact that it's no longer dynamically sized. Would I need to resize the FrameLayout programmatically each time a new image is loaded into the inner content? Is there a layout attribute I can set so it'll stretch its height to match its inner content?

Here's my layout xml file:

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

    android:layout_width="fill_parent"
    android:layout_height="wrap_content">
    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="200dp">
        <!-- CONTAINS USER INFO AND STATS -->
    </RelativeLayout>
    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#ffffff">
            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="fill_parent"
                android:layout_height="60dp"
                android:weightSum="2">
            </TabWidget>
            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                >
            </FrameLayout>
        </LinearLayout>
    </android.support.v4.app.FragmentTabHost>
</LinearLayout>
</ScrollView>

Thank you!

---

Since I'm going to set a bounty on this, I thought I'd share what I've figured out so far.

In the thumbnails, onSuccess when each image is loaded, I'm calling a function in the GridLayout that holds the images that counts the images and sets the height of the GridLayout. This works fine, although it seems like it'd be a bit inefficient.

What I'm doing is setting the GridLayout height and then calling requestLayout and invalidate on it and it's parent(s). This works, but not as the images loading. It'll work if I go to a different tab and return to the thumbnails, oddly enough. Which makes me think I'm not updating at the right time or on the right object.

Anyway, that said. Does anyone know how to make the height of a GridLayout expand to hold its contents (instead of scrolling) so I can scroll the entire page (including the top section)?

---

I should also add the GridView layout:

<GridView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/grid"
android:stretchMode="columnWidth"
android:gravity="center"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:drawSelectorOnTop="false"
android:fastScrollAlwaysVisible="false"
android:fastScrollEnabled="false"
android:numColumns="3"
android:choiceMode="none">
</GridView>

Answer 1

I was in a similar situation but I had a ListView instead of a GridView. You are right in the part when you have to set the height dynamically each time you add an item or if you call notifyDataSetChanged().

THIS CODE IS FOR LISTVIEW WITH DIFFERENT HEIGHT FOR EACH ROW

private void setListViewHeightBasedOnChildren(MyQueueAdapter listAdapter) {

    int desiredWidth = MeasureSpec.makeMeasureSpec(
            mListView.getWidth(), MeasureSpec.AT_MOST);
    int totalHeight = 0;

    View view = null;
    int i;
    for (i = 0; i < listAdapter.getCount(); i++) {
        view = listAdapter.getView(i, view, mListView);

        view.measure(desiredWidth, MeasureSpec.UNSPECIFIED);

        totalHeight += view.getMeasuredHeight();
    }

    ViewGroup.LayoutParams params = mListView.getLayoutParams();
    params.height = heightList
            + (mListView.getDividerHeight() * (listAdapter
                    .getCount() + 3));

    heightListComplete = params.height;
    mListView.setLayoutParams(params);

}

You need to modify this code according to your needs, you don't need the loop as the height of each row is static in your case. If you need more help let me know.

ALTERNATIVE

If you know the height of the view in dp you can easily convert the dp in px and set the height of your gridview according to number of rows.

Answer 2

When using dynamic sizes you'll run into problems once you put match_parent inside a wrap_content thing. One tries to get a small as it's content and the content tries to be as big as it's parent. Neither side will know how to scale properly in the end.

ScrollView is such a thing that falls in this category. It's a scalable window to it's content so it can't be wrap_content and the content can't be match_parent because it's parent is a virtual infinite space.

• Change <ScrollView android:layout_height="wrap_content" to match_parent (or a fixed size).

To solve the size of the content

• set the root layout (LinearLayout in your case) of your ScrollView to be a fixed size so it's content can be match_parent again.
• use wrap_content all the way.
• combine the two: wrap_content until a child defines an absolute size, then match_parent inside there.

The wrap_content route will only work if all the elements in the layout from inner to outer most expand properly based on their content. Nothing can rely on parent bounds unless you add some.

Your content looks rather dynamic in size. So it is likely that you need to use some code to manually set sizes based on content. E.g. if those images inside your tab frame are a GridView (essentially ScrollView with grid content again) you'll need to set it's size manually. More than 1 degree of freedom in wrapping dynamically sizing containers isn't solvable automatically.

Answer 3

Parent of your frame layout is linear layout whose height is wrap_content. also, your framelayout's height is wrap_content. change both of them to fill_parent. using match_parent is more preferred now a days insted of fill_parent