silverlight 4图像预览从datagrid上的工具提示 [英] silverlight 4 image preview from tooltip on datagrid

问题描述

我目前有一个datagrid，根据服务器文件结构从数据库中获取结果。因此，我们创建PDF和PPT，将它们加载到目录中，并相应地将它们添加到该数据库。然后用户可以搜索他们需要的内容，结果显示在我的数据网格中。有两列具有与该特定片段的每个PDF和PPT相关的图像超链接按钮。

然后，当用户单击PDF图标或PPT图标时，它会带来在另一个窗口中的高分辨率片段。那里没有问题，但是现在我想要它，以便当用户将鼠标悬停在图标上时，它会启动一个预览。我可以将图像硬编码到工具提示中没有问题。所以在这方面，我们创建了每个PDF / PPT的缩略图预览图像。它们的大小都正确，准备好了，我只需要将该位置绑定到工具提示，以便它基本上显示每个高分辨率文档的缩略图预览。

这是我的XAML：

 < sdk：DataGridTemplateColumn x：Name =imageColPdfHeader =PDFWidth = SizeToHeaderIsReadOnly =False> 
< sdk：DataGridTemplateColumn.CellTemplate> 
< DataTemplate> 
< HyperlinkBut​​ton Horizo​​ntalAlignment =CenterVerticalAlignment =CenterDataContext ={Binding Path = FileName}Click =HyperlinkBut​​tonPDF_Click> 
< Image Source =/ PrintOnDemand; component / Images / 16x16 / page_white_acrobat.pngStretch =NoneHorizo​​ntalAlignment =Center>< / Image> 
< ToolTipService.ToolTip> 
< ToolTip> 
< ToolTip.Content> 
< Image DataContext ={Binding Path = FileName}Name =LoadPDFImageLoaded =PDFImageToolTip/> 
< /ToolTip.Content> 
< / ToolTip> 
< /ToolTipService.ToolTip> 
< / HyperlinkBut​​ton> 
< / DataTemplate> 
< / sdk：DataGridTemplateColumn.CellTemplate> 
< / sdk：DataGridTemplateColumn> 
  

然后，这里是加载图像事件的工具提示代码：

  private void PDFImageToolTip（object sender，RoutedEventArgs e）
 {
 
 string docname =（（System.Windows.FrameworkElement ）（（e.OriginalSource as Image）.DataContext））。ToString（）; 
 string baseUri =http：// localhost：51840 / ShowDocument.aspx？DocumentName =+ docname +& type = pdfjpg 
 var hostingWindow = HtmlPage.Window; 
 hostingWindow.Navigate（new Uri（baseUri，UriKind.Absolute），_blank）; 
} 
  

我在点击事件上做了这个方法来调用高分辨率文档，但是当我尝试通过工具提示加载图像时，每次调试（System.NullReferenceException）并且对象引用未设置为对象的实例时，我收到错误。
似乎无法获取图像的正确文件名/源路径。它每次都在字符串docname上失败。好的，我的问题是，如何让它正确地浏览并显示我们已经设置的图像。

解决方案

在调用ToString（）之前，您正在将DataContext转换为FrameworkElement？ b
$ b

string docname =（（System.Windows.FrameworkElement）（（e.OriginalSource as Image）.DataContext））ToString（）;

此处理程序中的发件人也应该是您的Image实例。这可能会更好地为您服务：

  String docname =（（FrameworkElement）sender）.DataContext.ToString（）
  

接下来，HyperLinkBut​​ton上的DataContext绑定当然不会对您有任何好处。你应该完全删除它。目前，Binding将在FileName字符串中寻找FileName属性。

或者，从Image中删除DataContext绑定，它应该可以工作。

I currently have a datagrid that goes and gets results from my database based on a server file structure. So, we create PDFs and PPTs, load them into the directory, and add them to that database accordingly. Then a user can search for what they need and the results get displayed in my datagrid. There are two columns that have image hyperlink buttons relating to each PDF and PPT for that particular piece.

Then, when a user clicks the PDF icon or PPT icon, it brings up the high-res piece in another window. No problems there, but now I want it so that when a user hovers over the icon, it brings up a preview of the high res piece inside the tooptip. I can hard code images into the tooltip no problem. So in that aspect we created little thumbnail preview images of each PDF/PPT. They are all sized correctly and ready to go, I just need to bind the location to the tooltip so that it basically shows a 'thumbnail' preview for each high-res document.

Here is my XAML:

<sdk:DataGridTemplateColumn x:Name="imageColPdf" Header="PDF" Width="SizeToHeader" IsReadOnly="False">
   <sdk:DataGridTemplateColumn.CellTemplate>
           <DataTemplate>
               <HyperlinkButton HorizontalAlignment="Center" VerticalAlignment="Center" DataContext="{Binding Path=FileName}" Click="HyperlinkButtonPDF_Click" >
                     <Image Source="/PrintOnDemand;component/Images/16x16/page_white_acrobat.png" Stretch="None"  HorizontalAlignment="Center" ></Image>
                          <ToolTipService.ToolTip>
                              <ToolTip>
                                   <ToolTip.Content>
                                       <Image DataContext="{Binding Path=FileName}" Name="LoadPDFImage" Loaded="PDFImageToolTip"/>
                                   </ToolTip.Content>
                               </ToolTip>
                           </ToolTipService.ToolTip>
                       </HyperlinkButton>
                   </DataTemplate>
               </sdk:DataGridTemplateColumn.CellTemplate>
           </sdk:DataGridTemplateColumn>

Then here is the code-behind for the tooltip loaded image event:

private void PDFImageToolTip(object sender, RoutedEventArgs e)
    {

        string docname = ((System.Windows.FrameworkElement)((e.OriginalSource as Image).DataContext)).ToString();
        string baseUri = "http://localhost:51840/ShowDocument.aspx?DocumentName=" + docname + "&type=pdfjpg";
        var hostingWindow = HtmlPage.Window;
        hostingWindow.Navigate(new Uri(baseUri, UriKind.Absolute), "_blank");
    }

I did this method on the click event to call the high res documents, but when i try to load the images through the tooltip, I am getting an error every time I debug (System.NullReferenceException) and object reference not set to an instance of an object. It seems to not be able to get the correct filename/source path of the image. It fails every time on the string docname. Ok so, my question is, how can I get it to properly go through and display the image we already have set up.

解决方案

It looks like you are casting DataContext to a FrameworkElement before calling ToString(), Is that intended?

string docname = ((System.Windows.FrameworkElement)((e.OriginalSource as Image).DataContext)).ToString();

Also sender in this handler should be your Image instance. Perhaps this will serve you better:

String docname = ((FrameworkElement)sender).DataContext.ToString()

Next, the DataContext Binding on HyperLinkButton is certainly not doing you any favours. You should remove it altogether. Presently, the Binding will be looking for a FileName property on your FileName string.

Alternatively, remove the DataContext binding from Image and it should work.

这篇关于silverlight 4图像预览从datagrid上的工具提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！