LightSwitch Using Tooltips in Controls and DataGrids

lightswitchtooltip

You want a tooltip in a grid when you hover over the grid (you can use this with other controls too):

ToolTipService.SetToolTip(grid, new TextBlock() { Text = "Hello World!!!" });

For other controls just replace “grid” for another control’s name.

You want a tooltip in a grid when you hover over a cell.

ToolTipService.SetToolTip(grid.Columns[0].GetCellContent(row), new TextBlock() { Text = "Hello World!!!" });

Now you want a tooltip in a grid when you hover over a cell but in this case you want to show the contents of the cell as the tooltip.

ToolTipService.SetToolTip(grid.Columns[0].GetCellContent(row), new TextBlock() { Text = (row.DataContext as MyTable).MyProperty });
Where:

  • First parameter is the cell you want to add a tooltip Example: grid.Columns[0] indicates the column (it starts in 0 for the first column)
  • Second parameter is the tooltip. Example, we have an entity “MyTable” with a property called “MyProperty:
    new TextBlock() { Text = (row.DataContext as MyTable).MyProperty }

Finally you want to put a tooltip but it is too long and you end with an incomplete and long line across the screen. You need to split the line in multiple lines using this:

// don't forget this line on top of the file.
using System.Text.RegularExpressions;

Regex rgx = new Regex("(.{50}\\s)");
string WrappedMessage = rgx.Replace((row.DataContext as MyTable).MyProperty, "$1\n");

ToolTipService.SetToolTip(grid.Columns[0].GetCellContent(row), new TextBlock() { Text = WrappedMessage });

The Complete Code (put it on the screen code where the datagrid is located).

Also you’ll need this using System.Windows.Controls;

partial void ScreenName_Created()
{
   this.FindControl("grid").ControlAvailable += ScreenName_ControlAvailable;
}

void ScreenName_ControlAvailable(object sender, ControlAvailableEventArgs e)
{
   var ctrl = e.Control as DataGrid;
   if (ctrl != null)
    {
        ctrl.LoadingRow += ctrl_LoadingRow;
    }
}

void ctrl_LoadingRow(object sender, DataGridRowEventArgs e)
{
    var grid = sender as DataGrid;
    var row = e.Row as DataGridRow;

    // for a general tooltip
    ToolTipService.SetToolTip(grid, new TextBlock() { Text = "Hello World!!!" });

    // for a cell tooltip
    ToolTipService.SetToolTip(grid.Columns[0].GetCellContent(row), new TextBlock() { Text = (row.DataContext as MyTable).MyProperty });
}

The following code splits the tooltip in multiple lines and checks for null in the value (when the property accepts nulls), if it’s null then it doesn’t add the tooltip.

void ctrl_LoadingRow(object sender, DataGridRowEventArgs e)
{
   var grid = sender as DataGrid;
   var row = e.Row as DataGridRow;

    Regex rgx = new Regex("(.{50}\\s)");
    if ((row.DataContext as MyTable).MyProperty != null)
    {
        // split the long line
        string WrappedMessage = rgx.Replace((row.DataContext as MyTable).MyProperty, "$1\n");
        // for a cell tooltip
        ToolTipService.SetToolTip(grid.Columns[0].GetCellContent(row), new TextBlock() { Text = WrappedMessage });
    }
}
Advertisements
This entry was posted in LightSwitch and tagged , , . Bookmark the permalink.

One Response to LightSwitch Using Tooltips in Controls and DataGrids

  1. Billy says:

    This is good stuff! Any tips on setting the duration of a tooltip?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s