WPF GridSplitter strange behavior when Column Width="Auto" -
i have pretty simple layout, look:
<grid> <grid.columndefinitions> <columndefinition width="*" minwidth="200"></columndefinition> <columndefinition width="5"></columndefinition> <columndefinition width="auto" minwidth="50"></columndefinition> </grid.columndefinitions> <border grid.column="0" borderbrush="red" borderthickness="2"> <!-- picture--> <image source="/resources/previewtest.png"></image> </border> <gridsplitter grid.column="1" width="5" horizontalalignment="center" verticalalignment="stretch" resizebehavior="previousandnext"></gridsplitter> <expander grid.column="2" expanddirection="left" borderbrush="royalblue" borderthickness="2"> <!-- picture--> <image source="/resources/previewtest.png"></image> </expander> </grid>
the problem: when i'm dragging gridsplitter
left, right column goes out window border shown on animation. found happens when width of third column set "auto" (width="auto"
). if set width="*"
gridsplitter
works fine , third column
doesn't go out window border. why when width="auto"
happens?
your problem caused fact 1 of columndefinition
s set auto
. happening when first column reaches minwidth
value, can't smaller. however, if keep moving gridslitter
, right column has grow. seeing let grow size, current problem.
all need fix set right columndefinition.width
property *
value well. in way, can't grow out of grid
more. if need to, can control end sizes of columns using columndefinition.maxwidth
property. try this:
<grid> <grid.columndefinitions> <columndefinition width="*" minwidth="200" /> <columndefinition width="5" /> <columndefinition width="*" minwidth="50" /> </grid.columndefinitions> <border grid.column="0" borderbrush="red" borderthickness="2"> <image source="/resources/previewtest.png" /> </border> <gridsplitter grid.column="1" width="5" horizontalalignment="center" verticalalignment="stretch" resizebehavior="basedonalignment" /> <expander grid.column="2" expanddirection="left" borderbrush="royalblue" borderthickness="2"> <image source="/resources/previewtest.png" /> </expander> </grid>
Comments
Post a Comment