时间戳

首页 > 解决方案 > 页面边框是在整个导航窗口周围绘制边框

wpf - 页面边框是在整个导航窗口周围绘制边框

问题描述

只是学习 WPF，但不确定我的页面为什么会这样。我创建了一个页面，我想在页面本身周围画一个边框。它在设计器中看起来很正确。但是当我将它推到navigationFrame 时，整个导航窗格都有边框，而不是页面。我需要这个边框就在页面周围，而不是整个navigationFrame。

<Page x:Class="com.MyBiz.MyProd.Pages.Configuration.TopLevel.AddCompany"
      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:com.MyBiz.MyProd.Pages.Configuration.TopLevel"
      mc:Ignorable="d" 
      d:DesignHeight="250" d:DesignWidth="400" Margin="0,0,0,30"
      Title="AddCompany">

   <Border BorderBrush="Gainsboro" BorderThickness="2">
      <Grid Background="Gray" Height="250" Width="400" VerticalAlignment="Bottom" HorizontalAlignment="Left" >
         <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
         </Grid.RowDefinitions>
         <Grid.ColumnDefinitions>
            <ColumnDefinition Width="130"/>
            <ColumnDefinition Width="*"/>
         </Grid.ColumnDefinitions>
         <StatusBar VerticalAlignment="Top"/>

         <Label VerticalAlignment="Center" HorizontalAlignment="Left">Company Name</Label>
         <TextBox x:Name="tbxCompanyName" Grid.Column="1" Height="30" MaxLength="100" HorizontalAlignment="Stretch" Margin="0,0,10,0"></TextBox>

         <Label VerticalAlignment="Center" HorizontalAlignment="Left" Grid.Row="1" Grid.Column="0">Contact</Label>
         <TextBox x:Name="tbxContact" Grid.Column="1" Grid.Row="1" Height="30" HorizontalAlignment="Stretch"  MaxLength="500" Margin="0,0,10,0"></TextBox>

         <Label VerticalAlignment="Center" HorizontalAlignment="Left" Grid.Column="0" Grid.Row="2">Address</Label>
         <TextBox x:Name="tbxAddress" Grid.Column="1" Grid.Row="2" Height="30" HorizontalAlignment="Stretch"  MaxLength="100" Margin="0,0,10,0"></TextBox>

         <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Center"  Grid.Column="1" Grid.Row="3" Margin="0,0,10,0">
            <Button x:Name="btnCancel" Width="40" Height="20" Background="LightGray" >
               <Image Source="/Images/cancel.png" VerticalAlignment="Center" HorizontalAlignment="left"></Image>
            </Button>
            <Button x:Name="btnCreate" Width="40" Height="20" Background="LightGray" Margin="20,0,0,0" Click="btnCreate_Click">
               <Image Source="/Images/approve.png" VerticalAlignment="Center" HorizontalAlignment="left"></Image>
            </Button>
         </StackPanel>

      </Grid>
   </Border>

</Page>

标签： wpf

解决方案

如果你想在你的表单周围有一个边框，那Border没关系。但是，您在您的 上设置了一个固定Width的 ,和Height，而不是在. 这意味着，当您的页面被放置在导航窗口中时，它会将和缩放到其完整大小，而其本身将以固定大小显示在左下角。VerticalAlignmentHorizontalAlignmentGridBorderPageBorderGrid

它在设计器中如下图所示。它在您的设计器中看起来正确的唯一原因是您将设计时间设置为d:DesignHeight与d:DesignWidth您的 完全相同的尺寸Grid，这意味着 thePage和 theBorder也具有该尺寸。如果您更改设计时大小，它看起来会有所不同。

在此处输入图像描述

现在，通过在页面周围绘制边框来实现什么并不完全清楚。该页面仍将缩放到其容器的大小。您可以将大小和对齐方式从 移动Grid到Border。然后页面仍然缩放到导航窗口的大小，您的表单将出现在左下角，但边框将在它周围，正如它应该的那样。

<Border BorderBrush="Gainsboro" BorderThickness="2" Height="250" Width="400" VerticalAlignment="Bottom" HorizontalAlignment="Left">
   <Grid Background="Gray">
      <!-- ...your XAML code -->
   </Grid>
</Border>

您也可以完全删除尺寸和对齐方式。然后表单的大小也将调整为包含导航窗口和边框。

<Border BorderBrush="Gainsboro" BorderThickness="2">
   <Grid Background="Gray">
      <!-- ...your XAML code -->
   </Grid>
</Border>

推荐阅读