c# - 更改 ContentControl.Content 将内容堆叠在一起
问题描述
我有一个带有几个单选按钮、一个 ContentControl 和一个用于更改 ContentControl 内容的按钮的 MainWindow。
我还有一个带有标签的 UserControl1。当我单击 MainWindow 上的按钮将 ContentControl.Content 更改为 UserControl1 时,它会在 MainWindow 中的单选按钮顶部显示标签。我怎样才能改变它,使它像一个页面一样,并且不会将每个控件堆叠在一起?
MainWindow.xaml:
<Window x:Class="Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Test"
mc:Ignorable="d"
Title="Test" WindowStartupLocation="CenterScreen" Width="968" Height="560" HorizontalAlignment="Center" VerticalAlignment="Center">
<Grid HorizontalAlignment="Center" VerticalAlignment="Center" Height="540" Margin="0,10,-6,-19" Width="968">
<StackPanel Height="74" Margin="731,446,0,0" VerticalAlignment="Top" Width="229" Orientation="Horizontal" HorizontalAlignment="Left">
<Button Content="Back" MinWidth="100" Margin="10,20,0,0"/>
<Button Content="Next" MinWidth="100" Margin="10,20,0,0" Click="NextBtnClick"/>
</StackPanel>
<RadioButton x:Name="RadioBtn1" Content="Radio1" HorizontalAlignment="Center" Margin="312,130,95,0" VerticalAlignment="Top" Height="76" Width="561" FontSize="48" FontWeight="Bold" GroupName="1"/>
<RadioButton x:Name="RadioBtn2" Content="Radio2" HorizontalAlignment="Center" Margin="312,232,95,0" VerticalAlignment="Top" Height="76" Width="561" FontSize="48" FontWeight="Bold" GroupName="1"/>
<ContentControl x:Name="contentControl" Grid.Row="1"/>
</Grid>
</Window>
MainWindow.xaml.cs:
private void NextBtnClick(object sender, RoutedEventArgs e)
{
if (RadioBtn2.IsChecked == true)
{
this.contentControl.Content = new UserControl1();
}
}
单击下一个按钮后,我将来自 UserControl1 的控件堆叠在单选按钮的顶部。
我对 WPF 很陌生,所以任何帮助都将不胜感激。浏览文档是一场噩梦,因为我不确定如何解决这个问题。
解决方案
您可以尝试使用Grid
面板而不定义行和列定义。根据您的代码,您正在尝试通过硬编码的边距、宽度和高度来定义面板布局。这就是为什么控件被渲染在彼此之上的原因。
我更改了网格代码以定义行定义,以便控件按行堆叠。因此,当您单击加载Button
到ContentContrl
最后一行时(通过 RowDefinition 定义为 Height="*" 以占用剩余空间)
您可以在 Internet 上阅读有关 WPF 面板和网格布局的信息。这可能是一个好的开始。
<Window x:Class="Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Test"
mc:Ignorable="d"
Title="Test" WindowStartupLocation="CenterScreen" Width="968" Height="560" HorizontalAlignment="Center" VerticalAlignment="Center">
<Grid HorizontalAlignment="Center" VerticalAlignment="Center" Margin="10 10 10 10">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions?
<StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Left">
<Button Content="Back" MinWidth="100" />
<Button Content="Next" MinWidth="100" Click="NextBtnClick"/>
</StackPanel>
<RadioButton Grid.Row="1" x:Name="RadioBtn1" Content="Radio1" HorizontalAlignment="Center" VerticalAlignment="Top" FontWeight="Bold" GroupName="1"/>
<RadioButton Grid.Row="2" x:Name="RadioBtn2" Content="Radio2" HorizontalAlignment="Center" FontSize="48" FontWeight="Bold" GroupName="1"/>
<ContentControl x:Name="contentControl" Grid.Row="3"/>
</Grid>
</Window>
推荐阅读
- mysql - 使用逐行操作设置 SQL 列默认值
- azure - Azure AKS:无法访问专用集群,出现错误 dial tcp:lookup .....privatelink.westeurope.azmk8s.io on 208.67.222.222:53: no such host
- javascript - Javascript 更改指向 fancybox iframe 弹出窗口的链接仅限于 31 个链接
- javascript - Javascript / Vue 一个接一个地执行一个函数(同步)
- python - 从单个标记中提取名词块
- javascript - 组件在 api 能够获取之前给出错误
- ansible - Ansible 任务错误:{“msg”:“目标目录 /opt/connectdirect/ndm/cfg/CD.STK 不存在”}
- javascript - 检查angularjs中动态字段的模糊事件的重复字段值
- c# - 将pdf JBIG2Decode过滤器转换为图像c#
- r - 如何使用 editable = TRUE 参数从 DT::renderDT 更改 colnames?