Nested group controls (1 Viewer)

[uxDesign]

Hi, want to use nested group controls for skin design. Is it possible to set the x/y pos of the outer group only and put some other groups like TableLayout inside. I tried something like

<control>
      <description>outer group</description>
      <type>group</type>
      <posX>470</posX>
      <posY>115</posY>
      <layout>GridLayout(1,3,20,20)</layout>
   
        <!-- Devices -->
        <control>
            <description>Devices table</description>
            <type>group</type>            
            <layout>TableLayout(1200, 2, 20, 15)</layout>
   
            <!-- Devices header -->
            <control>
                <description>Devices header</description>
                <type>group</type>   
                       
                <layoutDetail>TableCell(2, 1, 1)</layoutDetail> <!-- Column span 2 in 1,1 -->
                <layout>GridLayout(2, 1, 20, 5)</layout> <!-- 2 columns, 1 row -->
           
                <control>
                    <description>Devices Image</description>
                    <type>image</type>
                    <id>1</id>               
                    <width>64</width>
                    <height>64</height>
                    <texture>htpcinfo_device.png</texture>
                    <visible>string.equals(#HTPCInfo.SectionView,Details)</visible>
                </control>
                <control>
                    <description>Devices</description>
                    <type>label</type>
                    <id>1</id>               
                    <label>Devices</label>
                    <font>font12</font>
                    <visible>string.equals(#HTPCInfo.SectionView,Details)</visible>                       
                </control>
            </control>
           
            <!-- *** Graphic Devices *** -->
            <control>
                <description>Graphic Device Name</description>
                <type>label</type>
                <id>1</id>                   
                <label>#HTPCInfo.TranslationDisplayDevice</label>
                <font>TitanLight11</font>
                <textcolor>ff808080</textcolor>
                <visible>string.equals(#HTPCInfo.SectionView,Details)</visible>               
            </control>
            <control>
                <description>Graphic Device Value</description>
                <type>label</type>
                <id>1</id>                   
                <font>TitanLight11</font>
                <label>#(string.trim(#HTPCInfo.DisplayDevice2Description)) (#HTPCInfo.TranslationDriverVersion #HTPCInfo.DisplayDevice2DriverVersion), #HTPCInfo.DisplayDevice1Resolution, #HTPCInfo.DisplayDevice1CurrentRefreshRate, #HTPCInfo.DisplayDeviceCurrentFrameCount</label>
                <visible>string.equals(#HTPCInfo.SectionView,Details)</visible>
            </control>
    </control>
</control>

but that doesn't work. The text and images appear in the left top corner. Any help is appreciated.

Regards, uxDesign