如何添加自定义工具提示列表框项目

Question

我有一个汉堡包菜单与列表框，（图像和菜单项的标题），我将这些数据（图像和标题）的列表绑定到列表框，其优良，我想用Teal背景显示项目标题文本（在鼠标悬停在图像上）的工具提示

Answer 1

如果要在ListViewItem上显示工具提示，请在下面添加ToolTipService。

<ListViewItem Content="Hello" ToolTipService.Placement="Bottom" > 
    <ToolTipService.ToolTip> 
     <Grid> 
      <Rectangle Fill="Teal" /> 
      <TextBlock Text="Hello" Foreground="White" Margin="10"/> 
     </Grid> 
    </ToolTipService.ToolTip> 
</ListViewItem> 

如果你想这样做的DataTemplate

<DataTemplate > 
    <ToolTipService.ToolTip> 
     <Grid> 
      <Rectangle Fill="Teal" /> 
      <TextBlock Text="Hello" Foreground="White" Margin="10"/> 
     </Grid> 
    </ToolTipService.ToolTip> 
</DataTemplate> 

现在你可以看到，工具提示会告诉你蒂尔背景的文本。问题是您的Teal背景周围仍然有褪色的白色边框。

纠正这一点，添加below您Application.Resources在App.xaml

<Application.Resources> 
    <!-- Default style for Windows.UI.Xaml.Controls.ToolTip --> 
    <Style TargetType="ToolTip"> 
     <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" /> 
     <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}" /> 
     <Setter Property="BorderBrush" Value="{ThemeResource SystemControlForegroundChromeHighBrush}" /> 
     <Setter Property="BorderThickness" Value="{ThemeResource ToolTipBorderThemeThickness}" /> 
     <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" /> 
     <Setter Property="FontSize" Value="{ThemeResource ToolTipContentThemeFontSize}" /> 
     <Setter Property="Padding" Value="0" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="ToolTip"> 
        <ContentPresenter x:Name="LayoutRoot" 
        BorderThickness="{TemplateBinding BorderThickness}" 
        Background="{TemplateBinding Background}" 
        BorderBrush="{TemplateBinding BorderBrush}" 
        MaxWidth="320" 
        Content="{TemplateBinding Content}" 
        ContentTransitions="{TemplateBinding ContentTransitions}" 
        ContentTemplate="{TemplateBinding ContentTemplate}" 
        Padding="{TemplateBinding Padding}" 
        TextWrapping="Wrap" > 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="OpenStates"> 
           <VisualState x:Name="Closed"> 
            <Storyboard> 
             <FadeOutThemeAnimation TargetName="LayoutRoot" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Opened"> 
            <Storyboard> 
             <FadeInThemeAnimation TargetName="LayoutRoot" /> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
        </ContentPresenter> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Application.Resources> 

如果你注意到我改变Padding到0。