Add Support for Users to Update the Data (Optional) (Compact 7)

3/12/2014

In the application UI, you can add support that lets users update data in the data source collection.

For example, an inventory tracking application might display a collection of items. When the user selects an item, the application can populate text boxes or text elements with data about the item. In order for the user to update this data, the application must support user updates to the data.

For modifiable data-bound elements, such as TextBox elements, you can add support for bidirectional updates so that a user’s changes to a data-bound element are transferred to the data source and update the value of the C++ data source property. In Microsoft Silverlight 3, this functionality is known as two-way binding.

For data-bound elements that cannot be modified, such as a TextBlock, you can add C++ functionality that calls TBoundPropertyBase.Set in a derived class to update the data source property based on user interaction.

Add C++ event handling functionality for users to update the data

1. In Platform Builder, open your subproject.

2. In Solution Explorer, expand the subproject, expand Resource files, and then open MainPage.xaml.

3. Create an event-handling method that changes a property of an item in the data source collection:

   1. On the Tools menu, point to Windows Embedded Silverlight Tools, and then click Windows Embedded Events.

   2. In the Windows Embedded Events window, select the UI element to which you want to add an event-handling method.

   3. Locate the event in the list, and double-click in the text field on the right-hand side.

   4. In MainPage.cpp, add functionality that retrieves a data-source object instance and updates its property value based on user interaction.

The following example code shows an event handler that increments the value of a TBoundProperty<int> data source property when the user clicks a button.

#include "MainPage.h"
#include "XRPropertyBag.h"

XRPtr<IntegerPropertyBag>  m_DataSourceObject;

HRESULT MainPage::Increment_Click (IXRDependencyObject* pSender, XRMouseButtonEventArgs* pArgs)
{
    HRESULT hr = E_NOTIMPL;

    if ((NULL == pSender) || (NULL == pArgs))
    {
        hr = E_INVALIDARG;
    }
     TBoundProperty<int>* IntProp;
     iXRPropertyBinding* pProperty = NULL;
     pProperty = m_DataSourceObject->GetPropertyByName(L"IntegerData1");
     
     IntProp = (TBoundProperty<int>*)pProperty;
     int intValue = IntProp->Get();
     intValue = intValue + 1;
     IntProp->Set(intValue);

     // Update layout to see whether the data-bound element is updated
     m_pLayoutRoot->UpdateLayout();

    return hr;
}

Add support for bidirectional updates between a UI element and a property

1. In Expression Blend 3, open the project you created in Create the Expression Blend Project and the Windows Embedded Silverlight Tools Subproject.

2. Find the UI element that you want users to modify with an updated property value (for example, a TextBox).

3. In the Binding Markup Extension for the UI element, add Mode=TwoWay. For example:

   <TextBox x:Name="UserTextData" Height="47" HorizontalAlignment="Right" Margin="0,167,75,0" VerticalAlignment="Top" Width="231" 
   Text="{Binding BinaryStringData1, Mode=TwoWay}" TextWrapping="Wrap" FontSize="16"/>
   

4. Save your changes.

After you update the XAML or the C++ source code to add support for user updates, you must update and build the project in Platform Builder.

See Also

Concepts

Populate a Silverlight for Windows Embedded UI with Collections of Data