We are going to use a text block. We are going to right click the text control, choose text block and drag one out on the bottom right corner of my grid. Whenever a text block is created by default blend things that you want to put text into it.
I am just going to press escape because the text that is going to be placed in the text block is going to be specified in the data binding. I need to clear my search and I need to look for the text property.
I am now going to click property marker and data binding. This time I am going to choose the third tab, the explicit data context. Now, whatever property I choose is going to be bound to the data context which if you remember from the previous step is bound to the selected item in the list box.
Now, when I expand my fields, I see the same tree of elements but this time I am going to select the price. When I click finished, that text blocks text is bound to the price of the currently selected item. When I press that five, you will see that as I select an item, the text of that text block is filled for me based on the current selected property.
I am going to close this window. In this case, I have created a text block and bound a text to it. Another field that I could add is the images. I am going to the asset library and I am going to search for an image control. I am going to click that and drag one out. I am going to data bind my source of my image the same way that we bound the text of the text block.
I am again going to the explicit data context, expand my sections, my extras, my extra array and choose the image string. I am going to click finished and press the five. When I click the project at this time though, the image does not update. Just take a look at the text of the XML file and see if we can figure out why that happened.
When I edit the XML file, you will see that the image is a relative path to an images folder showing my graphics so I need to add this to my project so that it will show up. The images are in the separate folder for images so I first need to right click the project and choose new folder and name it images. I just click the folder and for the moment, I can type the new name.
In that folder, I am going to right click an existing item and in the lesson five directory are the eight products that we need. I can shift click to add all the products at once. Since, I chose the images folder when I said add new item, all of these will go into the images folder like I want it.
Now, when I press that five, when I select an item from the product list, the image for that item shows up as well. I am still not showing the description for the image so I am going to add one more text block. I am going to add this above my existing image and press escape because it automatically puts me in text edit mode, switch over to my properties tab and bind its text one more time this time by the description.
Finally, when I press up five, the text is displayed. In this case, my text is click off so I need to adjust the height of my two elements. I am going to select my image with the selection tool, bring it down a little bit and expand my description boxes, as well.
Now, when I pressed that five, my project comes up and you will see that it is done. That is it for data binding.
Transcription by:
Scribe4you Transcription Services