WPF - Tổng quan về XAML
Một trong những điều đầu tiên bạn sẽ gặp khi làm việc với WPF là XAML. XAML là viết tắt của Ngôn ngữ đánh dấu ứng dụng có thể mở rộng. Đó là một ngôn ngữ khai báo và đơn giản dựa trên XML.
Trong XAML, rất dễ dàng tạo, khởi tạo và thiết lập các thuộc tính của các đối tượng có quan hệ phân cấp.
Nó chủ yếu được sử dụng để thiết kế GUI, tuy nhiên nó cũng có thể được sử dụng cho các mục đích khác, ví dụ, để khai báo quy trình làm việc trong Workflow Foundation.
Cú pháp cơ bản
Khi bạn tạo dự án WPF mới của mình, bạn sẽ gặp một số mã XAML theo mặc định trong MainWindow.xaml như hình dưới đây.
<Window x:Class = "Resources.MainWindow"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
Title = "MainWindow" Height = "350" Width = "525">
<Grid>
</Grid>
</Window>Tệp XAML ở trên chứa các loại thông tin khác nhau. Bảng sau giải thích ngắn gọn vai trò của từng thông tin.
| Thông tin | Sự miêu tả |
|---|---|
| <Cửa sổ | Nó là phần tử đối tượng mở hoặc vùng chứa của gốc. |
| x: Class = "Resources.MainWindow" | Nó là một khai báo lớp một phần kết nối đánh dấu với mã lớp một phần được định nghĩa phía sau. |
| xmlns = "http://schemas.microsoft.com/win fx / 2006 / xaml / Presentation" | Lập bản đồ không gian tên XAML mặc định cho ứng dụng / khuôn khổ WPF |
| xmlns: x = "http://schemas.microsoft.com/w infx / 2006 / xaml" | Không gian tên XAML cho ngôn ngữ XAML ánh xạ nó tới tiền tố x: |
| > | Phần tử cuối đối tượng của gốc |
<Lưới> </Grid> |
Nó đang bắt đầu và đóng các thẻ của một đối tượng lưới trống. |
| </Window> | Đóng phần tử đối tượng |
Các quy tắc cú pháp cho XAML gần như tương tự như XML. Nếu bạn xem một tài liệu XAML, thì bạn sẽ nhận thấy rằng nó thực sự là một tệp XML hợp lệ, nhưng một tệp XML không nhất thiết phải là một tệp XAML. Đó là bởi vì trong XML, giá trị của các thuộc tính phải là một chuỗi trong khi trong XAML, nó có thể là một đối tượng khác được gọi là cú pháp phần tử Thuộc tính.
Cú pháp của một phần tử Object bắt đầu bằng một dấu ngoặc nhọn bên trái (<) theo sau là tên của một đối tượng, ví dụ như Button.
Xác định một số Thuộc tính và thuộc tính của phần tử đối tượng đó.
Phần tử Đối tượng phải được đóng bằng dấu gạch chéo lên (/) ngay sau dấu ngoặc vuông (>).
Ví dụ về đối tượng đơn giản không có phần tử con
<Button/>Ví dụ về phần tử đối tượng với một số thuộc tính
<Button Content = "Click Me" Height = "30" Width = "60" />Ví dụ về cú pháp thay thế xác định thuộc tính (Cú pháp phần tử thuộc tính)
<Button>
<Button.Content>Click Me</Button.Content>
<Button.Height>30</Button.Height>
<Button.Width>60</Button.Width>
</Button>Ví dụ về đối tượng có phần tử con: StackPanel chứa Textblock làm phần tử con
<StackPanel Orientation = "Horizontal">
<TextBlock Text = "Hello"/>
</StackPanel>Tại sao XAML trong WPF
XAML không chỉ là tính năng được biết đến rộng rãi nhất của WPF mà còn là một trong những tính năng bị hiểu nhầm nhiều nhất. Nếu bạn đã tiếp xúc với WPF, thì bạn chắc hẳn đã nghe nói về XAML; nhưng hãy lưu ý hai sự thật ít được biết đến sau đây về XAML -
- WPF không cần XAML
- XAML không cần WPF
Trên thực tế, chúng là những mảng công nghệ có thể tách rời. Để hiểu điều đó có thể xảy ra như thế nào, hãy xem một ví dụ đơn giản trong đó một nút được tạo với một số thuộc tính trong XAML.
<Window x:Class = "WPFXAMLOverview.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>
<Button x:Name = "button" Content = "Click Me" HorizontalAlignment = "Left"
Margin = "150" VerticalAlignment = "Top" Width = "75" />
</StackPanel>
</Window>Trong trường hợp bạn chọn không sử dụng XAML trong WPF, thì bạn cũng có thể đạt được kết quả GUI tương tự với ngôn ngữ thủ tục. Hãy xem cùng một ví dụ, nhưng lần này, chúng ta sẽ tạo một nút trong C #.
using System.Windows;
using System.Windows.Controls;
namespace WPFXAMLOverview {
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window {
public MainWindow() {
InitializeComponent();
// Create the StackPanel
StackPanel stackPanel = new StackPanel();
this.Content = stackPanel;
// Create the Button
Button button = new Button();
button.Content = "Click Me";
button.HorizontalAlignment = HorizontalAlignment.Left;
button.Margin = new Thickness(150);
button.VerticalAlignment = VerticalAlignment.Top;
button.Width = 75;
stackPanel.Children.Add(button);
}
}
}Khi bạn biên dịch và thực thi mã XAML hoặc mã C #, bạn sẽ thấy kết quả tương tự như hình dưới đây.
Từ ví dụ trên, rõ ràng là những gì bạn có thể làm trong XAML để tạo, khởi tạo và thiết lập thuộc tính của các đối tượng, các tác vụ tương tự cũng có thể được thực hiện bằng cách sử dụng mã.
XAML chỉ là một cách đơn giản và dễ dàng khác để thiết kế các phần tử giao diện người dùng.
Với XAML, không có nghĩa là những gì bạn có thể làm để thiết kế các phần tử giao diện người dùng là cách duy nhất. Bạn có thể khai báo các đối tượng trong XAML hoặc xác định chúng bằng mã.
XAML là tùy chọn, nhưng mặc dù vậy, nó là trọng tâm của thiết kế WPF.
Mục tiêu của XAML là cho phép các nhà thiết kế trực quan tạo các phần tử giao diện người dùng trực tiếp.
WPF nhằm mục đích làm cho nó có thể kiểm soát tất cả các khía cạnh trực quan của giao diện người dùng từ khi đánh dấu.