c# - Dynamically adjust ListView height on adding / removing items? -

i have 3 level nested listview binded same 3 level nested collection. mainitems added @ 3rd level.

unmodified, there scrollbars on all levels. on item added, edit containing grid of listviewitem adjust height dynamically.

i have succeeded on removing 3rd level scroll bar. however, want remove 2nd level also, can't seem do.

when try adjust height of 1st level listviewitem, scrollbars on 1st level disappears height not adjusted @ all.

what want only have scrollbar on 1st level , scroll there.

basically, this:

this current code:

<grid x:name="parentgrid"> <listview x:name="level1listview"  itemssource="{binding path=level1}">     <listview.itemtemplate>         <datatemplate>             <grid x:name="gridlevel1">                 <grid.columndefinitions>                     <columndefinition width="auto" />                     <columndefinition width="*" />                 </grid.columndefinitions>                 <toolkit_controls:layouttransformcontrol grid.column="0">                     <toolkit_controls:layouttransformcontrol.transform>                         <rotatetransform x:name="rotatetransform" angle="270"/>                     </toolkit_controls:layouttransformcontrol.transform>                     <textblock text="{binding path=level1namestring}" fontsize="32" horizontalalignment="center" />                 </toolkit_controls:layouttransformcontrol>                 <listview x:name="level2listview"                         itemssource="{binding path=level2}"                       grid.column="1"                       >                     <listview.itemtemplate>                         <datatemplate>                             <grid x:name="gridlevel2">                                 <grid.rowdefinitions>                                     <rowdefinition height="auto" />                                     <rowdefinition height="*" />                                 </grid.rowdefinitions>                                 <border borderbrush="white" borderthickness="1" grid.row="0"/>                                 <textblock text='{binding path=level2name}' foreground="black" fontsize="18"                                        grid.row="0"/>                                  <grid x:name="gridlevel3" width="300" height="100" grid.row="1">                                     <listview x:name="listview_level3" isswipeenabled="false"                                     manipulationmode="none"                                           itemssource="{binding path=level3displaycollection}"                                                           grid.column="1">                                         <listview.itemcontainertransitions>                                             <transitioncollection>                                                 <entrancethemetransition isstaggeringenabled="false" />                                             </transitioncollection>                                         </listview.itemcontainertransitions>                                     </listview>                                 </grid>                             </grid>                         </datatemplate>                     </listview.itemtemplate>                 </listview>             </grid>         </datatemplate>     </listview.itemtemplate>     <listview.itemspanel>         <itemspaneltemplate>             <wrapgrid orientation="horizontal" maximumrowsorcolumns="1" ></wrapgrid>         </itemspaneltemplate>     </listview.itemspanel> </listview> 

and important code changes height on item added:

var gridlevel1 = typedassociatedobject.getancestors().where(a =>      a.named("gridlevel1")).firstordefault() grid; //gridlevel1.height = gridlevel1.actualheight + 50;  var gridlevel2 = typedassociatedobject.getancestors().where(a => a.named("gridlevel2")).firstordefault() grid; gridlevel2.height = gridlevel2.actualheight + 50;  var gridlevel3 = typedassociatedobject.getancestors().where(a => a.named("gridlevel3")).firstordefault() grid; gridlevel3.height = gridlevel3.actualheight + 50; 

level 1 commented out because when add it, although 2nd scroll bar removed listviewitem height doesn't change, resulting in ui being wrong , not showing everything. notice 1st level scrollbar remains same size:

what want extend height of header 1 still shows , 1st level scrollbar on right 1 extends / grows.

can point out doing wrong?

thank you!

edit: windows store app.

set itemspanel stackpanel in inner list views. way not need adjust height of each item. hide scrollbars use scrollviewer.verticalscrollbarvisibility="hidden" on inner list views.

have considered using grouping?