title: GridLayout and Row/Column Span Woe
body: <p>The <a href="http://android-developers.blogspot.com/2011/11/new-layout-widgets-space-and-gridlayout.html">Android Developers Blog post introducing <code>GridLayout</code></a> shows this diagram of how spans impact automatic index allocation:</p>
  
  <p><img src="https://i.stack.imgur.com/d4dhD.png" alt="automatic index allocation"></p>
  
  <p>I am attempting to actually implement that using a <code>GridLayout</code>. Here is what I have so far:</p>
  
  <pre><code>&lt;android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res/com.commonsware.android.gridlayout"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      app:orientation="horizontal"
      app:columnCount="8"&gt;
  
      &lt;Button
          app:layout_columnSpan="2"
          app:layout_rowSpan="2"
          android:layout_gravity="fill_horizontal"
          android:text="@string/string_1"/&gt;
  
    &lt;Button
      app:layout_columnSpan="2"
      android:layout_gravity="fill_horizontal"
      android:text="@string/string_2"/&gt;
  
    &lt;Button
      app:layout_rowSpan="4"
      android:text="@string/string_3"/&gt;
  
    &lt;Button
      app:layout_columnSpan="3"
      app:layout_rowSpan="2"
      android:layout_gravity="fill_horizontal"
      android:text="@string/string_4"/&gt;
  
    &lt;Button
      app:layout_columnSpan="3"
      android:layout_gravity="fill_horizontal"
      android:text="@string/string_5"/&gt;
  
    &lt;Button
      app:layout_columnSpan="2"
      android:layout_gravity="fill_horizontal"
      android:text="@string/string_6"/&gt;
  
    &lt;android.support.v7.widget.Space
      app:layout_column="0"
      android:layout_width="36dp"
      /&gt;
  
    &lt;android.support.v7.widget.Space
      android:layout_width="36dp"
      /&gt;
  
    &lt;android.support.v7.widget.Space
      android:layout_width="36dp"
      /&gt;
  
    &lt;android.support.v7.widget.Space
      android:layout_width="36dp"
      /&gt;
  
    &lt;android.support.v7.widget.Space
      android:layout_width="36dp"
      /&gt;
  
    &lt;android.support.v7.widget.Space
      android:layout_width="36dp"
      /&gt;
  
    &lt;android.support.v7.widget.Space
      android:layout_width="36dp"
      /&gt;
  
    &lt;android.support.v7.widget.Space
      android:layout_width="36dp"
      /&gt;
  
  &lt;/android.support.v7.widget.GridLayout&gt;
  </code></pre>
  
  <p>I had to introduce the <code>&lt;Space&gt;</code> elements to ensure each column had a minimum width, otherwise, I would have a bunch of zero-width columns.</p>
  
  <p>However, even with them, I get this:</p>
  
  <p><img src="https://i.stack.imgur.com/HMMAO.png" alt="sample GridLayout"></p>
  
  <p>Notably:</p>
  
  <ul>
  <li><p>Despite <code>android:layout_gravity="fill_horizontal"</code>, my widgets with column spans do not fill the spanned columns</p></li>
  <li><p>Despite the <code>android:layout_rowSpan</code> values, nothing spans rows</p></li>
  </ul>
  
  <p>Can anyone reproduce the diagram from the blog post using a <code>GridLayout</code>?</p>
  
  <p>Thanks!</p>