將高度/寬度綁定到XAML中的子元素

Question

首先，我要對不起，如果這是重復的話。 我在已讀過的任何類似帖子中都找不到答案。 我遇到一個Border控件，該控件的Height和Width綁定到作為Border的子級的TextBlock的ActualHeight和ActualWidth ，這是一個問題。

一切在設計器中都可以正常顯示，但是由於運行時的某些原因， Border控件不可見。 我不確定是否是因為Height或Width可能為0 ，或者是否以其他方式設置了Visibility 。 如果我對“ Height / Width進行硬編碼，那么在設計器中和運行時所有內容都將顯示相同，但​​是這種綁定的行為有些奇怪。 更奇怪的是，它們曾經在工作，我不確定我能做些什么來打破它們。 這是我的XAML：

<Grid Visibility="{Binding Path=Contacts.Count, Converter={StaticResource ItemCountToVisibilityConverter}}" >
    <Border CornerRadius="5"
            BorderBrush="White"
            BorderThickness="2"
            Padding="20,15,0,15"
            Margin="0,15,0,15">
         <ListView ItemsSource="{Binding Path=Contacts}">
             <ListView.ItemTemplate>
                 <DataTemplate>
                     <StackPanel>
                         <TextBlock Text="{Binding Path=Name}" />
                         <TextBlock Text="{Binding Path=Number}" />
                         <TextBlock Text="{Binding Path=EmailAddress}" />
                     </StackPanel>
                 </DataTemplate>
             </ListView.ItemTemplate>
         </ListView>
     </Border>
     <Border Background="White"
             CornerRadius="5"
             Height="{Binding Path=ActualHeight, ElementName=ContactsTextBlock}"
             Width="{Binding Path=ActualWidth, ElementName=ContactsTextBlock}"
             VerticalAlignment="Top">
          <TextBlock Text="Contact Information"  
                     x:Name="ContactsTextBlock"
                     Foreground="Black"
                     Padding="5,2,5,2"
                     HorizontalAlignment="Center"
                     VerticalAlignment="Center" />
    </Border>
</Grid>

出現此問題的是XAML中的第二個Border控件。 如我所說，它在設計器中正確顯示，但是由於運行時的某些原因，它所包含的Border控件以及TextBlock都不可見。 另外， Grid以及ListView和第一個Border都正常工作。 僅僅是第二個Border和TextBlock無法正常運行。

提前致謝！

這是在設計時的外觀：

Answer 1

讓網格為您完成骯臟的工作。 我相信網格是WPF最好的控件之一。

技巧是將垂直空間分成三個切片，其中頂部的兩個切片將根據所需的空間進行大小調整。 也就是說，TextBlock將確定行對的高度。 除了享受結果，您無需做任何事情...

這是一個示例XAML（為簡單起見，我剪切了Visibility屬性）：

<Grid Margin="40,20">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Border 
        CornerRadius="5"
        BorderBrush="White"
        BorderThickness="2"
        Padding="20,15,20,15"
        Background="DimGray"
        Grid.Row="1"
        Grid.RowSpan="2"
        >
        <ListView ItemsSource="{Binding Path=Contacts}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Path=Name}" />
                        <TextBlock Text="{Binding Path=Number}" />
                        <TextBlock Text="{Binding Path=EmailAddress}" />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Border>

    <Border 
        Background="White"
        CornerRadius="5"
        Grid.Row="0"
        Grid.RowSpan="2"
        HorizontalAlignment="Center"
        >
        <TextBlock 
            Text="Contact Information"  
            x:Name="ContactsTextBlock"
            Foreground="Black"
            Padding="5,2,5,2"
            />
    </Border>
</Grid>

請注意，ListView邊框共享中間行，以便邊界線可以“敲”文本。

如下所示：

Answer 2

您可能要設置BorderThickness和BorderBrush ：

 <Border Background="White"
     Border Background="White"
     CornerRadius="5"
     BorderThickness="1"
     BorderBrush="Gray"
     HorizontalAlignment="Center"
     VerticalAlignment="Top">
    <TextBlock Text="Contact Information"  
             x:Name="ContactsTextBlock"
             Foreground="Black"
             Padding="5,2,5,2"
             HorizontalAlignment="Center"
             VerticalAlignment="Center" />
</Border>