Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android RelativeLayout height not following GridView height

Tags:

android

I am having problem with a GridView within a RelativeLayout, which is again within a ScrollView. The problem is that the height of the RelativeLayout is not following the height of the contents of the GridView. When there are more than one rows, the GridView is clipped and a scrollbar appears, which is undesirable. I have tried to illustrate my problem using an screenshot from the Android hierarchy viewer. You can see how the red RelativeLayout box has clipped the second row of the GridView. I am pasting the XML layout of the page (page.xml) and the individual grid item (griditem.xml). I have used the following code to inflate the grid items in the gridAdapter code:

/***********Start of gridAdapter snippet**********************/

public View getView(int position, View convertView, ViewGroup parent)
{

     View v;
        if(convertView==null){
            li = LayoutInflater.from(mContext);
            v = li.inflate(R.layout.griditem, null);

            //code for fetching textView and imageUrl content   

            TextView tv = (TextView)v.findViewById(R.id.icon_text);
            tv.setText(textContent);
            ImageView iv = (ImageView)v.findViewById(R.id.icon_image);

            //code for fetching and attaching image to imageView
        }
        else
        {
            v = convertView;
        }
        return v;
}

/***********End of gridAdapter snippet**********************/

/***********Start page.xml**********************/

<TextView android:id="@+id/title" android:layout_weight="1"

        android:layout_width="320dip"
        android:layout_height="wrap_content" 
        android:singleLine="false"
        android:textStyle="bold" 
        android:textSize="14dip" 
        />

<ImageView android:id="@+id/image"
        android:layout_below="@+id/title"
        android:adjustViewBounds="true"
        android:layout_width="128dip"
        android:layout_height="96dip" 
        android:layout_marginRight="4dip"
        />


<TextView android:id="@+id/name" 
        android:layout_weight="1"
        android:layout_below="@+id/title"
        android:layout_toRightOf="@+id/image"
        android:layout_width="192dip"
        android:layout_height="wrap_content"
        android:paddingTop="2dip"
        android:textSize="12dip" 
        android:paddingLeft="2dip"
        />

<TextView android:id="@+id/location" 
        android:layout_weight="1"
        android:layout_below="@+id/name"
        android:layout_toRightOf="@+id/image"
        android:layout_width="192dip"
        android:layout_height="wrap_content"
        android:paddingTop="2dip"
        android:textSize="12dip" 
        android:paddingLeft="2dip"
        />

<TextView android:id="@+id/date1" 
        android:layout_weight="1"
        android:layout_below="@+id/location"
        android:layout_toRightOf="@+id/image"
        android:layout_width="192dip"
        android:layout_height="wrap_content"
        android:paddingTop="2dip"
        android:textSize="10dip" 
        android:paddingLeft="2dip"
        />          

<TextView android:id="@+id/date2" 
        android:layout_weight="1"
        android:layout_below="@+id/date1"
        android:layout_toRightOf="@+id/image"
        android:layout_width="192dip"
        android:layout_height="wrap_content"
        android:paddingTop="2dip"
        android:textSize="10dip" 
        android:paddingLeft="2dip"
        />


<Button android:id="@+id/button1"
        android:text="buttonText1"
        android:layout_weight="1"
        android:layout_below="@+id/image"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_marginLeft="96dip"       
        />

<Button android:id="@+id/button2"
        android:text="buttonText2"
        android:layout_weight="1"
        android:layout_below="@+id/image"
        android:layout_toRightOf="@+id/button1"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        />

<Button android:id="@+id/button3"
        android:text="Text"
        android:layout_weight="1"
        android:layout_below="@+id/image"
        android:layout_toRightOf="@+id/button2"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        />

<GridView xmlns:android="http://schemas.android.com/apk/res/android" 
        android:id="@+id/gridview"
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent"
        android:layout_below="@+id/button1"
        android:layout_weight="1"

        android:numColumns="auto_fit"
        android:verticalSpacing="10dip"
        android:horizontalSpacing="10dip"
        android:stretchMode="columnWidth"
        android:gravity="center"
        />

/***********End page.xml**********************/

/***********Start griditem.xml**********************/

android:gravity="center_horizontal">

/***********End griditem.xml**********************/

Can you tell me what I should do to have the height of the RelativeLayout follow the full length of the gridView?

Thanks, Kuntal![alt text][1]

Here is the screenshot: http://tinypic.com/r/98rs4n/4

like image 847
Kuntal Avatar asked Aug 28 '10 02:08

Kuntal


1 Answers

So far, the only way I've been able to work around this is a bit of a fudge.

Once you know how many items you will be loading into your grid you set the height manually:

final int gridWidth = myGrid.getWidth();
final int cellWidthDP = 50;
final int cellHeightDP = 80;

final Resources r = getResources();
final double cellWidthPx = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, cellWidthDP, r.getDisplayMetrics());
final double cellHeightPx = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, cellHeightDP, r.getDisplayMetrics());

final int itemsPerRow = (int) Math.floor((double) gridWidth / cellWidthPx);
final int rowCount = (int) Math.ceil((double) itemCount / itemsPerRow);

final LayoutParams prm = myGrid.getLayoutParams();
prm.height = (int) Math.ceil((double) rowCount * cellHeightPx);

myGrid.setLayoutParams(prm);
like image 71
Chris Simpson Avatar answered Nov 20 '22 01:11

Chris Simpson