Partilhar via

Visão geral da dica de ferramenta

  • Artigo

Uma dica de ferramenta é uma pequena janela pop-up que aparece quando um usuário pausa o ponteiro do mouse sobre um elemento, como sobre um Button. Este tópico apresenta a dica de ferramenta e discute como criar e personalizar o conteúdo da dica de ferramenta.

O que é uma dica de ferramenta

Quando um usuário move o ponteiro do mouse sobre um elemento que tem uma dica de ferramenta, uma janela que contém conteúdo de dica de ferramenta (por exemplo, conteúdo de texto que descreve a função de um controle) aparece por um período de tempo especificado. Se o usuário mover o ponteiro do mouse para longe do controle, a janela desaparece porque o conteúdo da dica de ferramenta não pode receber foco.

O conteúdo de uma dica de ferramenta pode conter uma ou mais linhas de texto, imagens, formas ou outro conteúdo visual. Você define uma dica de ferramenta para um controlo ao atribuir uma das seguintes propriedades ao conteúdo da dica de ferramenta.

A propriedade que você usa depende se o controle que define a dica de ferramenta herda da classe FrameworkContentElement ou FrameworkElement.

Criando uma dica de ferramenta

O exemplo a seguir mostra como criar uma dica de ferramenta simples definindo a propriedade ToolTip para um controle Button para uma cadeia de caracteres de texto.

<Button ToolTip="Click to submit your information" 
        Click="SubmitCode" Height="20" Width="50">Submit</Button>

Você também pode definir uma dica de ferramenta como um objeto ToolTip. O exemplo a seguir usa XAML para especificar um objeto ToolTip como tooltip de um elemento TextBox. Observe que o exemplo especifica o ToolTip definindo a propriedade FrameworkElement.ToolTip.

<TextBox HorizontalAlignment="Left">ToolTip with non-text content
  <TextBox.ToolTip>
    <ToolTip>
      <DockPanel Width="50" Height="70">
        <Image Source="data\flower.jpg"/>
        <TextBlock>Useful information goes here.</TextBlock>
      </DockPanel>
    </ToolTip>
  </TextBox.ToolTip>
</TextBox>

O exemplo a seguir usa código para gerar um objeto ToolTip. O exemplo cria um ToolTip (tt) e o associa a um Button.

button = new Button();
button.Content = "Hover over me.";
tt = new ToolTip();
tt.Content = "Created with C#";
button.ToolTip = tt;
cv2.Children.Add(button);

button = New Button()
button.Content = "Hover over me."
tt = New ToolTip()
tt.Content = "Created with Visual Basic"
button.ToolTip = tt
cv2.Children.Add(button)

Você também pode criar conteúdo de dica de ferramenta que não esteja definido como um objeto ToolTip colocando o conteúdo da dica de ferramenta em um elemento de layout, como um DockPanel. O exemplo a seguir mostra como definir a propriedade ToolTip de um TextBox para o conteúdo que está incluído em um controle DockPanel.

<TextBox>
  ToolTip with image and text
  <TextBox.ToolTip>
       <StackPanel>
        <Image Source="data\flower.jpg"/>
        <TextBlock>Useful information goes here.</TextBlock>
      </StackPanel>
  </TextBox.ToolTip>

Usando as propriedades das classes ToolTip e ToolTipService

Você pode personalizar o conteúdo da dica de ferramenta definindo propriedades visuais e aplicando estilos. Se você definir o conteúdo da dica de ferramenta como um objeto ToolTip, poderá definir as propriedades visuais do objeto ToolTip. Caso contrário, você deve definir propriedades anexadas equivalentes na classe ToolTipService.

Para obter um exemplo de como definir propriedades para especificar a posição do conteúdo da dica de ferramenta usando as propriedades ToolTip e ToolTipService, consulte Posicionar uma dica de ferramenta.

Estilizando uma dica de ferramenta

Você pode formatar um ToolTip definindo um Stylepersonalizado. O exemplo a seguir define um Style chamado Simple que mostra como compensar o posicionamento do ToolTip e alterar sua aparência definindo os Background, Foreground, FontSizee FontWeight.

<Style TargetType="ToolTip">
  <Setter Property = "HorizontalOffset" Value="10"/>
  <Setter Property = "VerticalOffset" Value="10"/>
  <Setter Property = "Background" Value="LightBlue"/>
  <Setter Property = "Foreground" Value="Purple"/>
  <Setter Property = "FontSize" Value="14"/>
  <Setter Property = "FontWeight" Value="Bold"/>
</Style>

Usando as propriedades de intervalo de tempo do ToolTipService

A classe ToolTipService fornece as seguintes propriedades para o utilizador definir os tempos de exibição dos tooltips: InitialShowDelay, BetweenShowDelaye ShowDuration.

Use as propriedades InitialShowDelay e ShowDuration para especificar um atraso, normalmente breve, antes que um ToolTip apareça e também para especificar por quanto tempo um ToolTip permanece visível. Para mais informações, veja Como atrasar a exibição de uma dica de ferramenta.

A propriedade BetweenShowDelay determina se as dicas de ferramentas para controles diferentes aparecem sem um atraso inicial quando você move o ponteiro do mouse rapidamente entre eles. Para obter mais informações sobre a propriedade BetweenShowDelay, consulte Utilizar a propriedade BetweenShowDelay.

O exemplo a seguir mostra como definir essas propriedades para uma dica de ferramenta.

<Ellipse Height="25" Width="50" 
         Fill="Gray" 
         HorizontalAlignment="Left"
         ToolTipService.InitialShowDelay="1000"
         ToolTipService.ShowDuration="7000"
         ToolTipService.BetweenShowDelay="2000">
  <Ellipse.ToolTip>
    <ToolTip Placement="Right" 
             PlacementRectangle="50,0,0,0"
             HorizontalOffset="10" 
             VerticalOffset="20"
             HasDropShadow="false"
             Opened="whenToolTipOpens"
             Closed="whenToolTipCloses"
             >
      <BulletDecorator>
        <BulletDecorator.Bullet>
          <Ellipse Height="10" Width="20" Fill="Blue"/>
        </BulletDecorator.Bullet>
        <TextBlock>Uses the ToolTip Class</TextBlock>
      </BulletDecorator>
    </ToolTip>
  </Ellipse.ToolTip>
</Ellipse>

Ver também