当我把我的网格控件换成堆叠面板时，内容就会消失

本文关键字：消失我的网格控件 | 更新日期: 2023-09-27 18:24:08

当我把网格控件换成stackpanel控件时，里面的内容就会消失。我可以使用网格控制，但不知道会让我出错：）

这适用于

<Grid> <views:ChessBoardView DataContext="{Binding Path=BoardViewModel}" ></views:ChessBoardView>
</Grid>

这不是：

<StackPanel>
<views:ChessBoardView DataContext="{Binding Path=BoardViewModel}" ></views:ChessBoardView>
</StackPanel>

详细信息：

视图模型：

public class MainWindowViewModel : BaseViewModel
{
    #region Properties
    #region ChessBoardViewModel
    private ChessBoardViewModel _BoardViewModel;
    public ChessBoardViewModel BoardViewModel
    {
        get { return _BoardViewModel; }
        set
        {
            if (_BoardViewModel != value)
            {
                _BoardViewModel = value;
                RaisePropertyChanged(() => BoardViewModel);
            }
        }
    }
    #endregion
}
namespace Chess_Piece_Viewer.ViewModels
{
public class ChessBoardViewModel:BaseViewModel
{
    public Color DarkSquareColor { get; set; }
    public Color LightSquareColor { get; set; }
    public ChessBoardViewModel()
    {
        DarkSquareColor = Colors.Black;
        LightSquareColor = Colors.White;
    }
}

穷人依赖性注入：

public partial class App : Application
{
    protected override void OnStartup(StartupEventArgs e)
    {
        base.OnStartup(e);
        MainWindow = new Chess_Piece_Viewer.Views.MainWindow();
        var MainViewModel = new Chess_Piece_Viewer.ViewModels.MainWindowViewModel();
        MainViewModel.BoardViewModel = new ViewModels.ChessBoardViewModel();
        MainWindow.DataContext = MainViewModel;
        MainWindow.Show();
    }
}

我添加了正在消失的用户控件

<UserControl x:Class="Chess_Piece_Viewer.Views.ChessBoardView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
</UserControl.Resources>
<UniformGrid Rows="8" Columns="8">
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
       </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=DarkSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black">
        <Rectangle.Fill>
            <SolidColorBrush Color="{Binding Path=LightSquareColor}"/>
        </Rectangle.Fill>
    </Rectangle>

</UniformGrid>
</UserControl>

提前感谢您的帮助：）

当我把我的网格控件换成堆叠面板时，内容就会消失

我推荐两件事：

首先，在代码背后使用一些循环来生成所有的矩形。你有大约64个硬编码。代码隐藏确实可以减少XAML文件的大小。

XAML:

 <UniformGrid x:Name="_uniformGrid" Rows="8" Columns="8"/>

CodeBehind：（有点复杂，因为行变白/变黑，但下面的代码有效…）

private void InitializeUniformGrid()
{
    for (int i = 0; i < 4; i++)
    {
        for (int j = 0; j < 4; j++)
        {
            _uniformGrid.Children.Add(new Rectangle { Fill = Brushes.Black, Stroke = Brushes.Black });
            _uniformGrid.Children.Add(new Rectangle { Fill = Brushes.White, Stroke = Brushes.Black });
        }
        for (int k = 0; k < 4; k++)
        {
            _uniformGrid.Children.Add(new Rectangle { Fill = Brushes.White, Stroke = Brushes.Black });
            _uniformGrid.Children.Add(new Rectangle { Fill = Brushes.Black, Stroke = Brushes.Black });
        }
    }
}

其次，要解决主要问题，您需要为ChessBoardView指定高度和宽度。

这样做（将500改为你真正需要的任何宽度和高度）：

Height="500" Width="500"

以下内容只会在设计视图中设置高度和宽度，而不会在代码运行时设置：

d:DesignHeight="300" d:DesignWidth="300"

生成的XAML应该如下所示：

<UserControl x:Class="Chess_Piece_Viewer.Views.ChessBoardView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         Height="300" Width="300"
         d:DesignHeight="300" d:DesignWidth="300">