Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Trying to get Android LinearLayout to stretch horizontally and vertically

UPDATE: I appreciate the advice to use GridView, and I do believe that would provide better performance. However, my initial efforts at implementing a simple GridView have resulted in shameful failure. I suppose figuring out what I am doing wrong is for another topic. To fix this implementation, I used OnWindowFocusChanged to find ANDROID_CONTENT height, then divided by the number of rows to set row height. The major lesson here that is not present in many of the discussions on this issue is OnCreate is the WRONG place to set dimensions. OnWindowFocusChanged occurs later when accurate measurements can be made. This information is not mentioned often in the many, many discussions on this topic.

ORIGINAL: I am working on an Android layout trying to set up a board with three columns and four rows.

I want to stretch the board to fill the available screen both vertically and horizontally. I tried nesting LinearLayout by row and column with the weight="1" option, but could only get it to stretch horizontally.

In the following configuration, the rows stretch to fill the width of the screen, but the columns are set at "60dp". I have tried GridLayout and TableLayout also, but haven't been able to get the desired result.

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/background"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingLeft = "10dp"
        android:paddingRight = "10dp"
        android:background="@drawable/bg" >
        <LinearLayout
            android:id="@+id/player1"
            android:layout_width="match_parent"
            android:layout_height="@dimen/positionHeight"
            android:layout_alignParentBottom="true"
            android:orientation="horizontal"
            android:background="@drawable/square" />
        <LinearLayout
            android:id="@+id/player2"
            android:layout_width="match_parent"
            android:layout_height="@dimen/positionHeight"
            android:layout_alignParentTop="true"
            android:orientation="horizontal"
            android:background="@drawable/square" />    
        <LinearLayout 
          android:id="@+id/row0"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"  
          android:layout_below="@id/player2"
          android:layout_alignParentLeft="true" 
          android:baselineAligned="false"
          android:orientation="horizontal">
          <LinearLayout
            android:id="@+id/position0"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
          <LinearLayout
            android:id="@+id/position1"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" /> 
          <LinearLayout
            android:id="@+id/position2"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
        </LinearLayout>  
        <LinearLayout 
          android:id="@+id/row1"
          android:layout_width="match_parent"
          android:layout_height="wrap_content" 
          android:layout_below="@id/row0"
          android:layout_alignParentLeft="true"
          android:baselineAligned="false"
          android:orientation="horizontal">    
          <LinearLayout
            android:id="@+id/position3"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" /> 
          <LinearLayout
            android:id="@+id/position4"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
          <LinearLayout
            android:id="@+id/position5"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
        </LinearLayout>      
        <LinearLayout 
          android:id="@+id/row2"
          android:layout_width="match_parent"
          android:layout_height="wrap_content" 
          android:layout_below="@id/row1"
          android:layout_alignParentLeft="true" 
          android:baselineAligned="false"
          android:orientation="horizontal"> 
          <LinearLayout
            android:id="@+id/position6"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
          <LinearLayout
            android:id="@+id/position7"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
          <LinearLayout
            android:id="@+id/position8"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
        </LinearLayout>      
        <LinearLayout 
          android:id="@+id/row3"
          android:layout_width="match_parent"
          android:layout_height="wrap_content" 
          android:layout_below="@id/row2"
          android:layout_alignParentLeft="true" 
          android:baselineAligned="false"
          android:orientation="horizontal">   
          <LinearLayout
            android:id="@+id/position9"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />    
          <LinearLayout
            android:id="@+id/position10"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
          <LinearLayout
            android:id="@+id/position11"
           android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="@dimen/positionHeight"
            android:orientation="horizontal"
            android:background="@drawable/square" />
        </LinearLayout>

please give me suggestion.

like image 308
smirciat Avatar asked Dec 20 '22 03:12

smirciat


1 Answers

I disagree with others saying you must use a GridLayout. Try this approach with a LinearLayout. I used a generic View for each cell of the grid, but any control will work.

<?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:orientation="horizontal" >

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@color/red" />

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

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@color/red" />
    </LinearLayout>

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

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

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@color/red" />

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

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

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@color/red" />

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

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@color/red" />
    </LinearLayout>

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

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

        <View
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@color/red" />

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

</LinearLayout>

enter image description here

This approach also requires no manual manipulation of the layout in code, everything is handled in the xml using weights.

like image 199
invertigo Avatar answered Apr 12 '23 23:04

invertigo