windows - How to fill the page and adjust text position according to resize -
i'm new xaml , windows 10 gui programming. want design page textblock, listbox , button, centered in page. want textblock , button reside @ top , bottom of page no matter how users resize window. listbox should stretch fill gap between textblock , listbox automatically. have tried set verticalalignment different value, doesn't seem anything.
<page x:class="firstwin10.mainpage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:firstwin10" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:ignorable="d"> <stackpanel background="{themeresource applicationpagebackgroundthemebrush}" orientation="vertical"> <textblock x:name="textblock" horizontalalignment="center" margin="10,20,10,0" textwrapping="wrap" verticalalignment="top"> <run text="unkown screen name"/> <linebreak/> <run/> </textblock> <listbox x:name="listbox" horizontalalignment="center" minwidth="450" minheight="178" margin="50,20,50,0" verticalalignment="stretch"> <stackpanel orientation="horizontal"> <checkbox /> <textbox text="listbox item #1" /> </stackpanel> <stackpanel orientation="horizontal"> <checkbox /> <textblock> <run text="listbox item #2"/> </textblock> </stackpanel> <stackpanel orientation="horizontal"> <checkbox /> <textblock> <run text="listbox item #3"/> </textblock> </stackpanel> <stackpanel orientation="horizontal"> <checkbox /> <textblock> <run text="listbox item #4"/> </textblock> </stackpanel> </listbox> <button x:name="button" content="button" horizontalalignment="center" margin="10,20,10,0" verticalalignment="bottom"/> </stackpanel>
consider using grid
3 rows. first , last rows auto stretched size of textblock
, button
; middle row takes rest of space.
<grid> <grid.rowdefinitions> <rowdefinition height="auto" /> <rowdefinition height="*" /> <rowdefinition height="auto" /> </grid.rowdefinitions> <textblock grid.row="0" horizontalalignment="center" /> <!-- grid.row="0" can removed it's default --> <listbox grid.row="1" horizontalalignment="center" /> <button grid.row="2" horizontalalignment="center" /> </grid>
Comments
Post a Comment