c# - Responsive UI for WPF applications -

i have been trying adjust screen based on different sizes see if components reacting that. unfortunately don't not sure missing. , great if can give direct advice , tips example implementation.

here code:

    <window x:class="wpfapplication1.mainwindow"         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         title="mainwindow" height="1000" width="800">     <grid horizontalalignment="stretch" verticalalignment="stretch">         <grid.columndefinitions>             <columndefinition width="*" />             <columndefinition width="*" />             <columndefinition width="*"/>         </grid.columndefinitions>          <grid.rowdefinitions>             <rowdefinition />             <rowdefinition />             <rowdefinition />             <rowdefinition height="auto" />         </grid.rowdefinitions>         <listview grid.column="0" grid.rowspan="3" grid.columnspan="3" horizontalalignment="stretch" verticalalignment="stretch">             <listviewitem grid.column="0" grid.row="0" grid.columnspan="4" horizontalalignment="stretch" verticalalignment="stretch">                 <grid horizontalalignment="stretch" verticalalignment="stretch">                     <grid.columndefinitions>                         <columndefinition width="*" />                         <columndefinition width="*" />                         <columndefinition width="*"/>                     </grid.columndefinitions>                      <grid.rowdefinitions>                         <rowdefinition />                         <rowdefinition />                         <rowdefinition />                         <rowdefinition height="auto" />                     </grid.rowdefinitions>                     <expander horizontalalignment="stretch" grid.column="0" grid.row="1" verticalalignment="stretch">                         <grid width="auto" horizontalalignment="stretch" verticalalignment="stretch">                             <grid.columndefinitions>                                 <columndefinition width="20" />                                 <columndefinition width="2*"/>                                 <columndefinition width="100" />                                 <columndefinition width="20*"/>                                 <columndefinition width="auto" />                             </grid.columndefinitions>                              <grid.rowdefinitions>                                 <rowdefinition />                                 <rowdefinition />                                 <rowdefinition />                                 <rowdefinition height="auto" />                             </grid.rowdefinitions>                             <label grid.column="1" grid.row="0" content="hjello world meeee"/>                             <listview grid.column="3" grid.row="0"  grid.rowspan="4">                                 <listview.itemspanel>                                     <itemspaneltemplate>                                         <stackpanel orientation="horizontal"></stackpanel>                                     </itemspaneltemplate>                                 </listview.itemspanel>                                 <button content="hello tourist fu"/>                                 <button content="hello tourist fu"/>                                 <button content="hello tourist fu"/>                                 <button content="hello tourist fu"/>                                 <button content="hello tourist fu"/>                                 <listviewitem content="test"/>                             </listview>                             <button grid.column="4" grid.row="0" content="test"/>                         </grid>                     </expander>                 </grid>             </listviewitem>             <listviewitem grid.column="0" grid.row="0" grid.columnspan="4">                  <expander >                     <grid width="auto">                         <grid.columndefinitions>                             <columndefinition width="20" />                             <columndefinition width="2*"/>                             <columndefinition width="100" />                             <columndefinition width="20*"/>                             <columndefinition width="auto" />                         </grid.columndefinitions>                          <grid.rowdefinitions>                             <rowdefinition />                             <rowdefinition />                             <rowdefinition />                             <rowdefinition height="auto" />                         </grid.rowdefinitions>                         <label grid.column="1" grid.row="0" content="hjello world meeee"/>                         <listview grid.column="3" grid.row="0"  grid.rowspan="4">                             <listview.itemspanel>                                 <itemspaneltemplate>                                     <stackpanel orientation="horizontal"></stackpanel>                                 </itemspaneltemplate>                             </listview.itemspanel>                             <button content="hello tourist fu"/>                             <button content="hello tourist fu"/>                             <button content="hello tourist fu"/>                             <button content="hello tourist fu"/>                             <button content="hello tourist fu"/>                             <listviewitem content="test"/>                         </listview>                         <button grid.column="4" grid.row="0" content="test"/>                     </grid>                 </expander>             </listviewitem>         </listview>      </grid> </window> 

1. set x:name main grid x:name="root"

2. set expander attribute width="{binding actualwidth, elementname=root}"