如何添加自定義工具提示列表框項目

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。