我有一个UserControl,我在其中创建了一个样式,该样式稍后将应用于Popup的ContentControl(以下是UserControl中的所有定义):
<Style x:Key="ttPopupContent" TargetType="{x:Type ContentControl}">
<Setter Property="Template">
<Setter.Value>
<!-- BOTTOM Popup -->
<ControlTemplate TargetType="{x:Type ContentControl}">
<Grid x:Name="Grid">
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Rectangle MinWidth="40" Fill="#fff" Stroke="#FF000000" Grid.Row="1" />
<StackPanel Grid.Row="1">
<TextBlock Text="My popup title for bottom popup" TextWrapping="Wrap"/>
<TextBlock Text="My popup body content for bottom popup" TextWrapping="Wrap" />
</StackPanel>
<Path Fill="#fff" Stretch="Fill" Stroke="#FF000000" HorizontalAlignment="Left"
Margin="{TemplateBinding Tag}" Width="20" Grid.Row="0" Data="M 0,21 L 10,0 20,21" />
<ContentPresenter Margin="8" Grid.Row="1" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding Placement, ElementName=myPopup}" Value="Top">
<!-- TOP Popup -->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ContentControl}">
<Grid x:Name="Grid">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Rectangle MinWidth="40" Fill="#fff" Stroke="#FF000000" Grid.Row="0" />
<StackPanel Grid.Row="0">
<TextBlock Text="My popup title for top popup"
TextWrapping="Wrap"/>
<TextBlock Text="My popup body content for top popup"
TextWrapping="Wrap" />
</StackPanel>
<Path Fill="#fff" Stretch="Fill" Stroke="#FF000000" HorizontalAlignment="Left"
Margin="{TemplateBinding Tag}" Width="20" Grid.Row="1" Data="M 0,0 L 10,20 20,0" />
<ContentPresenter Margin="8" Grid.Row="0" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
<!-- this label is placed at leftmost of the screen -->
<TextBlock x:Name="txtBlck1" Text="ShowInfo" />
<Popup x:Name="myPopup1" AllowsTransparency="True" Opened="Popup_Opened1"
PlacementTarget="txtBlck1" Placement="Bottom">
<ContentControl Style="{StaticResource ttPopupContent}"/>
</Popup>
<!-- this label is placed at rightmost of the screen -->
<TextBlock x:Name="txtBlck2" Text="AnotherLabel" />
<Popup x:Name="myPopup2" AllowsTransparency="True" Opened="Popup_Opened2"
PlacementTarget="txtBlck2" Placement="Bottom">
<ContentControl Style="{StaticResource ttPopupContent}"/>
</Popup>
有时它不能正确地将箭头指向弹出窗口绑定的标签。例如,如果我将鼠标悬停在标签“AnotherLabel”上,它将被绘制如下(该标签位于屏幕的最右边):
正如你所看到的,箭头没有放在正确的位置。2然而,我有另一个标签“ShowInfo”放在屏幕的最左边,然后它就工作了:
因此,我尝试通过在代码隐藏(xaml.cs)中执行以下操作来调整箭头的水平对齐,以正确指向标签:
private void Popup_Opened1(object sender, EventArgs e)
{
UIElement target = myPopup1.PlacementTarget;
Point adjust = target.TranslatePoint(new Point(8, 0), popup);
if (adjust.Y > 0)
{
popup.Placement = System.Windows.Controls.Primitives.PlacementMode.Top;
}
myPopup1.Tag = new Thickness(adjust.X, -1.5, 0, -1.5);
}
private void Popup_Opened2(object sender, EventArgs e)
{
UIElement target = myPopup2.PlacementTarget;
Point adjust = target.TranslatePoint(new Point(8, 0), popup);
if (adjust.Y > 0)
{
popup.Placement = System.Windows.Controls.Primitives.PlacementMode.Top;
}
myPopup2.Tag = new Thickness(adjust.X, -1.5, 0, -1.5);
}
我在代码隐藏中尝试做的是通过水平调整箭头,将其放置在正确的位置,如here所述(在这种情况下是一个工具提示,在我的情况下是一个弹出窗口)。
我有两个问题:
1.水平调整箭头以正确指向标签。
1.箭头未正确绘制,其下方显示一条黑线。请参见下图:
1条答案
按热度按时间mfpqipee1#
您应该扩展Popup以方便地实现所需的行为。我建议在内部将
Popup.Placement
设置为PlacementMode.Custom
以启用自定义定位。这使您可以轻松访问定位上下文,以便检测放置目标何时位于屏幕右侧(换句话说,
Popup
与父Window
右对齐)。箭头框和工具提示内容应由自定义控件承载。
若要正确绘制箭头方块,您应该建立并绘制几何图形,例如覆写自订控件的
UIElement.OnRender
。为了简单起见,下面的示例只支持右下角的位置。您可以按照简单的模式扩展功能以支持其他定位(阅读代码中的注解):
我的工具提示内容.cs
该自定义控件组成
Popup
的实际内容,负责绘制可视的几何图形。一般.xaml