为什么没有指定RowDefinitions和列定义，网格布局不工作？

<Page 
    x:Class="AllControls.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:AllControls" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 



     <Rectangle Width="100" Height="100" Fill="Red" Grid.Column="0" Grid.Row="0"/> 
     <Rectangle Width="100" Height="100" Fill="Orange" Grid.Column="1" Grid.Row="0"/> 
     <Rectangle Width="100" Height="100" Fill="Yellow" Grid.Column="0" Grid.Row="1"/> 
     <Rectangle Width="100" Height="100" Fill="Green" Grid.Column="1" Grid.Row="1"/> 
     <Rectangle Width="100" Height="100" Fill="Blue" Grid.Column="0" Grid.Row="2"/> 
     <Rectangle Width="100" Height="100" Fill="Indigo" Grid.Column="1" Grid.Row="2"/> 
     <Rectangle Width="100" Height="100" Fill="Violet" Grid.Column="0" Grid.Row="3"/> 
     <Rectangle Width="100" Height="100" Fill="Purple" Grid.Column="1" Grid.Row="3"/> 
    </Grid> 
</Page>

我在这种情况下为每个元素提供行号和列号矩形。我也为他们每个人提供了高度和宽度。为什么没有指定RowDefinitions和列定义，网格布局不工作？

我来自HTML背景。

有人可以向我解释标签RowDefinitions和ColumnDefinitions在这里的工作原理吗？

来源

2013-06-03 Amogh Talpallikar

您必须指定RowDefinitions和ColumnDefinitions，以便知道如何调整行和列的大小。否则，它不知道你是否想自动调整大小或star-sizing。而且它还需要知道你需要多少行和列;它不会基于Grid.Row和Grid.Column的值来实时添加它们。

我认为你写的代码看起来很合理，如果它没有指定时使用默认值，那很好，但不幸的是它没有。相反，它构建了一个单列单排网格，并将所有孩子堆叠在一起。

我可以想到一些方法来编写一些XAML，它们将会做你想做的事情。

方式一：

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="Auto" /> 
    </Grid.RowDefinitions> 
    <Rectangle Width="100" Height="100" Fill="Red" Grid.Column="0" Grid.Row="0"/> 
    <Rectangle Width="100" Height="100" Fill="Orange" Grid.Column="1" Grid.Row="0"/> 
    ... 
</Grid>

另一种方式：

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="100" /> 
     <ColumnDefinition Width="100" /> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="100" /> 
     <RowDefinition Height="100" /> 
     <RowDefinition Height="100" /> 
     <RowDefinition Height="100" /> 
    </Grid.RowDefinitions> 
    <Rectangle Fill="Red" Grid.Column="0" Grid.Row="0"/> 
    <Rectangle Fill="Orange" Grid.Column="1" Grid.Row="0"/> 
    ... 
</Grid>

来源

2013-06-03 13:55:55 Andrew

所以，如果我想创建一个4×2格，我需要提供4个RowDefinitions两个定义？你为什么只给出三个RowDefinitions？第四个是自动安排还是什么？是否有可能让我有像表结构的所有行不必具有相同的列数。 –

糟糕，我的错误。你确实需要四个RowDefinitions，所以我编辑了我的答案。每行总是有相同数量的列，但是您可以在矩形上使用Grid.ColumnSpan =“2”使其成为两列宽（假设您没有在矩形上指定明确的宽度）。对于Grid.RowSpan也是如此。 – Andrew

谢谢。非常感谢。我厌倦了每一个新的GUI框架，都有自己的标记语言和新的布局规则。 –

像安德鲁先生指出的那样，你必须确定你的布局更加来完成它使用指定RowDefinition/ColumnDefinition基本上手动放置你的东西。如果你正在寻找更流畅的东西，对定义布局结构的要求更少，你应该看看GridView/VariableSizeWrapGrid（我认为更多的是你要找的东西。）

两者都有多个examples可以在网络上使用，并且非常容易习惯。希望这可以帮助您从HTML到XAML过渡（PS，在我看来XAML> HTML）

来源

2013-06-03 14:56:36

为什么没有指定RowDefinitions和列定义，网格布局不工作？

回答

相关问题