Привязать содержимое пользовательского элемента управления к всплывающему окну внутри этого пользовательского элемента управления

#wpf #vb.net

#wpf #vb.net

Вопрос:

Я пытаюсь создать UserControl , состоящий из кнопки, которая вызывает отображение информационного всплывающего окна при нажатии. Дизайн и стиль кнопки определены в UserControl и не изменятся, Content из Popup следует использовать Content свойство UserControl самого.

Мой текущий подход к элементу управления таков:

 <UserControl x:Class="InfoPopup"
             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"
             mc:Ignorable="d" 
             d:DesignHeight="30" d:DesignWidth="30">
    <UserControl.Template>
        <ControlTemplate TargetType="UserControl">
            <Grid>
                <ToggleButton Name="button">
                    <Label Content="i"/>
                </ToggleButton>
                <Popup IsOpen="{Binding IsChecked, ElementName=button}" StaysOpen="False">
                    <ContentPresenter />
                </Popup>
            </Grid>
        </ControlTemplate>
    </UserControl.Template>
</UserControl>
  

И код, в котором он используется, должен выглядеть следующим образом:

 <local:InfoPopup VerticalAlignment="Top" HorizontalAlignment="Right" Height="30" Width="30">
    <TextBlock TextWrapping="Wrap" Margin="5" MaxWidth="400">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Cras pulvinar mattis nunc sed. Interdum consectetur libero id faucibus nisl tincidunt eget nullam. Vestibulum rhoncus est pellentesque elit ullamcorper. Enim blandit volutpat maecenas volutpat blandit aliquam etiam erat velit.
        <LineBreak />
        <LineBreak />
        Est sit amet facilisis magna. Quis enim lobortis scelerisque fermentum dui faucibus. Magna eget est lorem ipsum dolor sit amet. Aenean pharetra magna ac placerat vestibulum lectus mauris ultrices. Viverra nam libero justo laoreet sit amet cursus sit. Fermentum posuere urna nec tincidunt praesent. Maecenas volutpat blandit aliquam etiam erat velit scelerisque.
    </TextBlock>
</local:InfoPopup>
  

Это приводит к тому, что всплывающее окно отображается с правильным размером (в соответствии с указанным Content ) при нажатии кнопки, но фактическое содержимое всплывающего окна — это просто (буквально) черный ящик.

Чего мне не хватает? Я не очень знаком с привязками и шаблонами WPF.

Ответ №1:

Содержимое всплывающего окна черное, потому что передний план и фон черные (по умолчанию).

Вы можете либо установить AllowsTransparency=»True» во всплывающем окне (если вы хотите, чтобы фон был прозрачным).

 <Popup IsOpen="{Binding IsChecked, ElementName=button}" StaysOpen="False" AllowsTransparency="True">
  

Или сделайте что-то вроде размещения сетки вокруг ContentPresenter с фоном по вашему выбору, вот так:

 <Grid Background="White">
    <ContentPresenter />
</Grid>
  

Если вам нужен цвет фона по умолчанию, попробуйте это:

 <Grid Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
    <ContentPresenter />
</Grid>
  

Комментарии:

1. Ага, мне действительно следовало попробовать больше. Я думал, что было нарушено что-то гораздо более фундаментальное. 🙂