Привязка к ActualHeight не работает

Question

Я попытался создать пользовательский элемент управления, имея полупрозрачный закругленный фон:

<Canvas>
    <TextBlock x:Name="StopText" Text="Some test text"/>
    <Rectangle Fill="SkyBlue"
               Width="{Binding Source=StopText, Path=ActualHeight}" 
               Height="20"  
               RadiusX="5" RadiusY="5" Opacity="0.2"/>
</Canvas>

Проблема в том, что я не могу, вероятно, привязать к ActualHeight/ActualWidth свойства, потому что они не являются зависимыми.

Что нужно сделать, чтобы сохранить прямоугольник и текстовое поле одинакового размера?

Answer 1

Правильная привязка заключается в использовании ElementNameне Sourceпри привязке к другому элементу:

<Canvas>
    <TextBlock x:Name="StopText" Text="Some test text"/>
    <Rectangle Fill="SkyBlue"
               Width="{Binding ElementName=StopText, Path=ActualHeight}" 
               Height="20"  
               RadiusX="5" RadiusY="5" Opacity="0.2"/>
</Canvas>

Кроме того, вы понимаете, что вы связываете ширину Rectangle к Height из TextBlock, право?

Если вы действительно хотите настроить свой контроль, вы можете связать Rectangleширина к TextBlock"s ActualWidth, а также Height в ActualHeight,

ОБНОВЛЕНИЕ Согласно комментариям ниже, вот реализация, использующая Grid без привязки:

<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <TextBlock x:Name="StopText" Text="Some test text"/>
    <Rectangle Fill="SkyBlue"
               HorizontalAlignment="Stretch"
               VerticalAlignment="Stretch"  
               RadiusX="5" RadiusY="5" Opacity="0.2"/>
</Grid>

Grid а также Canvas использовать различные системы макетов, и поскольку вы не используете функциональность Canvas предусматривает, Grid это лучший выбор.

Большая разница в дочерних элементах заключается в том, что Rectangle теперь просто использует горизонтальный и VerticalAlignment в Stretch по всему Gridвместо того, чтобы беспокоиться о размерах чего-либо.