title: Does Spark Grid replace MX Grid?
body: <p>I wanted to use the Spark Grid but at the same time I realized there are no Spark equivalents for certain components like the <code>&lt;GridItem&gt;</code>.<br>
  So, I mixed both Spark and Halo components in the program but when I ran it, I got the error:      </p>
  
  <blockquote>
    <p>"TypeError: Error #1034: Type Coercion failed: cannot convert spark.components::Grid@239b40a1  to mx.containers.Grid."</p>
  </blockquote>
  
  <p>The program:</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
             xmlns:s="library://ns.adobe.com/flex/spark" 
             xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"&gt;
  
  &lt;s:Grid&gt;  
      &lt;mx:GridRow id="row1"&gt; 
          &lt;mx:GridItem&gt;        
              &lt;s:Label text="Description:"  paddingTop="5"/&gt; 
          &lt;/mx:GridItem&gt;     
          &lt;mx:GridItem&gt;      
              &lt;s:TextArea id="descTI" width="300" height="50"/&gt; 
          &lt;/mx:GridItem&gt; 
      &lt;/mx:GridRow&gt;    
      &lt;mx:GridRow id="row2"&gt;  
          &lt;mx:GridItem&gt;        
              &lt;s:Label text="Name:" paddingTop="5"/&gt;   
          &lt;/mx:GridItem&gt;        
          &lt;mx:GridItem&gt;     
              &lt;s:TextInput id="nameTI" width="300"/&gt;  
          &lt;/mx:GridItem&gt;   
      &lt;/mx:GridRow&gt;   
      &lt;mx:GridRow id="row3"&gt;  
          &lt;mx:GridItem&gt;        
              &lt;s:Label text="Target:" paddingTop="5"/&gt; 
          &lt;/mx:GridItem&gt;      
          &lt;mx:GridItem&gt; 
              &lt;s:TextInput id="targetTI" width="300"/&gt;     
          &lt;/mx:GridItem&gt;   
  
      &lt;/mx:GridRow&gt;  
      &lt;mx:GridRow id="row5"&gt;   
          &lt;mx:GridItem&gt;  
              &lt;s:Label text="Operand:" paddingTop="5" /&gt;  
          &lt;/mx:GridItem&gt;   
          &lt;mx:GridItem&gt; 
              &lt;mx:DataGrid id="attrDG"&gt;    
                  &lt;mx:columns&gt;          
                      &lt;mx:DataGridColumn dataField="variable" width="150"/&gt;           
                      &lt;mx:DataGridColumn dataField="level"           
                                         width="150"/&gt;       
                  &lt;/mx:columns&gt;       
              &lt;/mx:DataGrid&gt;    
          &lt;/mx:GridItem&gt; 
  
          &lt;mx:GridItem paddingLeft="3" colSpan="2"&gt; 
              &lt;mx:DataGrid id="attrDG0"&gt;    
                  &lt;mx:columns&gt;          
                      &lt;mx:DataGridColumn dataField="variable" width="150"/&gt;           
                      &lt;mx:DataGridColumn dataField="level"           
                                         width="150"/&gt;       
                  &lt;/mx:columns&gt;       
              &lt;/mx:DataGrid&gt;    
          &lt;/mx:GridItem&gt;  
      &lt;/mx:GridRow&gt; 
  &lt;/s:Grid&gt;
  &lt;/s:Application&gt;
  </code></pre>