82

¿How can I add a breakline to a text inside a tooltip in XAML?

I try with this:

        <Label Name="label4" UseLayoutRounding="False" Focusable="False" AllowDrop="False" Foreground="Black" Margin="6,44,132.027,76" ToolTipService.ShowDuration="12000">
                <Label.ToolTip>
                    <ToolTip>
                    <TextBlock>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </TextBlock>
                    <TextBlock>Suspendisse eget urna eget elit ullamcorper tincidunt. Sed nec arcu sed ante sodales </TextBlock>
                    <TextBlock>Pellentesque elit libero, semper ac tincidunt vitae, euismod at ligula.</TextBlock>
                    </ToolTip>
                </Label.ToolTip>
            <Label.Content>
                <TextBlock TextAlignment="Right" TextWrapping="Wrap" Height="19" Width="108" >Lorem Ipsum</TextBlock>
            </Label.Content>
        </Label>

But doesn't works:

Galled
  • 4,146
  • 2
  • 28
  • 41

11 Answers11

130

Another approach that I find useful is to embed &#x0a; in the tooltip. The Tooltip will then have a Linebreak at this point. For example

ToolTip="Host name or IP address of the server. Click the &#x0a;Find Server button to help obtain the correct entry."

This allows the xaml code to be more concise, but perhaps less readable. More details at Newline in string attribute.

Vimes
  • 10,577
  • 17
  • 66
  • 86
ausadmin
  • 1,628
  • 1
  • 12
  • 5
  • 1
    what if I want to display as a text in the tooltip? – Tk1993 Jul 25 '17 at 09:24
  • @TusharKukreti XAML is just using entities like XML/HTML does, so knowing this, it should be easy to figure out that all you need to do is escape the `&` character using `&` (ampersand) to get `&#x0a;`. – James Wilkins Nov 29 '17 at 04:23
  • 1
    @Tk1993 Why would you want to display that as literal text? Have you ever had an actual need to do anything like that? – EJoshuaS - Stand with Ukraine Nov 28 '18 at 16:49
  • The disadvantage of that is when you are formatting your code and you add a new line in your code by pressing Enter when ToolTip text is quite long and you want to break it up to several lines this would cause problems such as adding lots of whitespace into the displayed text. But for short ToolTips it's nice and concise. – Piotr Golacki Nov 12 '21 at 14:49
96
<Label>
  <Label.ToolTip> 
     <TextBlock>
          Lorem ipsum dolor sit amet,
          <LineBreak /> 
          consectetur adipiscing elit. 
      </TextBlock> 
  </Label.ToolTip> 
</Label>
  ....
S. Dixon
  • 842
  • 1
  • 12
  • 26
HCL
  • 36,053
  • 27
  • 163
  • 213
  • Your answer and Rachel's answer works, but I don't know wich is better. – Galled Nov 17 '11 at 16:45
  • 1
    @Galled: Depends on what you want to do. If you only want to have some text formatted with cr, the mine is the better. You will have less trouble with formatting (Line Distances, auto-Cr etc.). However there are situations where you want explicitely more than one TextBlock. In this case, Rachel's solution is better. It's dependengin on the target. For your XAML-example I would cleary only take one TextBlock. – HCL Nov 17 '11 at 16:48
  • Hey Chris (and everyone). Good that I have found this question and answer. You see, as I'm using localization, and I'm dynamically loading everything from it, how can I insert a line into this tooltip? See for instance: `comboBoxItemLightTheme.ToolTip = Lang.Language.toolTipVisualComboBoxThemeLight_PT;` Which is loading from a resource a string, let's say this tooltip has: `Bacon ipsum dolor sit amet tri-tip boudin drumstick brisket leberkas pork loin shank`. How can I add a newline after "Shank", for instance? – Malavos May 05 '14 at 21:23
  • 1
    A caveat: should be `ParentTag.ToolTip` as in `Label.ToolTip`. – S. Dixon Nov 05 '14 at 21:11
  • @Malavos ask that in a [new question](http://stackoverflow.com/questions/ask). :) – ANeves May 18 '15 at 15:49
  • `LineBreak` cannot be used inside `TextBox ToolTip` – Zam Sep 12 '19 at 14:19
28

More compact:

<Label TooTip="Line1 &#10; Line2" />
Nicolas
  • 6,289
  • 4
  • 36
  • 51
22

Wrap your items in a StackPanel, which will stack them one on top of the other

What you have now won't compile because ToolTips can only have 1 child object, and you are trying to add 3

<Label Name="label4" UseLayoutRounding="False" Focusable="False" AllowDrop="False" Foreground="Black" Margin="6,44,132.027,76" ToolTipService.ShowDuration="12000">
    <Label.ToolTip>
        <StackPanel>
            <TextBlock>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </TextBlock>
            <TextBlock>Suspendisse eget urna eget elit ullamcorper tincidunt. Sed nec arcu sed ante sodales </TextBlock>
            <TextBlock>Pellentesque elit libero, semper ac tincidunt vitae, euismod at ligula.</TextBlock>
        </StackPanel>
    </Label.ToolTip>
    <Label.Content>
        <TextBlock TextAlignment="Right" TextWrapping="Wrap" Height="19" Width="108" >Lorem Ipsum</TextBlock>
    </Label.Content>
</Label>
Rachel
  • 130,264
  • 66
  • 304
  • 490
  • Which is the benefit of use `` against a simple `` with ``? – Galled Nov 17 '11 at 16:47
  • 5
    @Galled Nothing if you're only working with Text. I actually gave HCL's answer a +1 because it's the correct way to add line breaks to a text field. You'd only want to use a StackPanel if you're mixing other UI Elements, or if you wanted special formatting on each of your lines (I also used it to show why your code example wouldn't compile) – Rachel Nov 17 '11 at 16:55
