Android - make GridView smaller to fit vertically without scrolling

Question

I have a Gridview which is on about the half of the screen. It is filled with ImageViews which are quadratic. The problem is that the GridView fills the complete width and so makes it scroll vertically.

I want to reduce the width of the GridView so much that it fits vertically without scrolling. I neither want the images to get deformed nor to change the column size.

I already tried different android:stretchMode's but with others than columnWidthit didn't showed the gridView at all.

Simply adding padding or margin is not what I want because it should fit on all screen sizes.

Here is my layout file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <GridView
            android:id="@+id/gridViewPlayer2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"        
            android:numColumns="3"
            android:gravity="center"
            android:layout_gravity="center"
            android:stretchMode="columnWidth"
            android:horizontalSpacing="3dp"
            android:verticalSpacing="3dp" >

        </GridView>

    </LinearLayout>



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

        <Chronometer
            android:id="@+id/timer_p2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:textSize="20sp"
            android:text="Chronometer"
            android:gravity="right"
            android:rotation="180" />

         <Chronometer
            android:id="@+id/timer_p1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:textSize="20sp"
            android:gravity="right" />

     </LinearLayout>



    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <GridView
            android:id="@+id/gridViewPlayer1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"        
            android:numColumns="3"
            android:gravity="center"
            android:layout_gravity="center"
            android:stretchMode="columnWidth"
            android:horizontalSpacing="3dp"
            android:verticalSpacing="3dp" >

        </GridView>

    </LinearLayout>

</LinearLayout>

Thanks in advance.

Answer 1

Ok, I found a pretty good workaraound which does exactly what I want. It's pretty simple:

since my GridView is quadratic, I managed to get the height of the LinearLayout and set the width of the GridView with that value. (I did not directly set the width on the GridView but on another LinearLayout I added to solve some import problems).

So here is my xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center">

        <LinearLayout 
            android:id="@+id/layout_help_p2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center_horizontal"
            android:orientation="vertical">

            <GridView
                android:id="@+id/gridViewPlayer2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"        
                android:numColumns="3"
                android:gravity="center"
                android:layout_gravity="center"
                android:stretchMode="columnWidth"
                android:horizontalSpacing="3dp"
                android:verticalSpacing="3dp"
                android:rotation="180" >

            </GridView>

        </LinearLayout>
    </LinearLayout>



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

        <Chronometer
            android:id="@+id/timer_p2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:textSize="20sp"
            android:text="Chronometer"
            android:gravity="right"
            android:rotation="180" />

         <Chronometer
            android:id="@+id/timer_p1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:textSize="20sp"
            android:gravity="right" />

     </LinearLayout>



    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:id="@+id/layout_grid_p1">

        <LinearLayout 
            android:id="@+id/layout_help_p1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center_horizontal"
            android:orientation="vertical">

            <GridView
                android:id="@+id/gridViewPlayer1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"        
                android:numColumns="3"
                android:gravity="center"
                android:layout_gravity="center"
                android:stretchMode="columnWidth"
                android:horizontalSpacing="3dp"
                android:verticalSpacing="3dp" >

            </GridView>

         </LinearLayout>
    </LinearLayout>

</LinearLayout>

And here's how I managed the described process:

final LinearLayout mLayoutP1 = (LinearLayout) findViewById(R.id.layout_grid_p1);
final LinearLayout mLayoutHelpP1 = (LinearLayout) findViewById(R.id.layout_help_p1);
final LinearLayout mLayoutHelpP2 = (LinearLayout) findViewById(R.id.layout_help_p2);
		
mLayoutP1.post(new Runnable(){

    @Override
    public void run() {
      layoutHeightP1 = mLayoutP1.getHeight();
	  mLayoutHelpP1.setLayoutParams(new LinearLayout.LayoutParams(layoutHeightP1, LinearLayout.LayoutParams.MATCH_PARENT));
	  mLayoutHelpP2.setLayoutParams(new LinearLayout.LayoutParams(layoutHeightP1, LinearLayout.LayoutParams.MATCH_PARENT));
	}
			
});

So the result is: http://abload.de/img/4cu7w.jpg

This workaround only works because my GridViewis quadratic. If someone found a way to automatically reduce the width of a GridView/ListView that it fits vertically on the screen without scrolling, feel free to share it here!

Answer 2

I did not understand what exactly you are looking for. But you can set the width of the grid view and column width of the grid view dynamically.