Отладка при связывании с данными

Современный отладчик в Visual Studio давно позволяет разработчику получать всю необходимую информацию, если речь идет о коде на C#, C++ или даже JavaScript. Но как только речь заходит о XAML, то тут механизмы отсутствуют. Казалось бы, зачем нужна отладка в XAML, если тут идет декларативное описание интерфейса приложения. Действительно, отладка в XAML не нужна, если речь не идет о связывании с данными. Небольшой кусок кода, связывающий наши данные и интерфейс, может вызвать массу проблем при отладке. Ведь причин для возникновения проблем при связывании может быть множество, это и отсутствие какого-либо свойства, и проблемы с преобразованием либо же несоответствие типа. Но если связывание с данными описывается в XAML, то механизма получить информацию о проблеме не было. В Silverlight 5 возможна отладка XAML кода, описывающего связывание элементов управления и данных.

Рассмотрим небольшой пример кода на XAML:

<UserControl x:Class="SilverlightApplication1.MainPage"
xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation
xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
xmlns:d=http://schemas.microsoft.com/expression/blend/2008
xmlns:mc=http://schemas.openxmlformats.org/markup-compatibility/2006
Loaded="UserControl_Loaded"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">

<Grid x:Name="LayoutRoot" Background="White">
<Grid.Resources>
<Style TargetType="TextBox">
<Setter Property="Background" Value="AliceBlue"></Setter>
<Setter Property="Width" Value="200"></Setter>
<Setter Property="Margin" Value="5"></Setter>
</Style>
<Style TargetType="TextBlock">
<Setter Property="Margin" Value="5"></Setter>
</Style>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Text="First Name:" Grid.Column="0" Grid.Row="0"/>
<TextBlock Text="First Name:" Grid.Column="0" Grid.Row="1"/>
<TextBlock Text="First Name:" Grid.Column="0" Grid.Row="2"/>
<TextBox Grid.Row="0" Grid.Column="1" Text="{Binding FisrtName}"/>
<TextBox Grid.Row="1" Grid.Column="1" Text="{Binding LastName}"/>
<TextBox Grid.Row="2" Grid.Column="1" Text="{Binding Age}"/>
</Grid>
</UserControl>

В результате мы получим небольшую формочку, которая позволяет заполнить три поля. Код, необходимый для работы формы может выглядеть так:

private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
Person p = new Person();
p.FirstName = "Sergey";
p.LastName="Baydachnyy";
p.Age = 33;
LayoutRoot.DataContext = p;
}

И класс Person:

public class Person
{
public string FirstName { get; set; }
public string LastName { get; set; }
public int Age { get; set; }
}

Запустив это приложение, можно убедиться, что первое поле не было заполнено данными. Чтобы понять причину ошибки, достаточно установить Breakpoint в XAML файле на строку, описывающую связывание в первом поле и запустить приложение в режиме отладки. Вот что можно увидеть в окне Locals:

Рисунок 5.6. Отладка XAML в Silverlight 5.

Тут и информация об ошибке (ошибка намеренно сделана в имени поля) и данные об объекте и т. д. То есть, сгенерированный объект BindingState четко позволяет выявить проблему и проверить правильность данных.

Дата добавления: 2015-08-13