10

Above answers are only for xaml code. If you want to add new line in CS code , use "Environment.Newline"

label1.ToolTip="Line1" + Environment.NewLine + "Line2";
Tk1993
  • 501
  • 8
  • 21
  • 1
    Quick comment, tried to use this solution today, as I needed to set it in cs, not xaml, and found out that it is miss-spelled: Enviroment lacks one 'n'. It should be `Environment`. Hope you can fix that – Mario Garcia Dec 16 '16 at 13:29
  • 1
    Environment.Newline should be Environment.NewLine (capital L) – Mgamerz Dec 03 '17 at 05:23
4

You can do this :

<Label>
<Label.ToolTip>
    <TextBlock>  
      Line1
      <LineBreak/>
     Line2
  </TextBlock>
</Label.ToolTip>
</Label>
Steven Muhr
  • 3,339
  • 28
  • 46
3

Here’s a variation of the line feed approach:

<Label.ToolTip>
    <TextBlock>
        <Run Text=”Line1”/>
        <LineBreak/>
        <Run Text=”Line2”/>
    </TextBlock>
</Label.ToolTip>

The advantage of this is that each line can have its own style.

  • `LineBreak` cannot be used inside `TextBox --> ToolTip` – Zam Sep 12 '19 at 14:20
  • Yes, I did. If we want to discuss it, we should go to chat room. Comments are wrong place for discussion – Zam Sep 13 '19 at 20:25
  • Show your code, instead. I just tested this in VS2019. If you check the thread, Steven Muir also said the same thing back in 2011. If it doesn’t work in your case, there’s something wrong with your set up. – Paul Demesa Sep 14 '19 at 15:31
  • Zam, are you using any recent version of Visual Studio? Or some third-party XAML tool? If the latter, it’s possible its XAML parser isn’t up to date. This feature has been out for years. Try any Visual Studio community edition, it’s a free download. – Paul Demesa Sep 14 '19 at 17:27
  • No 3rd party tools. VS2017 with latest SP. – Zam Sep 15 '19 at 07:01
  • I tested it with VS2019. And I’ve used this technique since the RUN feature was released years ago. Like I said, show your code and we’ll test it. I still believe there’s something wrong with your set up. What's the exact error message? – Paul Demesa Sep 16 '19 at 09:01
  • there are no error message. just linebreaks does works -- text in tool tip showing in one line. NOTE: I am using `TEXTBOX`, not `TEXTBLOCK`. – Zam Sep 16 '19 at 17:11
  • Jeez, post in the correct place. You're trying to correct a working code, with something that meets a different set of requirements. You confuse people that way. – Paul Demesa Sep 17 '19 at 16:17
2

Even though you are looking for a XAML solution - here another C# solution:

If you plan by any chance to outsource your strings including tooltips to a resource file (.resx) - for example for multi language support - you can literally do line breaks in your values in this resource file e.g. with Shift+Enter and they will also occur in the view.

Niklas S.
  • 329
  • 4
  • 16
2

From the code behind with a binding for example.

You can use this class:

Environment.NewLine

like this:

labelName.Tooltip = $"line1 {Environment.NewLine} line2 {Environment.NewLine} line3";
A. Morel
  • 9,210
  • 4
  • 56
  • 45
1

Although this question is pretty old, someone might stumble along here, searching for a similar problem. This simple code helps with dynamically filled tooltips and is also language and culture aware. What I like most is the fact that you need not know anything about the content of the tooltip, neither its length, nor how many lines might be required to display it nicely:

<Label Content="This label">
    <ToolTipService.ToolTip>
        <TextBlock Text="Long tooltip text, which will wrap, if the tooltip box with iss reached"
                   TextWrapping="Wrap" MaxWidth="300" />
    </ToolTipService.ToolTip>
</Label>

Or inject the text from Resources.resx:

<TextBox Text="{Binding Path=Filepath, UpdateSourceTrigger=PropertyChanged}">
    <ToolTipService.ToolTip>
        <TextBlock Text="{x:Static resources:Resources.Tooltip_Filepath}"
                   TextWrapping="Wrap" MaxWidth="300" />
    </ToolTipService.ToolTip>
</TextBox>

I hope this helps someone.

Roman
  • 503
  • 6
  • 10
0

There is also different approach. You can tell XAML that you want to keep same spacing as you wrote it down. This can be done by setting attribute xml:space="preserve" to parent element - see MSDN page for details.

<Label>
  <Label.ToolTip>
    <ToolTip xml:space="preserve">My main line,
main line on 2nd row.

another line with space in between         and some spacing.</ToolTip>
  </Label.ToolTip> 
</Label>

This allows you to also use new lines, tabs and multiple-spaces next to each other, they won't be removed.

Tatranskymedved
  • 4,194
  • 3
  • 21
  • 47