XAML - 调试

如果您熟悉任何过程语言(如C#,C/C ++等)的调试,并且您知道 break 的用法,并期望在XAML中进行相同类型的调试,那么您会惊讶地发现,调试XAML代码是不可能的,就像您调试任何其他过程语言代码一样.调试XAML应用程序意味着尝试查找错误;

  • 在数据绑定中,您的数据不会显示在屏幕上你不知道为什么

  • 或者问题与复杂的布局有关.

  • 或对齐问题或边距颜色,叠加等问题与一些广泛的模板,如ListBox和组合框.

调试在XAML中你通常会检查你的绑定是否有效,如果它不起作用,那么就检查一下是什么问题.遗憾的是,除了Silverlight之外,在XAML绑定中设置断点是不可能的,但我们可以使用"输出"窗口来检查数据绑定错误.让我们看一下下面的XAML代码,找出数据绑定中的错误.

<Window x:Class = "DataBindingOneWay.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   Title = "MainWindow" Height = "350" Width = "604">
	
   <Grid>
      <StackPanel Name = "Display">
         <StackPanel Orientation = "Horizontal" Margin = "50, 50, 0, 0">
            <TextBlock Text = "Name: " Margin = "10" Width = "100"/>
            <TextBlock Margin = "10" Width = "100" Text = "{Binding FirstName}"/>
         </StackPanel>
			
         <StackPanel Orientation = "Horizontal" Margin = "50,0,50,0">
            <TextBlock Text = "Title: " Margin = "10" Width = "100"/>
            <TextBlock Margin = "10" Width="100" Text = "{Binding Title}" />
         </StackPanel>
      </StackPanel>
   </Grid>
	
</Window>

两个文本块的文本属性静态设置为"Name"和"Title",而另外两个文本块的Text属性绑定到"FirstName" "和"标题".但是类变量有意地被视为Employee类中的Name和Title,它们是不正确的变量名.现在让我们试着了解当未显示所需输出时我们在哪里可以找到这种类型的错误.

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks;

namespace DataBindingOneWay {
   public class Employee {
      public string Name { get; set; } 
      public string Title { get; set; }
		
      public static Employee GetEmployee() {
         var emp = new Employee() {
            Name = "Ali Ahmed", 
            Title = "Developer"
         };
         return emp; 
      }
   } 
}

以下是C#代码中的MainWindow类的实现 :

using System; 
using System.Windows; 
using System.Windows.Controls;

namespace DataBindingOneWay {
   /// <summary> 
      /// Interaction logic for MainWindow.xaml 
   /// </summary> 
	
   public partial class MainWindow : Window {
      public MainWindow() {
         InitializeComponent(); 
         DataContext = Employee.GetEmployee(); 
      }
   }
}

让我们运行这个应用程序,您可以立即在我们的MainWindow中看到我们已成功绑定到该Employee对象的标题,但名称未绑定.

员工详细信息

要检查名称发生了什么,让我们看看生成大量日志的输出窗口.

查找错误的最简单方法是搜索错误你会发现下面提到的错误,上面写着"BindingExpression路径错误:在'i>'对象'''雇员'上找不到'FirstName'属性

System.Windows.Data Error: 40 : BindingExpression path error: 'FirstName'
   property not found on 'object' ''Employee' (HashCode = 11611730)'.
BindingExpression:Path = FirstName; 
DataItem = 'Employee' (HashCode = 11611730); target element is 'TextBlock' (Name = ''); 
target property is 'Text' (type 'String')

这清楚地表明FirstName不是Employee类的成员,所以它有帮助在您的应用程序中修复此类问题.

当您再次将 FirstName 更改为名称时,您将看到所需的输出.

用于XAML的UI调试工具

Visual Studio 2015引入了用于XAML的UI调试工具,以便在运行时检查XAML代码.在这些工具的帮助下,XAML代码以运行WPF应用程序的可视树形式以及树中的不同UI元素属性的形式呈现.要启用此工具,请按照以下步骤操作.

  • 步骤1 : 转到"工具"菜单,然后从"工具"菜单中选择"选项".

  • 步骤2 : 您将看到以下对话框.

调试对话框

  • 步骤3 : 转到左侧调试项目下的常规选项.

  • 步骤4 : 检查突出显示的选项,即"为XAML启用UI调试工具"

  • 步骤5 : 按OK按钮.

现在运行任何XAML应用程序或使用以下XAML代码 :

<Window x:Class = "XAMLTestBinding.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   Title = "MainWindow" Height = "350" Width = "604">
	
   <StackPanel>
      <ComboBox Name = "comboBox" Margin = "50" Width = "100">
         <ComboBoxItem Content = "Green"/>
         <ComboBoxItem Content = "Yellow" IsSelected = "True"/>
         <ComboBoxItem Content = "Orange" />
      </ComboBox>
		
      <TextBox Name = "textBox" Margin = "50" Width = "100" 
         Height = "23" VerticalAlignment = "Top" Text = "{
         Binding ElementName = comboBox, Path = SelectedItem.Content, 
         Mode = TwoWay, UpdateSourceTrigger = PropertyChanged}" 
         Background = "{Binding ElementName = comboBox, Path = SelectedItem.Content}"> 
      </TextBox>
   </StackPanel>
	
</Window>

当应用程序执行时,它将显示实时可视树,其中所有元素都显示在树中.

Visual Tree

此实时可视树显示完整的布局结构,以了解UI元素的放置位置.但是此选项仅在Visual Studio 2015中可用.如果您使用的是较旧版本的Visual Studio,则无法使用此工具;但是还有另一个工具可以与Visual Studio集成,例如XAML Spy for Visual Studio.您可以从 http://xamlspy.com/download 下载它.如果您使用的是旧版Visual Studio,我们建议您下载此工具.