CODEWITHSUNDEEP
c#xamltooltipwin-universal-app
Cory Roy
Cory Roy

Reputation: 5609

UWP - Creating a data bound tooltip on an image in xaml

I have a data driven hub section that is populating the image just fine. The view model contains text I would like to show as a tooltip, but can't quite figure it out.

Here's the important snippet:

<HubSection x:Uid="MyHub" x:Name="MyHubSection" Width="311">
   <HubSection.Header>
      <TextBlock x:Uid="HubMSectionHeader" 
                 Style="{StaticResource MainHubSectionHeaderStyle}" Text="Friends"/>
   </HubSection.Header>
   <DataTemplate>
      <StackPanel>
         <Button x:Name="InviteButton" Content="Send Invite" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Click="InviteButton_Click"/>
         <StackPanel >
            <Grid>
               <GridView ItemsSource="{Binding Friends}"  Background="{ThemeResource HubBackground}" x:Name="FriendGrid" >
                   <GridView.ItemTemplate >
                       <DataTemplate>
                           <Image Source="{Binding ProfilePhotoBitmap, Mode=TwoWay}" Height="100" Opacity="1" Stretch="Uniform" Tapped="Friend_Tapped"/>
                            <ToolTipService.ToolTip>
                                <TextBlock Text="{Binding FullName}"/>
                            </ToolTipService.ToolTip>
                         </DataTemplate>
                     </GridView.ItemTemplate>
                  </GridView>
               </Grid>
            </StackPanel>
         </StackPanel>
      </DataTemplate>
   </HubSection>

Upvotes: 4

Views: 3830

Answers (1)

Kiran Paul
Kiran Paul

Reputation: 885

I am wondering why the Tooltip service code is outside of the image control could you try inside image control and let me know whether it works or not? modified code snipet will be 

<Image Source="{Binding ProfilePhotoBitmap, Mode=TwoWay}" Height="100" Opacity="1" Stretch="Uniform" Tapped="Friend_Tapped">
            <ToolTipService.ToolTip>
                <TextBlock Text="{Binding FullName}"/>
            </ToolTipService.ToolTip>
            </Image>

Upvotes: 12

Related Questions