XAML ListView on wrong positon in the grid -
i trying make listview in picture third row on grid, below slider controls. unfortunately not taking position per definition. please advise
here definition:
<grid> <grid.rowdefinitions> <rowdefinition height="auto"/> <!--top date--> <rowdefinition height="10"/> <!--just space between top date & slider controls--> <rowdefinition height="auto"/> <!--slider row--> <rowdefinition height="*"/> <!--favorite shifts list view--> </grid.rowdefinitions> <textblock x:name="tbdate" grid.row="0" text="mon 28 april" foreground="white" horizontalalignment="center" fontsize="23" margin="6,0,0,0" style="{staticresource messagedialogtitlestyle}"/> <grid grid.row="2" horizontalalignment="center"> <grid.columndefinitions> <columndefinition width="auto" minwidth="88.333"/> <columndefinition width="auto" minwidth="193.333"/> <columndefinition width="auto"/> </grid.columndefinitions> <button x:name="btnaddtofavs" grid.column="0" content="add" click="btnaddtofavs_click"/> <stackpanel grid.column="1" orientation="vertical" horizontalalignment="center" margin="0,0,0.333,0" width="88"> <slider x:name="sliderstarttime" orientation="vertical" largechange="0" maximum="48" smallchange="0" margin="0,31,0,-332" style="{staticresource sliderstartstyle}" isdirectionreversed="true" horizontalalignment="center" /> <border background="white" cornerradius="5" width="auto"> <textblock x:name="tbshiftstart" text="{binding value, converter={staticresource slidervaluetohoursconverter}, elementname=sliderstarttime}" foreground="red" fontsize="13" fontfamily="nirmala ui" width="55" horizontalalignment="center" verticalalignment="center"/> </border> </stackpanel> <stackpanel grid.column="2" orientation="vertical" horizontalalignment="center" margin="0.333,0,0,0" width="88"> <slider x:name="sliderendtime" orientation="vertical" largechange="0" maximum="48" smallchange="0" margin="0,31,0,-332" style="{staticresource sliderendstyle}" isdirectionreversed="true" horizontalalignment="center" value="48" /> <border background="white" cornerradius="5" width="auto"> <textblock x:name="tbshiftend" text="{binding value, converter={staticresource slidervaluetohoursconverter}, elementname=sliderendtime}" foreground="green" fontsize="13" fontfamily="nirmala ui" width="55" horizontalalignment="center" verticalalignment="center"/> </border> </stackpanel> </grid> <listview x:name="lvfavshifts" grid.row="3" foreground="red" fontsize="40" maxheight="300" margin="0,40" > <listview.itemtemplate> <datatemplate> <grid> <grid.columndefinitions> <columndefinition width="auto"/> <columndefinition width="*"/> <columndefinition width="auto"/> <columndefinition width="*"/> <columndefinition width="auto"/> </grid.columndefinitions> <border borderthickness="12" background="#ffc2cedc" grid.column="0" grid.columnspan="5" cornerradius="15"/> <button x:name="btnsetshift" content="set" background="green" grid.column="0" horizontalalignment="center" verticalalignment="center" width="auto" height="auto" fontfamily="global user interface"/> <textblock x:name="tbfavshiftstart" grid.column="1" text="{binding thestarttime}" horizontalalignment="center" verticalalignment="center" fontsize="19" fontfamily="global user interface" foreground="#ff216e8b"/> <textblock x:name="tbhyphen" grid.column="2" text="-" horizontalalignment="center" verticalalignment="center" fontsize="19" fontfamily="global user interface" foreground="#ff216e8b"/> <textblock x:name="tbfavshiftend" grid.column="3" text="{binding theendtime}" horizontalalignment="center" verticalalignment="center" fontsize="19" fontfamily="global user interface" foreground="#ff216e8b"/> <button x:name="btndeleteshift" content="delete" background="red" grid.column="4" horizontalalignment="center" verticalalignment="center" width="auto" height="auto" fontfamily="global user interface"/> </grid> </datatemplate> </listview.itemtemplate> </listview> </grid>
ive changed code bit better result. not ideal should more tweaked desired result. main change margins
<slider x:name="sliderstarttime" margin="0,31,0,-332" />
have gone recipe disaster on varying screen sizes. have , see think.
<grid> <grid.rowdefinitions> <rowdefinition height="40"/> //its ok set height here <!--top date--> <rowdefinition height="10"/> <!--just space between top date & slider controls--> <rowdefinition height="auto"/> <!--slider row--> <rowdefinition height="*"/> <!--favorite shifts list view--> </grid.rowdefinitions> <textblock x:name="tbdate" grid.row="0" text="mon 28 april" foreground="white" horizontalalignment="center" fontsize="23" margin="6,0,0,0" style="{staticresource messagedialogtitlestyle}"/> <grid grid.row="2" horizontalalignment="center"> <grid.columndefinitions> <columndefinition width="auto"/> <columndefinition width="1*"/> //adaptable fit varying screen sizes <columndefinition width="1*"/> </grid.columndefinitions> <button x:name="btnaddtofavs" grid.column="0" content="add" /> <stackpanel grid.column="1" orientation="vertical" horizontalalignment="center" width="88"> <border background="white" cornerradius="5" width="auto"> <textblock x:name="tbshiftstart" text="30" foreground="red" fontsize="13" fontfamily="nirmala ui" width="55" horizontalalignment="center" verticalalignment="center"/> </border> <slider x:name="sliderstarttime" orientation="vertical" largechange="0" maximum="48" smallchange="0" isdirectionreversed="true" horizontalalignment="center" height="300" /> // slider has reasonable height. want control of on phones </stackpanel> <stackpanel grid.column="2" orientation="vertical" horizontalalignment="center" width="88"> <border background="white" cornerradius="5" width="auto"> <textblock x:name="tbshiftend" text="22" foreground="green" fontsize="13" fontfamily="nirmala ui" width="55" horizontalalignment="center" verticalalignment="center"/> </border> <slider x:name="sliderendtime" orientation="vertical" largechange="0" maximum="48" smallchange="0" isdirectionreversed="true" horizontalalignment="center" verticalalignment="stretch" value="48" height="300" /> </stackpanel> </grid> <listview x:name="lvfavshifts" grid.row="3" foreground="red" fontsize="40" margin="0,40" > <listview.itemtemplate> <datatemplate> <grid> <grid.columndefinitions> <columndefinition width="auto"/> <columndefinition width="*"/> <columndefinition width="auto"/> <columndefinition width="*"/> <columndefinition width="auto"/> </grid.columndefinitions> <border borderthickness="12" background="#ffc2cedc" grid.column="0" grid.columnspan="5" cornerradius="15"/> <button x:name="btnsetshift" content="set" background="green" grid.column="0" horizontalalignment="center" verticalalignment="center" width="auto" height="auto" fontfamily="global user interface"/> <textblock x:name="tbfavshiftstart" grid.column="1" text="{binding thestarttime}" horizontalalignment="center" verticalalignment="center" fontsize="19" fontfamily="global user interface" foreground="#ff216e8b"/> <textblock x:name="tbhyphen" grid.column="2" text="-" horizontalalignment="center" verticalalignment="center" fontsize="19" fontfamily="global user interface" foreground="#ff216e8b"/> <textblock x:name="tbfavshiftend" grid.column="3" text="{binding theendtime}" horizontalalignment="center" verticalalignment="center" fontsize="19" fontfamily="global user interface" foreground="#ff216e8b"/> <button x:name="btndeleteshift" content="delete" background="red" grid.column="4" horizontalalignment="center" verticalalignment="center" width="auto" height="auto" fontfamily="global user interface"/> </grid> </datatemplate> </listview.itemtemplate> </listview> </grid>
Comments
Post a Comment