c# - ScrollView's Child Not Resizing Properly With Window Resize WinRT -

scenario:
working on store app in winrt/win8.

i have scrollview, custom usercontrol child inside - part of 1 "main" usercontrol.

when main usercontrol (with scrollview -> child usercontrol) in initialized/navigated - app width not full-screen; usercontrol @ full width of scrollview - desired. images below:

• image 1 - main user control opens window fullscreen
• image 2 - main user control opens starts half-width (or width)

the scrollview within grid , keeps full width of app window, when it's resized - desired.

issue:
issue i'm having when resize app window horizontally, child usercontrol not keep same width parent scrollview's.

this causes scrollview have horizontal scrollbars - not want.

• image 3 - window horizontal width resized

i want keep width of child bound inside width of scrollview no horizontal scrollbars (as in image 2).

markup similar (i have stripped down readability):

<grid>     <!-- row/column definitions in here -->     ...     <!-- header textblock -->     ...     <scrollviewer x:name="scrltablerows" grid.columnspan="3" grid.row="1"                    horizontalscrollbarvisibility="auto" verticalscrollbarvisibility="auto"                   padding="66,0,66,40" zoommode="disabled">         <local:mycustomusercontrol margin="0,10,0,10" horizontalalignment="stretch" />     </scrollviewer>     ...     <!-- button here--> </grid> 

i have tried setting (on child custom usercontrol):

• width="{binding path=actualwidth, elementname=scrltablerows}" child is not set @ full width of scrollview start (which need), , doesn't resize width parent either - giving me scrollbars

• width="{binding path=width, elementname=scrltablerows}" child does start @ full width of parent, doesn't resize - giving me scrollbars

• i have tried placing usercontrol inside grid (within scrollview), amongst many other horizontalaligment , width properties.

all no avail.

no other similar situations/answers have worked other helpful fellows @ stackoverflow.

obviously, need vertical scrollbars - kind of evident; before asks.

can give me pointers, please?

update:

here custom usercontrol's xaml, requested @lovetocode:

<usercontrol *usual user control declaritive stuff in here*>     <usercontrol.resources>         <collectionviewsource x:key="fieldviewmodelssource" source="{binding itemtoedit.fieldviewmodels}"/>          <datatemplateselectors:fieldviewmodeldatatemplateselector              x:key="fieldviewmodeldatatemplateselector"             audiofieldtemplate="{staticresource tablerowaudiofielddatatemplate}"             checkboxfieldtemplate="{staticresource tablerowcheckboxfielddatatemplate}"             datasetfieldtemplate="{staticresource tablerowdatasetfielddatatemplate}"             datefieldtemplate="{staticresource tablerowdatefielddatatemplate}"             datetimefieldtemplate="{staticresource tablerowdatetimefielddatatemplate}"             dropdownfieldtemplate="{staticresource tablerowdropdownfielddatatemplate}"             filefieldtemplate="{staticresource tablerowfilefielddatatemplate}"             gpsfieldtemplate="{staticresource tablerowgpsfielddatatemplate}"             gridfieldtemplate="{staticresource tablerowgridfielddatatemplate}"             imagefieldtemplate="{staticresource tablerowimagefielddatatemplate}"             labelfieldtemplate="{staticresource tablerowlabelfielddatatemplate}"             multichoicecheckboxfieldtemplate="{staticresource tablerowmultichoicecheckboxfielddatatemplate}"             radiofieldtemplate="{staticresource tablerowradiofielddatatemplate}"             rangesliderfieldtemplate="{staticresource tablerowrangesliderfielddatatemplate}"             signaturefieldtemplate="{staticresource tablerowsignaturefielddatatemplate}"             splitterfieldtemplate="{staticresource tablerowsplitterfielddatatemplate}"             textfieldtemplate="{staticresource tablerowtextfielddatatemplate}"             textareafieldtemplate="{staticresource tablerowtextareafielddatatemplate}"             timefieldtemplate="{staticresource tablerowtimefielddatatemplate}"             videofieldtemplate="{staticresource tablerowvideofielddatatemplate}"/>     </usercontrol.resources>      <grid>         <itemscontrol itemssource="{binding source={staticresource fieldviewmodelssource}}"                       itemtemplateselector="{staticresource fieldviewmodeldatatemplateselector}">             <itemscontrol.itemspanel>                 <itemspaneltemplate>                     <stackpanel margin="10,0,10,0" orientation="vertical" />                 </itemspaneltemplate>             </itemscontrol.itemspanel>         </itemscontrol>     </grid> </usercontrol> 

note datatemplate resources in usercontrol resources custom usercontrols loaded in based on objects in viewmodel (like in my original image 1).

so, great @lovetocode, managed remedy issue. still trying on 2-day headache , bruises banging head against desk, though.

i ditched scrollviewer , used custom usercontrol:

<local:tablerowusercontrol grid.row="1" grid.columnspan="2"                            margin="66,0,66,40" horizontalcontentalignment="stretch" /> 

then, @lovetocode suggested - used listview instead of itemscontrol. sincere apologies. didn't want use 1 first time round because...

main issue listview's default style have hover , tap effects; didn't need. tried steer clear of disabling hover/tap previous experience of failing - miserably.

after bit of googling (other search engines available), found simple solution quite easily.

i managed this:

<listview x:name="lstfieldviewmodels" itemssource="{binding source={staticresource fieldviewmodelssource}}" selectionmode="none"                       itemtemplateselector="{staticresource fieldviewmodeldatatemplateselector}" isswipeenabled="false">     <listview.itemcontainerstyle>         <style targettype="listviewitem">             <setter property="horizontalcontentalignment" value="stretch" />             <setter property="background" value="transparent" />             <setter property="template">                 <setter.value>                     <controltemplate targettype="listviewitem">                         <contentpresenter />                     </controltemplate>                 </setter.value>             </setter>         </style>     </listview.itemcontainerstyle>     <listview.itemspanel>         <itemspaneltemplate>             <stackpanel margin="10,0,10,0" orientation="vertical" />         </itemspaneltemplate>     </listview.itemspanel> </listview> 

again, props @lovetocode. gold star , programmer points :)