画布元素中的工具提示

时间:2017-05-11 20:32:19

标签: wpf canvas tooltip

我编写了一个应用程序,用于在画布中绘制元素,如中所述  this other post

我是按照@ grek40的说明做的,效果很好。

现在我想为Canvas中绘制的元素添加工具提示(只有Border类表示的Tasks元素)。这是我的代码:

<DataTemplate DataType="{x:Type local:TaskItem}">
    <Border
    Background="#0074D9"
    BorderBrush="#001F3F"
    BorderThickness="2"
    Width="{Binding Width}"
    Height="{Binding Height}">
        <TextBlock
        Text="{Binding Id}"
        FontSize="20"
        Foreground="White"
        HorizontalAlignment="Center" VerticalAlignment="Center"/>
        <Border.ToolTip>
            <ToolTip Background="#D5F0F0FF">
                <StackPanel>
                    <TextBlock Text="Reading Suggestion" FontWeight="Bold"/>
                    <TextBlock Text="Charles Dickens" Margin="5"/>
                </StackPanel>
            </ToolTip>
        </Border.ToolTip>
    </Border>
</DataTemplate>

但它不起作用。当我悬停Task元素(Border items)时,没有任何反应。任何想法有什么不对?

更新

Grid(x:Name =“grid1”)包含在处理缩放和填充的自定义控件中。我在this post in codeplex之后实现了这个(我遵循了'简单示例代码')。

所以我的xaml看起来像这样:

<ScrollViewer
    x:Name="scroller"
    CanContentScroll="True"
    VerticalScrollBarVisibility="Visible"
    HorizontalScrollBarVisibility="Visible"
    >

    <!--
    This is the control that handles zooming and panning.
    -->
    <ZoomAndPan:ZoomAndPanControl                
        x:Name="zoomAndPanControl"
        Background="LightGray"
        MouseDown="zoomAndPanControl_MouseDown"
        MouseUp="zoomAndPanControl_MouseUp"
        MouseMove="zoomAndPanControl_MouseMove"
        MouseWheel="zoomAndPanControl_MouseWheel"
        >

        <!--
        This Canvas is the content that is displayed by the ZoomAndPanControl.
        Width and Height determine the size of the content.
        -->
        <Grid x:Name="grid1">
            <ItemsControl x:Name="content"
                ItemsSource="{Binding TaskItems}"
                ItemContainerStyle="{StaticResource canvasTaskItemStyle}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <Canvas
                            Background="White"
                            Height="2000"
                            Width="2000"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
            <ItemsControl x:Name="contentLines"
                ItemsSource="{Binding TaskLineItems}">                    
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <Canvas
                            Background="Transparent"
                            Height="2000"
                            Width="2000"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </Grid>
    </ZoomAndPan:ZoomAndPanControl>

</ScrollViewer>

ZoomAndPanControl的命令是否会干扰工具提示?

2 个答案:

答案 0 :(得分:0)

从链接帖子中接受的答案来看,您似乎正在将此模板用于ItemsControl中的项目。 ItemsControl将每个项目放在一个容器中,该容器具有ItemContainerStyle属性定义的容器样式。

尝试将工具提示添加到容器而不是项目,方法是将其添加到ItemContainerStyle。在另一篇文章中,这是canvasTaskItemStyle

<Style x:Key="canvasTaskItemStyle" TargetType="ContentPresenter">
    <Setter Property="Canvas.Left" Value="{Binding CoordX}"/>
    <Setter Property="Canvas.Top" Value="{Binding CoordY}"/>
    <Setter Property="ToolTip">
        <Setter.Value>
            <ToolTip Background="#D5F0F0FF">
                <StackPanel>
                    <TextBlock Text="Reading Suggestion" FontWeight="Bold"/>
                    <TextBlock Text="Charles Dickens" Margin="5"/>
                </StackPanel>
            </ToolTip>
        </Setter.Value>
    </Setter>
</Style>

答案 1 :(得分:0)

您正在网格中覆盖两个不同的itemcontrol。最顶层的控件管理线路,它有Background="Transparent",因此它将捕获所有鼠标流量,底层任务项集合永远不会接收鼠标。

解决方案1(hacky):交换订单或项目和行的Z-Index。

解决方案2(也是hacky):删除阻止背景而不是使其透明(Background="{x:Null}"

解决方案3(不太苛刻):创建一个组合项集合,其中包含数据上下文中的行和任务项,并使用单个画布来呈现它们。

实现解决方案3的一种方法是将代码中的项目组合在一起,另一种方法是使用CompositeCollection

<ItemsControl ...>
    <ItemsControl.ItemsSource>
        <CompositeCollection>
            <CollectionContainer Collection="{Binding TaskItems}"/>
            <CollectionContainer Collection="{Binding TaskLineItems}"/>
        </CompositeCollection>
    </ItemsControl.ItemsSource>
    ...
</ItemsControl>