UserControl внутри ContentControl с вложенной шириной / высотой

я разрабатываю приложение Windows Store с использованием Caliburn Micro.

на одной из страниц у меня есть ContentControl, которые отображают UserControl. В UserControl Я GridView.

мой вопрос: Как настроить UserControl.Width же ContentControl.Width?
Примечание: whet set UserControl.Width=Auto - ширина такая же, как GridView.Width

на странице.в XAML

<ContentControl x:Name="ActiveItem" />

in элемент управления UserControl.в XAML

<UserControl
x:Class="Test.Views.GroupView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" Width="Auto" Height="Auto">

    <Grid Margin="0,20">
        <GridView x:Name="Groups" Margin="0" />
    </Grid>
</UserControl>



обновление

добавлять

  VerticalAlignment="Stretch"
  HorizontalAlignment="Stretch"

до UserControl не решает проблему.

5 ответов


понял это после многих проб и ошибок:

<ContentControl Name="MyContent" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">

ключ должен использовать горизонтальный / вертикальный*контент*свойство выравнивания (не свойства горизонтального/вертикального выравнивания).


вот что вы должны делать, когда появляется такая проблема, как ваша.

  1. попробуйте установить ContentControl ' s Background свойство к некоторому нарушая цвету. Например, фиолетовый или розовый. А также набор Background собственность на зеленый. Это позволит вам увидеть, где именно ваш ContentControl и где UserControl. Если вы не видите зеленого цвета, вы можете сказать, что содержание UserControl растягивается, чтобы заполнить всю UserControl.

  2. попробуйте set UserControl ' s VerticalAlignment и HorizontalAlignment свойства Stretch. FrameworkElement.Поле HorizontalAlignment, имеет

    Примечание: Для того, чтобы они работали. Вы не могу явно установлен ширина и Высота на UserControl.

  3. попробуйте установить ContentControl ' s VerticalContentAlignment и HorizontalContentAlignment to Stretch. управление.HorizontalContentAlignment, VerticalContentAlignment . Они растягивают дочерний элемент, чтобы заполнить выделенное пространство макета родительского элемента.

  4. если вы все еще видите какой-то фиолетовый или розовый, то что-то не так снова :) вы можете проверить Margin/Padding MSDN

если он все еще испорчен. Тогда я не знаю, чем еще могу вам помочь. Последнее возможное решение было бы обязательным. И я не уверен, что это работает.

<UserControl
Width="{Binding RelativeSource=
        {RelativeSource FindAncestor,
        AncestorType={x:Type ContentControl}},
        Path=ActualWidth}"
Height="{Binding RelativeSource=
        {RelativeSource FindAncestor,
          AncestorType={x:Type ContentControl}},
          Path=ActualHeight}">
...
</UserControl>

надеюсь, что-то поможет. Я считаю, что это может быть действительно раздражающая проблема.


специально для @AlexeiMalashkevich
Я решаю его с помощью привязки следующим образом:

в корневой странице у вас есть:

 <ContentControl x:Name="ActiveItem"/>

затем добавьте дочернюю страницу:

<Page
    Height="{Binding ActualHeight, ElementName=ActiveItem}"
    Width="{Binding ActualWidth, ElementName=ActiveItem}"
    ......
/>

и это все.


вы должны иметь возможность привязать ширину UserControl к фактической ширине ContentControl.

<local:MyUserControl1 Height="50" Width="{Binding ElementName=contentControl, Path=ActualWidth}"/>

вот пример кода:

<Page
    x:Class="stofUserControlWidth.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:stofUserControlWidth"
    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}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Border Background="Cyan"/>
        <ContentControl Grid.Column="1" x:Name="contentControl">
            <local:MyUserControl1 Height="50" Width="{Binding ElementName=contentControl, Path=ActualWidth}"/>
        </ContentControl>
    </Grid>
</Page>

вот MyUserControl1.код xaml:

<UserControl
    x:Class="stofUserControlWidth.MyUserControl1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:stofUserControlWidth"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">

    <Grid Background="Magenta">        
    </Grid>
</UserControl>

надеюсь, что это помогает!


для меня это работает:

<UserControl
                 ...
                    Height="{Binding ActualHeight,
                    RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ContentControl}}}">

...

</UserControl>

вы должны убедиться, что ваш ContentControl имеет нужный размер.

мой ContentControl посмотрите так: он всегда заполняет весь размер окна. И размер UserControl на ContentControl динамически изменяется.
<Grid>
    <ContentControl HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" DataContext="{Binding StartViewModel}" Name="ContentArea" />
</Grid>