bes7252

I'd like to bind an Image's datasource to a single element in an XmlDataProvider. Each element in the Xml has a unique ID and the image knows the ID it needs to bind to.

Is there a way to set the binding of my image so it searches for the appropriate element

Brian



Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

neil mosafi

It sounds like it could be possible - can you give an example of what you are trying to achieve




Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

bes7252

I'm creating a poster with a bunch of images on it. Each image has a caption displayed below it, like this:

<UserControl x:Class="PosterBuilder.CaptionImage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<
StackPanel Orientation="Vertical" HorizontalAlignment="Center">
<
Image Width="120" Height="100" Margin="1" Source="{Binding XPath=url}" />
<TextBox Width="80" Height="19" Text="{Binding XPath=caption}"></TextBox>
</
StackPanel>
</UserControl>


The CaptionImages are displayed 2 places: 1) In a ListBox and 2) On the page. The XAML entry for the ListBox is:

<ListBox Grid.Row="0" Background="Beige"
ItemsSource="{Binding Source={StaticResource imageList}, XPath=image }"/>

The XmlDataProvider is:

<XmlDataProvider x:Key="imageList" Source="C:\ImageListSample.xml" IsInitialLoadEnabled="True" XPath="imagelist" />

The contents of ImageListSample.xml is:

<imagelist>
<image>
<imageid>10023</imageid>
<caption>embellishments205.jpg</caption>
<url>c:\\temp\\pets\\dog.jpg</url>
</image>
<image>
<imageid>10024</imageid>
<caption>embellishments205.jpg</caption>
<url>c:\\temp\\pets\\cat.jpg</url>
</image>
</imagelist>

The ListBox works fine because it is bound to the XML. I'd also like to bind controls on the canvas to the XML. Each image is sitting on a Canvas, so they'll have to be individually bound. I can't use a wrappanel for placing images because they're abnormally staggered.

I'm assuming I'll need to use a different UserControl for the ListBox than for the Canvas. This is okay. I just don't know how to set up the binding.





Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

Karl Hulme

Each user control is sat on a canvas, ok. What are the canvas' sat on






Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

bes7252

Here are the controls from Window down to the CaptionImage:

Window->DockPanel->ScrollViewer->Grid->ViewBox->Canvas->CaptionImage





Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

Karl Hulme

And where in that chain is the 1-n relationship

i.e do you have lots of canvas' sat on a single ViewBox,

or lots of ViewBox's sat in various cells on a grid






Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

bes7252

Window->DockPanel->ScrollViewer->Grid->ViewBox->Canvas->CaptionImage

Everything is 1-1 until the very last relationship. There are lots of CaptionImages on the last Canvas--as well as other things (including other Canvas controls if it matters).





Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

Karl Hulme

Ok. i think i'm starting to understand now, you want to bind the image src to the xml element based on the id.  The fundamental problem here is that the XPath support in WPF is limited to literal strings, you can't insert variables, such as the id in your case.  Specifically, you cannot write an xpath query like this:

  <Image Source={Binding XPath=imagelist/image/url[imagelist/image/imageid=@prop]} />

The problem is that there is no way to get that dynamic property (highlighted in red) into it.  Could you put the X/Y co-ordinates of the images into the XML   that would allow us to circumvent the issue above.

 

Scratch that!  Are you populating the Canvas at runtime using code   If so, the limitation above won't apply because you'll know the Id (and hence the entire XPath) at the point that you need to create it.

 






Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

bes7252

Karl,

I'm trying the hardcoded search path, but VS gives me an error:

Error 1 Name/value pairs in MarkupExtensions must have the format 'Name = Value' and each pair is separated by a comma. ' Source={StaticResource imageList},                        XPath=image/url[image/url/imageid=10023] }' does not follow this format. Line 13 Position 4. C:\...DynamicXPath\DynamicXPath\Window1.xaml 13 4 DynamicXPath

Here's my code:

<Window x:Class="DynamicXPath.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DynamicXPath" Height="300" Width="300">

<Window.Resources>
<
XmlDataProvider x:Key="imageList" Source="C:\temp\ImageListSample.xml" IsInitialLoadEnabled="True" XPath="imagelist" />
</
Window.Resources>

<Canvas Width="500" Height="500">
<
Image Canvas.Left="50" Canvas.Top="50" Width="117" Height="135"
Source="{Binding Source={StaticResource imageList},
XPath=image/url[image/url/imageid=10023] }
" />
</
Canvas>
</
Window>

Contents of ImageListSample.xml are:

<imagelist>
  <image>
    <imageid>10023</imageid>
    <accountid>99999</accountid>
    <origfilename>embellishments205.jpg                             </origfilename>
    <origfilewidth>2390</origfilewidth>
    <origfileheight>3582</origfileheight>
    <url>c:\\temp\\pets\\besos.jpg</url>
  </image>
  <image>
    <imageid>10024</imageid>
    <accountid>99999</accountid>
    <origfilename>embellishments205.jpg                             </origfilename>
    <origfilewidth>2390</origfilewidth>
    <origfileheight>3582</origfileheight>
    <url>c:\\temp\\pets\\cash.jpg</url>
  </image>
</imagelist>

Any ideas what this means

Brian





Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

neil mosafi

I think it's your XPath, try

XPath=image/url[image/url/imageid='10023']




Re: Windows Presentation Foundation (WPF) Bind Image to single xmlelement

bes7252

The VS error was due to missing quote marks. Should be:

<Image Canvas.Left="50" Canvas.Top="50" Width="117" Height="135"
Source="
{Binding Source={StaticResource imageList},
XPath='image/url[image/url/imageid=10023]' }
"
/>

That said, the sample still doesn't work.  It compiles, but doesn't show a picture.