Partager via


Comment : positionner une info-bulle

Mise à jour : novembre 2007

Cet exemple montre comment spécifier la position d'une info-bulle sur l'écran.

Exemple

Vous pouvez positionner une info-bulle à l'aide d'un jeu de cinq propriétés définies dans les classes ToolTip et ToolTipService. Le tableau suivant montre ces deux jeux de cinq propriétés et fournit des liens vers leur documentation de référence selon la classe.

Propriétés des info-bulles correspondantes selon la classe

Propriétés de classe System.Windows.Controls.ToolTip

Propriétés de classe System.Windows.Controls.ToolTipService

ToolTip.Placement

ToolTipService.Placement

ToolTip.PlacementTarget

ToolTipService.PlacementTarget

ToolTip.PlacementRectangle

ToolTipService.PlacementRectangle

ToolTip.HorizontalOffset

ToolTipService.HorizontalOffset

ToolTip.VerticalOffset

ToolTipService.VerticalOffset

Si vous définissez le contenu d'une info-bulle à l'aide d'un objet ToolTip, vous pouvez utiliser les propriétés de l'une ou l'autre des classes ; toutefois, les propriétés ToolTipService sont prioritaires. Utilisez les propriétés ToolTipService pour les info-bulles qui ne sont pas définies en tant qu'objets ToolTip.

Les illustrations suivantes montrent comment positionner une info-bulle à l'aide de ces propriétés. Bien que les exemples XAML (Extensible Application Markup Language) de ces illustrations montrent comment définir les propriétés définies par la classe ToolTip, les propriétés correspondantes de la classe ToolTipService suivent les mêmes règles de disposition. Pour plus d'informations sur les valeurs possibles de la propriété Placement, consultez Comportement de positionnement de Popup.

Positionnement d'une info-bulle à l'aide de la propriété Placement

Positionnement de ToolTip

Positionnement d'une info-bulle à l'aide des propriétés Placement et PlacementRectangle

Positionnement d'un ToolTip à l'aide d'un rectangle de positionnement

Positionnement d'une info-bulle à l'aide des propriétés Placement, PlacementRectangle et Offset

Diagramme de positionnement de ToolTip

L'exemple suivant montre comment utiliser les propriétés ToolTip pour spécifier la position d'une info-bulle dont le contenu est un objet ToolTip.

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

//Create an ellipse that will have a 
//ToolTip control. 
Ellipse ellipse1 = new Ellipse();
ellipse1.Height = 25;
ellipse1.Width = 50;
ellipse1.Fill = Brushes.Gray;
ellipse1.HorizontalAlignment = HorizontalAlignment.Left;

//Create a tooltip and set its position.
ToolTip tooltip = new ToolTip();
tooltip.Placement = PlacementMode.Right;
tooltip.PlacementRectangle = new Rect(50, 0, 0, 0);
tooltip.HorizontalOffset = 10;
tooltip.VerticalOffset = 20;

//Create BulletDecorator and set it
//as the tooltip content.
BulletDecorator bdec = new BulletDecorator();
Ellipse littleEllipse = new Ellipse();
littleEllipse.Height = 10;
littleEllipse.Width = 20;
littleEllipse.Fill = Brushes.Blue;
bdec.Bullet = littleEllipse;
TextBlock tipText = new TextBlock();
tipText.Text = "Uses the ToolTip class";
bdec.Child = tipText;
tooltip.Content = bdec;

//set tooltip on ellipse
ellipse1.ToolTip = tooltip;

L'exemple suivant montre comment utiliser les propriétés ToolTipService pour spécifier la position d'une info-bulle dont le contenu n'est pas un objet ToolTip.

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

//Create and Ellipse with the BulletDecorator as 
//the tooltip 
Ellipse ellipse2 = new Ellipse();
ellipse2.Name = "ellipse2";
this.RegisterName(ellipse2.Name, ellipse2);
ellipse2.Height = 25;
ellipse2.Width = 50;
ellipse2.Fill = Brushes.Gray;
ellipse2.HorizontalAlignment = HorizontalAlignment.Left;

//set tooltip timing
ToolTipService.SetInitialShowDelay(ellipse2, 1000);
ToolTipService.SetBetweenShowDelay(ellipse2, 2000);
ToolTipService.SetShowDuration(ellipse2, 7000);

//set tooltip placement

ToolTipService.SetPlacement(ellipse2, PlacementMode.Right);

ToolTipService.SetPlacementRectangle(ellipse2,
    new Rect(50, 0, 0, 0));

ToolTipService.SetHorizontalOffset(ellipse2, 10.0);

ToolTipService.SetVerticalOffset(ellipse2, 20.0);


ToolTipService.SetHasDropShadow(ellipse2, false);

ToolTipService.SetIsEnabled(ellipse2, true);

ToolTipService.SetShowOnDisabled(ellipse2, true);

ellipse2.AddHandler(ToolTipService.ToolTipOpeningEvent,
    new RoutedEventHandler(whenToolTipOpens));
ellipse2.AddHandler(ToolTipService.ToolTipClosingEvent,
    new RoutedEventHandler(whenToolTipCloses));

//define tooltip content
BulletDecorator bdec2 = new BulletDecorator();
Ellipse littleEllipse2 = new Ellipse();
littleEllipse2.Height = 10;
littleEllipse2.Width = 20;
littleEllipse2.Fill = Brushes.Blue;
bdec2.Bullet = littleEllipse2;
TextBlock tipText2 = new TextBlock();
tipText2.Text = "Uses the ToolTipService class";
bdec2.Child = tipText2;
ToolTipService.SetToolTip(ellipse2, bdec2);
stackPanel_1_2.Children.Add(ellipse2);

Voir aussi

Tâches

Comment : activer un ContextMenu sur un contrôle désactivé

Concepts

Vue d'ensemble de l'info-bulle

Référence

ToolTip

ToolTipService

Autres ressources

Rubriques Comment relatives aux info-bulles