WPF：布局的最佳实践是什么

Question

我正在尝试掌握 WPF 应用程序中设置样式/绑定数据的不同方式。为了更好地理解这一点，我希望获得关于如何设计我的具体示例的建议/帮助。

下面的屏幕截图展示了我想要的外观。我还包括了我已经编写的代码。然而，这只是使用简单的 StackPanel 输出主标题和下面的文本。

我的第一个问题是关于多少“信息”，以及应该将哪些内容放入视图中，然后在我的 resources.xaml 中应设置哪些样式以及如何设置样式？这可能很模糊，但我想了解我应该考虑将哪些控件包含在我的视图中，以及我应该考虑将哪些代码放入我的样式中。

图像示例

MyView.xaml

<ScrollViewer VerticalScrollBarVisibility="Auto" Padding="20 0">
    <ItemsControl ItemsSource="{Binding MyModelList}" ItemTemplate="{StaticResource MyViewDataTemplate}" >
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel Orientation="Vertical" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ItemsControl>
</ScrollViewer>

Resources.xaml

<DataTemplate x:Key="MyViewDataTemplate">
    <Border BorderThickness="0 0 0 1" BorderBrush="Black">
        <StackPanel>
            <Label Content="{Binding Heading}" FontSize="24" />
            <Label>
                <Label.Content>
                    <TextBlock>
                        <TextBlock.Text>
                            <MultiBinding StringFormat="Card: {0}, {1}">
                                <Binding Path="PropertyA"></Binding>
                                <Binding Path="PropertyB"></Binding>
                            </MultiBinding>
                        </TextBlock.Text>
                    </TextBlock>
                </Label.Content>
            </Label>
        </StackPanel>
    </Border>
</DataTemplate>

Answer 1

我不确定我对你的问题有多少理解，但你问的第一件事是在资源中放置什么以及在主布局中放置什么。

一个简单的规则是将可重用的代码放在资源中并放在主布局中。例如，假设您必须在用户界面的许多地方显示文本框。现在，您可以将文本框背景、字体、前景、大小等放入资源中，以便每次使用文本框时都可以轻松地从资源中重用这些信息。同样，如果发生更改，您只需要在单个位置进行更改，而不是每个文本框本身。

我应该考虑将哪些控件包含在我的视图中以及我应该考虑将哪些代码放入我的样式中。

嗯，关于第一部分，它完全是取决于您想要实现的场景。从图像示例来看，网格可以与三列一起使用，因为看起来您的 UI 分为三个部分，即标题，然后是两个文本块。在第一列内放置一个带有两个文本块的堆栈面板（一个用于标题，一个用于其下方的小描述），在接下来的两列中，您可以在每列中放置一个文本块。

现在，关于第二点，一旦您将文本块放入网格列中，您就可以将蓝色背景等样式信息放入资源中，

我使用此 XAML 在图像中创建结构

 <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>

        <StackPanel Orientation="Vertical" Grid.Column="0">
            <TextBlock FontSize="20">Hilighted</TextBlock>
            <TextBlock FontSize="10">Card</TextBlock>
        </StackPanel>

        <StackPanel Orientation="Vertical" Grid.Column="1">
            <TextBlock FontSize="20">0</TextBlock>
            <TextBlock FontSize="10">Text</TextBlock>
        </StackPanel>

        <StackPanel Orientation="Vertical" Grid.Column="2">
            <TextBlock FontSize="20">0</TextBlock>
            <TextBlock FontSize="10">Text</TextBlock>
        </StackPanel>
    </Grid>

现在这些是没有任何样式的普通控件。您可以将样式放入资源中并将它们应用到文本块

Answer 2

“我应该将其放在视图中还是资源中？”问题的答案事实证明自己有答案。如果你把它放在视图中，这是我处理大多数事情的开始位置，最终要么会成为问题，要么不会成为问题。如果它成为一个问题，那么可以直接将其（无论它是什么）从视图中移出并将其转变为资源。

最终，正如 Haris Hasan 指出的那样，重复利用的需求是推动这一决定的原因。除非您知道需要重用某种样式，否则 YAGNI 原则在这里适用，就像在所有其他事情中一样。