CODEWITHSUNDEEP
c#wpfxamlmvvmtooltip
ajr
ajr

Reputation: 974

How to create a custom tooltip object based on the underlaying GridView column?

Platform

Problem

I have an existing GridView where a single row is representing a device. Every device has unique information (sockets) which I want to display with the tooltip, but this has to be obtained from the database.

Can I somehow create this custom collection with database query before tooltip is shown? This custom content would have to be updated before tooltip is shown.

Idea:

I am thinking something like this approach:

  1. TooltipOpening event
  2. On ViewModel function raised by the event, query the database and create sockets collection
  3. On XAML link the tooltip ListBox control with ViewModels accessible collection.

Is this possible? Also, some concrete examples would be highly appreciated! I am using MVVM and MVVM light framework.

First, try

the XAML:

<telerik:GridViewDataColumn DataMemberBinding="{Binding DeviceName, 
Mode=TwoWay, NotifyOnTargetUpdated=True, 
UpdateSourceTrigger=PropertyChanged}"
              Width="1*"
              MinWidth="200"
              Header="Device name">
<telerik:GridViewDataColumn.ToolTipTemplate>
  <DataTemplate>
    <Grid>
      <StackPanel>
        <TextBlock FontWeight="Bold"
              FontSize="14"
              Margin="2,2,2,5"
              VerticalAlignment="Top">
        Device sockets
       </TextBlock>
      <Border BorderBrush="Silver"
              BorderThickness="0,1,0,0"
              Margin="0,0,0,8"
              Padding="0" />
      <telerik:RadListBox Margin="5,0,5,5"
              BorderThickness="0"
              ItemsSource="{Binding Sockets}"
              ItemTemplate="{StaticResource ResourceKey=ListBoxSocketTemplate}"
              Background="Transparent"
              Grid.IsSharedSizeScope="True" />
        </StackPanel>
      </Grid>
    </DataTemplate>
  </telerik:GridViewDataColumn.ToolTipTemplate>
</telerik:GridViewDataColumn>

I basically need to somehow create this sockets collection every time before tooltip is shown. At the moment sockets collection is not showing all the information I need, therefore I need to create a custom collection and fill it with the necessary information.

Upvotes: 0

Views: 652

Answers (1)

Ahmad
Ahmad

Reputation: 1534

First it seems you are trying to add the tooltip to the column when in the title of your question you specified the row as the target.

Not sure about how your view models are structure but wherever this DeviceName property exists, add another property called SocketsInfo containing info about the sockets -> at the time of accessing the getter of this property you can load from the database. 

public string _SocketInfo;

public string SocketInfo
{
    get
    {
        if(_SocketInfo == null)
        {
            1. load this device sockets from the database - later on apply caching for performance.
            2. format the contents of _SocketInfo string based on the Socket objects returned by 1. 
        }
        return _SocketInfo;
    }
}

For the tooltip when hovering over a row add :

<Style TargetType="telerik:GridViewRow"> 
    <Setter Property="ToolTipService.ToolTip" Value="{Binding SocketInfo}"/>
</Style>

see for more details http://docs.telerik.com/devtools/wpf/controls/radgridview/how-to/create-tooltip

Upvotes: 2

Related Questions