XAML: debug
Se hai familiarità con il debug in qualsiasi linguaggio procedurale (come C #, C / C ++ ecc.) E conosci l'uso di breake ti aspettano lo stesso tipo di debug in XAML, quindi sarai sorpreso di sapere che non è ancora possibile eseguire il debug di un codice XAML come il modo in cui eseguivi il debug di qualsiasi altro codice di linguaggio procedurale. Eseguire il debug di un'app XAML significa cercare di trovare un errore;
Nel data binding, i tuoi dati non vengono visualizzati sullo schermo e non sai perché
Oppure un problema è correlato a layout complessi.
O un problema di allineamento o problemi nel colore dei margini, sovrapposizioni, ecc. Con alcuni modelli estesi come ListBox e casella combinata.
Il debug in XAML è qualcosa che fai in genere per verificare se le tue associazioni funzionano e, se non funziona, per verificare cosa non va. Sfortunatamente, l'impostazione dei punti di interruzione nelle associazioni XAML non è possibile tranne che in Silverlight, ma possiamo usare la finestra di output per verificare la presenza di errori di associazione dei dati. Diamo un'occhiata al seguente codice XAML per trovare l'errore nell'associazione dati.
<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>Le proprietà di testo dei due blocchi di testo sono impostate su "Nome" e "Titolo" staticamente, mentre le proprietà di testo degli altri due blocchi di testo sono vincolate a "Nome" e "Titolo". Ma le variabili di classe sono intenzionalmente prese come nome e titolo nella classe Employee che sono nomi di variabili errati. Cerchiamo ora di capire dove possiamo trovare questo tipo di errore quando l'output desiderato non viene mostrato.
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;
}
}
}Ecco l'implementazione della classe MainWindow nel codice C # -
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();
}
}
}Eseguiamo questa applicazione e puoi vedere immediatamente nella nostra MainWindow che siamo stati associati con successo al titolo di quell'oggetto Employee ma il nome non è associato.
Per verificare cosa è successo con il nome, diamo un'occhiata alla finestra di output in cui viene generato un sacco di log.
Il modo più semplice per trovare un errore è cercare semplicemente l'errore e troverai l'errore indicato di seguito che dice "Errore di percorso BindingExpression: proprietà 'FirstName' non trovata su 'object' '' Employe"
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')Il che indica chiaramente che FirstName non è un membro della classe Employee, quindi aiuta a risolvere questo tipo di problemi nella tua applicazione.
Quando cambi il file FirstName per Name di nuovo, vedrai l'output desiderato.
Strumenti di debug dell'interfaccia utente per XAML
Gli strumenti di debug dell'interfaccia utente per XAML vengono introdotti con Visual Studio 2015 per controllare il codice XAML in fase di esecuzione. Con l'aiuto di questi strumenti, il codice XAML viene presentato sotto forma di albero visivo dell'applicazione WPF in esecuzione e anche le diverse proprietà dell'elemento dell'interfaccia utente nell'albero. Per abilitare questo strumento, seguire i passaggi indicati di seguito.
Step 1 - Vai al menu Strumenti e seleziona Opzioni dal menu Strumenti.
Step 2 - Vedrai la seguente finestra di dialogo.
Step 3 - Vai alle Opzioni generali sotto la voce Debug sul lato sinistro.
Step 4 - Seleziona l'opzione evidenziata, ad esempio "Abilita strumenti di debug dell'interfaccia utente per XAML"
Step 5 - Premere il pulsante OK.
Ora esegui qualsiasi applicazione XAML o usa il codice XAML seguente:
<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>Quando l'applicazione viene eseguita, mostrerà l'albero visivo live in cui tutti gli elementi sono mostrati in un albero.
Questo albero visivo live mostra la struttura completa del layout per capire dove sono posizionati gli elementi dell'interfaccia utente. Ma questa opzione è disponibile solo in Visual Studio 2015. Se stai utilizzando una versione precedente di Visual Studio, non puoi utilizzare questo strumento; tuttavia esiste un altro strumento che può essere integrato con Visual Studio come XAML Spy per Visual Studio. Puoi scaricarlo dahttp://xamlspy.com/download. Ti consigliamo di scaricare questo strumento se stai usando una versione precedente di Visual Studio.