Información general de información sobre herramientas

Una información sobre herramientas es una pequeña ventana emergente que aparece cuando el usuario detiene el puntero del mouse sobre un elemento, por ejemplo sobre un control Button. En este tema se presenta la información sobre herramientas y se aborda cómo crear y personalizar el contenido de la información sobre herramientas.

Este tema contiene las secciones siguientes.

  • ¿Qué es la información sobre herramientas?
  • Crear una información sobre herramientas
  • Utilizar las propiedades de las clases ToolTip y ToolTipService
  • Aplicar estilos a una información sobre herramientas
  • Utilizar las propiedades de intervalo de tiempo de ToolTipService
  • Temas relacionados

¿Qué es la información sobre herramientas?

Cuando el usuario mueve el puntero del mouse sobre un elemento que tiene información sobre herramientas, aparece una ventana que contiene el contenido de la información sobre herramientas (por ejemplo, contenido de texto que describe la función de un control) durante un periodo específico de tiempo. Si el usuario aleja el puntero del mouse del control, la ventana desaparece porque el contenido de la información sobre herramientas no puede recibir el foco.

El contenido de la información sobre herramientas puede constar de una o varias líneas de texto, imágenes, formas u otro contenido visual. Para definir la información sobre herramientas de un control, establezca una de las propiedades siguientes en el contenido de la información sobre herramientas.

La propiedad que utilice depende de si el control que define la información sobre herramientas hereda de la clase FrameworkContentElement o FrameworkElement.

Crear una información sobre herramientas

En el ejemplo siguiente se muestra cómo crear una información sobre herramientas simple estableciendo la propiedad ToolTip de un control Button en una cadena de texto.

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

También puede definir la información sobre herramientas como un objeto ToolTip. En el ejemplo siguiente se utiliza XAML para especificar un objeto ToolTip como la información sobre herramientas de un elemento TextBox. Observe que en el ejemplo se especifica el objeto ToolTip estableciendo la propiedad 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>

En el ejemplo siguiente se utiliza código para generar un objeto ToolTip. En el ejemplo se crea un objeto ToolTip (tt) que se asocia a un control 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)
button = new Button();
button.Content = "Hover over me.";
tt = new ToolTip();
tt.Content = "Created with C#";
button.ToolTip = tt;
cv2.Children.Add(button);

También puede crear contenido de información sobre herramientas que no se defina como un objeto ToolTip incluyendo el contenido de la información sobre herramientas en un elemento de diseño, como un control DockPanel. En el ejemplo siguiente se muestra cómo establecer la propiedad ToolTip de un control TextBox en contenido incluido en un control DockPanel.

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

Utilizar las propiedades de las clases ToolTip y ToolTipService

Puede personalizar el contenido de la información sobre herramientas estableciendo propiedades visuales y aplicando estilos. Si define el contenido de la información sobre herramientas como un objeto ToolTip, podrá establecer las propiedades visuales del objeto ToolTip. De lo contrario, debe establecer las propiedades asociadas equivalentes en la clase ToolTipService.

Si desea ver un ejemplo de cómo establecer las propiedades para especificar la posición del contenido de la información sobre herramientas utilizando las propiedades ToolTip y ToolTipService, vea Cómo: Situar una información sobre herramientas.

Aplicar estilos a una información sobre herramientas

Puede aplicar estilos a un control ToolTip definiendo un objeto Style personalizado. En el ejemplo siguiente se define un objeto Style denominado Simple que muestra cómo desplazar la posición del objeto ToolTip y cambiar su apariencia estableciendo las propiedades Background, Foreground, FontSize y 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>

Utilizar las propiedades de intervalo de tiempo de ToolTipService

La clase ToolTipService proporciona las propiedades siguientes para establecer los tiempos de presentación de la información sobre herramientas: InitialShowDelay, BetweenShowDelay y ShowDuration.

Utilice las propiedades InitialShowDelay y ShowDuration para especificar el tiempo, normalmente breve, que debe transcurrir hasta que aparezca un control ToolTip y también para especificar cuánto tiempo permanece visible el control ToolTip. Para obtener más información, vea Cómo: Retardar la presentación de una información sobre herramientas.

La propiedad BetweenShowDelay determina si la información sobre herramientas de los diferentes controles aparece sin retraso inicial al moverse rápidamente el puntero del mouse entre ellos. Para obtener más información sobre la propiedad BetweenShowDelay, vea Cómo: Usar la propiedad BetweenShowDelay.

En el ejemplo siguiente se muestra cómo establecer estas propiedades para una información sobre herramientas.

      <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>

Vea también

Referencia

ToolTipService

ToolTip

ToolTipEventArgs

ToolTipEventHandler

Otros recursos

Temas "Cómo..." de información sobre herramientas