The question is simple as 1x1 and I suppose the answer is also that simple.
I would like to fit my grid's width and height to it's content. So if I change the content's size from code I would like the grid to have the same size.
I've tried the following:
<Grid x:Name="ContainerGrid" Background="Cyan" MouseDown="ContainerGrid_Tapped_1"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <StackPanel Grid.Column="0" Grid.Row="1"> <Rectangle x:Name="small" Fill="Red" Width="100" Height="100" Visibility="Visible"/> <Rectangle x:Name="big" Fill="Green" Width="500" Height="500" Visibility="Collapsed"/> </StackPanel> <Grid x:Name="SelectedCheckMark" Grid.Column="1" Grid.Row="0" Visibility="{Binding ElementName=big,Path=Visibility}"> <Path x:Name="SelectedEarmark" Data="M0,0 L40,0 L40,40 z" Fill="BlueViolet" Stretch="Fill"/> <Path Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="White" FlowDirection="LeftToRight" HorizontalAlignment="Right" Height="15" Stretch="Fill" VerticalAlignment="Top" Width="15"/> </Grid> </Grid>
Code behind relevant part:
private void ContainerGrid_Tapped_1(object sender, MouseButtonEventArgs e) { //Set opoosite visibility small.Visibility = (small.Visibility == Visibility.Visible) ? Visibility.Collapsed : Visibility.Visible; big.Visibility = (big.Visibility == Visibility.Visible) ? Visibility.Collapsed : Visibility.Visible; }
I would like that no Cyan color could be seen in any state of the grid. However now the width of the ContainerGrid does not fit to it's content.
What I've missed?
Answer: 1
Try changing your XAML to the following:
<Grid x:Name="ContainerGrid" Background="Cyan" MouseDown="ContainerGrid_Tapped_1" HorizontalAlignment="Center" VerticalAlignment="Center"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <StackPanel Grid.Column="0" Grid.Row="1"> <Rectangle x:Name="small" Fill="Red" Width="100" Height="100" Visibility="Visible"/> <Grid> <Rectangle x:Name="big" Fill="Green" Width="500" Height="500" Visibility="Collapsed"/> <Grid x:Name="SelectedCheckMark" Grid.Column="1" Grid.Row="0" Visibility="{Binding ElementName=big,Path=Visibility}" HorizontalAlignment="Right" VerticalAlignment="Top"> <Path x:Name="SelectedEarmark" Data="M0,0 L40,0 L40,40 z" Fill="BlueViolet" Stretch="Fill"/> <Path Data="F1 M133.1,17.9 L137.2,13.2 L144.6,19.6 L156.4,5.8 L161.2,9.9 L145.6,28.4 z" Fill="White" FlowDirection="LeftToRight" HorizontalAlignment="Right" Height="15" Stretch="Fill" VerticalAlignment="Top" Width="15"/> </Grid> </Grid> </StackPanel> </Grid>
by : Eirikhttp://stackoverflow.com/users/773118Answer: 2
Try to work with HorizontalAlignment
and VerticalAlignment
Properties of ContainerGrid
.
For example
<Grid x:Name="ContainerGrid" Background="Cyan" MouseDown="ContainerGrid_Tapped_1" Margin="0,0,0,0" ShowGridLines="True" Height="Auto" Width="Auto" HorizontalAlignment="Left" VerticalAlignment="Top">
Their default value is Stretch, which means the grid will stretch within the entire space given by its parent element irrespective of the content.
by : Klaus78http://stackoverflow.com/users/592318
No comments:
Post a Comment
Send us your comment related to the topic mentioned on the blog