Xceed DataGrid for WPF v7.2 Documentation
Displaying a Scroll Tip
Welcome to Xceed DataGrid, Editors, and 3D Views for WPF v7.2 > Xceed DataGrid for WPF > Code Snippets > Displaying a Scroll Tip

The following example demonstrates how to display a scroll tip whose content and location have been modified.

The "flagConverter" resource represents a converter that is used to return the appropriate BitmapImage according to the value of the ShipCountry cell.

XAML
Copy Code
<Grid>

  <Grid.Resources>

    <xcdg:DataGridCollectionViewSource x:Key="cvs_orders"

                                       Source="{Binding Source={x:Static Application.Current},

                                                        Path=Orders}"

                                       AutoCreateItemProperties="False">

      <xcdg:DataGridCollectionViewSource.ItemProperties>

        <xcdg:DataGridItemProperty Name="ShipCountry"/>

        <xcdg:DataGridItemProperty Name="ShipCity"/>

        <xcdg:DataGridItemProperty Name="ShipAddress"/>

        <xcdg:DataGridItemProperty Name="ShipPostalCode"/>

        <xcdg:DataGridItemProperty Name="ShipName"/>

        <xcdg:DataGridItemProperty Name="OrderDate"/>

        <xcdg:DataGridItemProperty Name="ShippedDate"/>

        <xcdg:DataGridItemProperty Name="Freight"/>

        </xcdg:DataGridCollectionViewSource.ItemProperties>

      </xcdg:DataGridCollectionViewSource>

    <local:FlagPathConverter x:Key="flagConverter"/>

    <Style TargetType="{x:Type xcdg:ScrollTip}">

      <Setter Property="HorizontalAlignment"

              Value="Center"/>

      <Setter Property="VerticalAlignment"

              Value="Center"/>

      <Setter Property="Width"

              Value="150"/>

      <Setter Property="Height"

              Value="125"/>

    </Style>

  </Grid.Resources>

  <xcdg:DataGridControl x:Name="OrdersGrid"

                        ItemsSource="{Binding Source={StaticResource cvs_orders}}">

    <xcdg:DataGridControl.Columns>

      <xcdg:Column FieldName="ShipCountry"

                   IsMainColumn="True">

        <xcdg:Column.CellContentTemplate>

          <DataTemplate>

            <Image Source="{Binding Converter={StaticResource flagConverter}}"

                   StretchDirection="DownOnly"/>

          </DataTemplate>

        </xcdg:Column.CellContentTemplate>

      </xcdg:Column>

    </xcdg:DataGridControl.Columns>

    <xcdg:DataGridControl.View>

      <xcdg:TableView ShowScrollTip="True">

        <xcdg:TableView.ScrollTipContentTemplate>

          <DataTemplate>

            <Grid>

              <Image Source="{Binding Path=[ShipCountry], Converter={StaticResource flagConverter}}"/>

              <TextBlock Text="{Binding Path=[ShipCountry]}"

                         FontSize="14"

                         FontWeight="UltraBold"

                         HorizontalAlignment="Center"

                         VerticalAlignment="Center"/>

           </Grid>

          </DataTemplate>

        </xcdg:TableView.ScrollTipContentTemplate>

      </xcdg:TableView>

    </xcdg:DataGridControl.View>

  </xcdg:DataGridControl>

</Grid>