animation - How to get desired height of WPF UI element with current height of 0? -

my ultimate goal animate change in size between 2 usercontrols. way have attempted achieve has produced 1 major problem.

i start datatemplate contains basic text , icon display, 'edit' usercontrol height set 0 , edit button. edit usercontrol in gridrow height="auto", starts out height of 0. button has doubleanimation triggered button click animates height of usercontrol 0 300. works fine. here simplified code example.

<datatemplate x:key="usertemplate" datatype="{x:type datatypes:user}"> ... <controls:userview grid.row="1" grid.columnspan="5" x:name="editrow"      datacontext="{binding}" height="0" /> <controls:usereditor grid.row="2" grid.columnspan="5" x:name="editrow"      datacontext="{binding}" height="0" /> <button grid.row="0" grid.column="4" name="edit" style="{staticresource buttonstyle}"      tooltip="edit user" click="button_click">     <image source="/solutionname;component/images/edit.png" stretch="none" />     <button.triggers>         <eventtrigger routedevent="button.click">             <beginstoryboard>                 <storyboard>                     <doubleanimation name="editrowheightanimation"      storyboard.targetname="editrow" storyboard.targetproperty="height" from="0"      to="300" duration="00:00:0.5" />                 </storyboard>             </beginstoryboard>         </eventtrigger>     </button.triggers> </button> ... </datatemplate> 

the problem edit usercontrol not 300 pixels high , won't know height @ design time. tried following, doesn't work.

<doubleanimation name="editrowheightanimation" storyboard.targetname="editrow"     storyboard.targetproperty="height" from="0" to="{binding desiredsize.height,      elementname=editrow}" duration="00:00:0.5" /> 

i have tried calling measure() , updatelayout() on edit usercontrol code behind. commented out button click trigger , xaml animation , added 1 code behind instead... kind of worked, got same (wrong) desiredsize. is, usercontrol height animated, wrong height. here button click handler code.

private void button_click(object sender, routedeventargs e) {     user currentuser = (user)collectionviewsource.getdefaultview(users).currentitem;     listboxitem listboxitem = (listboxitem)         (userslistbox.itemcontainergenerator.containerfromitem(currentuser));     datatemplate itemdatatemplate = findresource("usertemplate") datatemplate;     contentpresenter contentpresenter = listboxitem.getinternal<contentpresenter>();     if (itemdatatemplate != null && contentpresenter != null)     {         usereditor usereditor = (usereditor)itemdatatemplate.findname("editrow",              contentpresenter);         usereditor.measure(new size(double.positiveinfinity, double.positiveinfinity));         usereditor.updatelayout();         usereditor.beginanimation(heightproperty, new doubleanimation(0,              usereditor.desiredsize.height, new duration(new timespan(0, 0, 1)),              fillbehavior.holdend), handoffbehavior.compose);     } } 

so question how can size usercontrol if container placed no size restriction upon it, when current height 0?

i'd happy hear if there better way achieve ultimate goal. many in advance.

you can put content want size of canvas cliptobound="true". can manipulate size of canvas , yet size of content inside canvas full desired size.