我有一个有两行的网格,我需要在第二行放置一些超出网格限制的按钮,如下图所示:
问题是按钮正在切割。我怎么能像图像一样?
以下是我当前代码的示例:
<Grid Height="300" Margin="5, 0, 5, 0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="30" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="3">
<Grid.Background>
<ImageBrush Stretch="Fill" ImageSource="Assets/back_help.png"/>
</Grid.Background>
<Canvas Margin="30, 30, 30,0" Grid.ColumnSpan="3" >
<TextBlock TextWrapping="Wrap" Text="TextBlock" x:Uid="MainPageHelpText" FontFamily="Assets/Fonts/chalkboard-bold.ttf#Chalkboard" FontSize="26" Foreground="White" Width="338" Height="218" TextAlignment="Center">
<TextBlock.RenderTransform>
<TranslateTransform
X="2"
Y="2" />
</TextBlock.RenderTransform>
</TextBlock>
<TextBlock TextWrapping="Wrap" Text="TextBlock" x:Uid="MainPageHelpText" FontFamily="Assets/Fonts/chalkboard-bold.ttf#Chalkboard" FontSize="26" Foreground="#af7f46" Width="340" Height="220" TextAlignment="Center">
</TextBlock>
</Canvas>
</Grid>
<Button Grid.Column="0" Grid.Row="1" Width="60" Height="60" VerticalAlignment="Bottom" BorderThickness="0" >
<Image Source="Assets/ic_leaderboard.png" Width="60" Height="60" Margin="0,-18, 0,0" />
</Button>
<Button Grid.Column="1" Grid.Row="1" Width="60" Height="60" Margin="0, -30, 0, 0" BorderThickness="0" >
<Image Source="Assets/ic_play.png" Width="70" Height="70" Margin="0,-29, 0,0" />
</Button>
<Button Grid.Column="2" Grid.Row="1" Width="60" Height="60" Margin="0, -30, 0, 0" BorderThickness="0" >
<Image Source="Assets/ic_achievements.png" Width="60" Height="60" Margin="0,-18, 0,0" />
</Button>
</Grid>