XAML窗口看起来不像我想要的

时间:2019-11-19 19:02:19

标签: wpf xaml

我正在学习WPF,并且正在XAML中创建一个窗口。

该窗口应如下所示:

enter image description here

但是当我运行程序时,它看起来像这样:

enter image description here

代码如下:

<Page x:Class="WpfApp1.ProductsManagement"
      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" 
      xmlns:local="clr-namespace:WpfApp1"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="ProductsManagement">

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="80" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="300" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="420" />
        </Grid.RowDefinitions>
            <TextBlock 
            Margin="5"
                Text="Search" 
                  Grid.Row="0"
            Grid.Column="0"/>
            <TextBox
                Margin="5"
                Grid.ColumnSpan="2"
                Grid.Column="1"
                Background ="White"
                  Grid.Row="0"
                Text="hi"/>
            <DataGrid
                Margin ="5"
                Name="dataGrid"
            Grid.Column="0"
                Grid.ColumnSpan="2"
                Grid.Row="1"/>
            <Border
                 Margin ="5"
                Grid.Row="1"
                Grid.Column="2"/>

    </Grid>
</Page>

欢迎任何评论或建议。

更新

我以以下代码为例:

<Page x:Class="WpfApp1.Discussion"
      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" 
      xmlns:data="clr-namespace:BikeShop"
      xmlns:local="clr-namespace:WpfApp1"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="Discussion">

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="100" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="50" />
        </Grid.RowDefinitions>
        <ListBox 
            Grid.ColumnSpan="2" 
            Margin="5"/>
        <Button 
            Grid.Row="1"
            Grid.Column="1"
            Margin="5"
            Content="Send" />
        <TextBox 
            Grid.Row="1"
            Margin="5"
            Text="Type your message here" />
    </Grid>
</Page>

当我运行代码时,它看起来像这样:(它正常工作)

enter image description here

2 个答案:

答案 0 :(得分:2)

您的RowDefinition必须像这样:

<Grid.RowDefinitions>
     <RowDefinition Height="40"/>
     <RowDefinition Height="*"/>
</Grid.RowDefinitions>

现在,您要求填充第一行的整个页面,并将第二行的高度设置为420。

您必须为第一个定义一个特定的值,并为第二个定义*。

您不会在设计器中看到错误,因为您将第二行设置为420。显然,您看到的第一行是30。但是当您进入全屏模式时,第一行会变大。

答案 1 :(得分:1)

因为您的行高不正确。将您的RawDefinitions替换为:

   <Grid.RowDefinitions>
        <RowDefinition Height="40" /> 
        <RowDefinition Height="1*" />
    </Grid.RowDefinitions>