Question

我在“Carousel”中有几个项目（以矩形的形式）（这也基本上只是一个奇特的PathListBox）

当鼠标悬停在其中一个矩形上时，会出现带有一些信息的工具提示。矩形的外观由DataTemplate决定。此DataTemplate的xaml的开头显示在此处：

<Carousel:CarouselControl.DataTemplateToUse>
<DataTemplate>
    <Grid ShowGridLines="True">
          <Grid.ToolTip>
              <ToolTip Placement="Right" 
                      PlacementRectangle="50,0,0,0"
                      HorizontalOffset="10" 
                      VerticalOffset="20"
                      HasDropShadow="false"
                      PlacementTarget="{Binding ElementName=Box512}"
                      >
                      <BulletDecorator>                                                   
                            <TextBlock Text="{Binding Text}"/>
                      </BulletDecorator>
              </ToolTip>
        </Grid.ToolTip>

        //further xaml code defining the DataTemplate

为了完整起见，这是“Box512”的xaml：

      <Border x:Name="Box512" Grid.Row="2" Grid.Column="1"  Grid.RowSpan="4" 
                    Grid.ColumnSpan="2" BorderThickness="0" Opacity="0.5">
            <Image>
                <Image.Style>
                    <Style TargetType="Image">
                        <Setter Property="Source" Value="Resources/Box512.ico"/>
                    </Style>
                </Image.Style>
            </Image>
        </Border>

工具提示应该显示在页面左下角的一个固定位置，靠近名为“Box512”的XAML元素。

为此，我使用了工具提示的“PlacementTarget”属性。我试过了（正如你在上面的代码中看到的那样）：

 PlacementTarget="{Binding ElementName=Box512}"

这不起作用。在页面的左下角，工具提示仍然显示在鼠标悬停的矩形上。然后我尝试了：

        PlacementTarget="{x:Bind Box512}"

......这也不起作用。

所以我的问题是：如何使工具提示出现在Box512附近的相同位置，与我的鼠标悬停在哪个矩形上无关？

****************************附加资料***************** ******

MainWindow.xaml：

<Carousel:CarouselControl x:Name="CarouselControl"                                                             
                       ScaleRange="1.0,1.0" 
                       MaxNumberOfItemsOnPath="4"  
                       SelectedItem="{Binding CurrentData,Mode=TwoWay}"
                       SelectionChanged="CarouselControl_SelectionChanged"
                       ItemsSource="{Binding GraphItems}"      
                       CustomPathElement="{Binding ElementName=customPath}">

<Carousel:CarouselControl.DataTemplateToUse>
     <DataTemplate>

   with this line of code the text inside the tooltip would get displayed BUT 
   the tooltip would not be in the desired location: 

   <!--<Grid ShowGridLines="True">-->

  with this line of code the tooltip is empty but the tooltip 
  is displayed in the desired location: 

      <Grid ShowGridLines="True" ToolTipService.PlacementTarget="{Binding 
      ElementName=Box512}">        

          <Grid.ToolTip>
            <ToolTip Placement="Right" 
                PlacementRectangle="50,0,0,0"
                HorizontalOffset="10" 
                VerticalOffset="20"
                HasDropShadow="false">
                     <BulletDecorator>
                          <BulletDecorator.Bullet>
                              <Ellipse Height="10" Width="20" Fill="Blue"/>
                          </BulletDecorator.Bullet>                         
                          <TextBlock Text="{Binding Text}"/>
                     </BulletDecorator>
             </ToolTip>
         </Grid.ToolTip>

        //further xaml code defining the DataTemplate 

      </Grid>
    </DataTemplate>
  </Carousel:CarouselControl.DataTemplateToUse>
</Carousel:CarouselControl>

MainWindow.cs：

public partial class MainWindow : Window
{
     ///View Model for MainWindow.
     private ViewModels.MainWindowVM mainViewModel = null;


    public MainWindow()
    {
        InitializeComponent();
        //Initialize View Model
        mainViewModel = new ViewModels.MainWindowVM();
        //Set it as Data Context
        this.DataContext = mainViewModel;

        //Close-Event bound
        mainViewModel.RequestClose += delegate 
            (object sender, EventArgs e) { this.Close(); };
    }

}

GraphItems列表被定义为MainViewModel的属性：

 private List<GraphNode> _GraphItems;
    public List<GraphNode> GraphItems
    {
      get { return _GraphItems; }
      private set
      {
        _cGraphItems = value;
        this.RaisePropertyChangedEvent("GraphItems");
      }
    }

“Text”属性与GraphNode类相关联：

GraphNode.cs：

public class GraphNode : ObservableObject
  {
      ///GENERAL INFORMATION
        private string _Text;
        public string Text { 
           get { return _Text; } 
           set { _Text = value; this.RaisePropertyChangedEvent("Text"); } 
      }

     //more code

  }

Answer 1

您应该使用TooltipService指定展示位置目标：

    <TextBlock Text="Header"  Grid.Row="0" Background="Green" Margin="0,0,0,0" ToolTipService.PlacementTarget="{Binding ElementName=Box512}">
        <TextBlock.ToolTip>
          <ToolTip Placement="Right" 
                  PlacementRectangle="50,0,0,0"
                  HorizontalOffset="10" 
                  VerticalOffset="20"
                  HasDropShadow="false"
                  >
                  <BulletDecorator>                                                   
                        <TextBlock Text="This is the tooltip text"/>
                  </BulletDecorator>
          </ToolTip>
        </TextBlock.ToolTip>
    </TextBlock>

如何使工具提示出现在固定位置（在这种情况下：页面的左下角）

1 个答案: