Tài liệu Windows Presentation Foundation (WPF)

Nội dung text: Tài liệu Windows Presentation Foundation (WPF)

1. WPF cũng hỗ trợ sử dụng template. Mỗi template tương tự như một style, và ở hai dạng: - Template cho dữ liệu: sử dụng thành phần DataTemplate của XAML để thiết lập một nhóm thuộc tính hiển thị của dữ liệu như màu sắc, phương thức căn lề - Template cho control: sử dụng thành phần ControlTemplate của XAML để định ra diện mạo của một control. 3.3 Text Giao diện người dùng ít nhiều đều hiển thị chữ hay text. Đối với phần lớn mọi người, đọc text trên màn hình thường khó hơn đọc trên giấy in. Đó là do chất lượng hiển thị text trên màn hình kém hơn so với khi in ra giấy. WPF tập trung giải quyết vấn đề này, làm chất lượng text hiển thị trên màn hình tương đương trên giấy in. Cụ thể, WPF hỗ trợ các font chữ OpenType chuẩn, cho phép sử dụng các thư viện font đã có. WPF cũng hỗ trợ công nghệ font chữ mới ClearType, cho phép hiển thị các ký tự mịn hơn đối với mắt người, đặc biệt là trên màn hình tinh thể lỏng (LCD). Để nâng cao hơn nữa chất lượng hiển thị text, WPF cho phép một số công nghệ khác như chữ ghép, theo đó một nhóm ký tự được thay thế bằng một ảnh đơn nhất, tạo tâm lý thoải mái hơn khi đọc đối với người dùng. 3.4 Văn bản WPF hỗ trợ ba dạng văn bản: văn bản cố định (fixed), văn bản thích nghi (flow/adaptive) và văn bản XPS (XML Paper Specification). Kèm theo đó, WPF cũng cung cấp các dịch vụ để tạo, xem, quản lý, ghi chú, đóng gói và in ấn văn bản. Văn bản cố định trông không đổi bất kể chúng được hiển thị trên màn hình hay in ra máy in. Trong WPF, những văn bản dạng này được định nghĩa bằng phần tử FixedDocument trong XAML và được hiển thị bằng control DocumentViewer. Trong khi đó, văn bản thích nghi thường chỉ dùng để đọc trên màn hình, và có khả năng tự động thay đổi các thuộc tính hiển thị ảnh và text cho phù hợp với kích thước cửa số hay các yếu tố môi trường khác nhằm nâng cao chất lượng đọc cho người dùng. Văn bản thích nghi được định nghĩa bằng phần tử FlowDocument. Để hiển thị văn bản thích nghi, WPF sử dụng một số control khác nhau, chẳng hạn như FlowDocumentPageViewer, FlowDocumentScrollViewer, FlowDocumentReader Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 11
2. Hình 0.6. – Một minh họa về văn bản thích nghi trong WPF. Văn bản XPS xây dựng trên cơ sở văn bản bất động của WPF. XPS là một định dạng mở theo đặc tả XML, có khả năng sử dụng trên nhiều nền tảng khác nhau, được thiết kế nhằm tạo thuận lợi cho việc xây dựng, chia sẻ, in ấn và lưu trữ văn bản. Cũng như văn bản cố định, văn bản XPS được hiển thị bằng DocumentViewer. Hình 0.7. Một minh họa về văn bản XPS trong WPF. 3.5 Hình ảnh Trong WPF, hình ảnh được hiển thị nhờ control Image, ví dụ: Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 12
3. Control Image có thể hiển thị hình ảnh lưu trữ dưới nhiều khuôn dạng khác nhau, bao gồm JPEG, BMP, TIFF, GIF và PNG. Nó cũng có thể hiển thị hình ảnh dạng Windows Media Photo mới được sử dụng trong Windows Vista. Bất kể ở khuôn dạng nào, WPF sử dụng Windows Imaging Component (WIC) để tạo ra hình ảnh. Cùng với các codec dùng cho các khuôn dạng ảnh kể trên, WIC cũng cung cấp một nền tảng chung để bổ sung codec khác. 3.6 Video và Âm thanh Khi tốc độ của các bộ xử lý và truyền thông mạng ngày một nâng cao, video trở thành một phần tương tác lớn của người dùng với phần mềm. Người dùng cũng sử dụng nhiều thời gian để nghe nhạc và các dạng âm thanh khác trên máy tính. Do đó, WPF cung cấp tính năng hỗ trợ cả hai dạng media này thông qua phần tử MediaElement. Control này có thể chơi các định dạng video WMV, MPEG và AVI, và nhiều định dạng âm thanh khác nhau. Việc lập trình để chạy một đoạn video trở nên khá đơn giản, như trong ví dụ sau: 3.7 Đồ họa hai chiều Trong 20 năm gần đây, việc tạo ra đồ họa hai chiều trên Windows dựa trên Graphics Device Interface (GDI) và phiên bản sau của nó GDI+. Các ứng dụng Windows Forms phải sử dụng chức năng này thông qua một namespace khác hoàn toàn, bởi bản thân Windows Forms không tích hợp đồ họa 2 chiều. Đối với đồ họa 3 chiều thì càng tồi hơn, Windows Forms phải dựa trên công nghệ hoàn toàn biệt lập là Direct3D. Với WPF, vấn đề trở nên đơn giản hơn nhiều. Cả đồ họa 2 chiều và 3 chiều đều có thể được tạo ra trực tiếp trong XAML hoặc trong code sử dụng thư viện WPF tương ứng. Đối với đồ họa 2 chiều, WPF định ra nhóm control của các khuôn hình (shapes) mà ứng dụng có thể sử dụng để tạo nên hình ảnh, gồm: Line: vẽ đường thẳng qua 2 điểm. Elllipse: vẽ ellipse. Rectangle: vẽ chữ nhật. Polygon: vẽ đa giác. Polyline: vẽ đa giác mở. Path: vẽ hình theo một đường bất kỳ. Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 13
4. Mỗi khuôn hình đều có các thuộc tính phong phú cho phép hiển thị với nhiều tính chất khác nhau: màu nền, màu biên Một đặc điểm quan trọng trong WPF là: vì mọi thứ đều được xây dựng trên một nền chung, việc kết hợp các đặc tính và đối tượng khác nhau, chẳng hạn, lồng một ảnh vào một hình chữ nhật, trở nên đơn giản. Điểm thú vị nữa là các đối tượng hình học này còn có thể thu nhận các sự kiện từ phía người dùng như một control, chẳng hạn sự kiện nhắp chuột. Ngoài ra, WPF cũng cung cấp một nhóm chức năng hình học khác, gọi là geometries, để làm việc với đồ họa hai chiều, như LineGeometry, RectangleGeometry, EllipseGeometry, và PathGeometry. Dạng hình học này có nhiều thuộc tính và chức năng tương tự như các khuôn hình đã nêu trên. Điểm khác biệt quan trọng nhất là các geometries không được dùng để hiển thị, chúng được dùng chủ yếu để tính toán hình học, ví dụ như để định ra các vùng miền, theo dõi vị trí bấm chuột Thêm vào đó, WPF cung cấp lớp Transform cho phép thực hiện các biến đổi hình học như xoay, dịch chuyển, co giãn đối tượng đồ họa; hoặc cho phép thực hiện các hiệu ứng hoạt họa theo thời gian thông qua các lớp Animation và Timing. 3.8 Đồ họa ba chiều WPF hỗ trợ đồ họa 3 chiều bằng việc gói các lời gọi API của Direct3D, và do vậy, việc sử dụng chúng trở nên thống nhất và đơn giản hơn đáng kể. Để hiển thị đồ họa ba chiều, ứng dụng WPF sử dụng control Viewport3D. Để tạo ra các cảnh ba chiều, lập trình viên mô tả một hay nhiều mô hình, sau đó, phân định cách thức các mô hình này được chiếu sáng hay hiển thị. Như thường lệ, điều này được thực hiện bằng XAML, bằng code hay trộn cả hai. Để mô tả mô hình, WPF cung cấp lớp GeometryModel3D để tạo ra hình dạng của mô hình. Khi mô hình đã được định hình, diện mạo bên ngoài của nó có thể được điều khiển bằng việc phủ lên các vật liệu (material). Chẳng hạn, lớp SpecularMaterial cho phép tạo bóng trên bề mặt mô hình. Bất kể được làm từ vật liệu gì, một mô hình có thể được chiếu sáng theo nhiều cách. Lớp DirectionalLight cho phép ánh sáng tới từ một hướng xác định, trong khi lớp AmbientLight tạo ra ánh sáng đồng đều trên mọi vật trong cảnh. Cuối cùng, để định ra cách nhìn cảnh, lập trình viên phải định ra một camera. Ví dụ, PerspectiveCamera cho phép phân định khoảng cách từ vị trí nhìn tới vật thể và kiểu nhìn phối cảnh (tuân theo luật gần xa). Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 14
5. Hình 0.8. Tạo lập đối tượng đồ họa ba chiều với WPF. Xây dựng cảnh ba chiều trực tiếp bằng XAML hay mã trình đều không đơn giản. Do đó, chỉ nên dùng ứng dụng WPF để hiển thị cảnh ba chiều, việc xây dựng cảnh nên được thực hiện bằng những công cụ đồ họa chuyên biệt. 3.9 Móc nối dữ liệu Phần lớn các ứng dụng được tạo ra đều cung cấp cho người dùng phương tiện để xem và sửa đổi dữ liệu. Trong các ứng dụng WPF, việc lưu trữ và truy xuất dữ liệu đã được thực hiện bởi các công nghệ như Microsoft SQL Server và ADO.NET. Sau khi dữ liệu được truy xuất và tải vào các đối tượng quản lý dữ liệu trên ứng dụng, phần việc khó khăn của ứng dụng WPF mới bắt đầu. Về cơ bản, có hai công việc phải thực hiện: 1) Sao chép dữ liệu từ các đối tượng quản lý dữ liệu vào các control trên giao diện, qua đó, dữ liệu có thể được hiển thị hay sửa đổi. 2) Đảm bảo rằng những thay đổi trên dữ liệu từ các control được cập nhật trở lại các đối tượng quản lý dữ liệu. Để đơn giản hóa quá trình phát triển ứng dụng, WPF cung cấp một cơ chế móc nối dữ liệu để thực hiện tự động những bước này. Phần nhân của cơ chế móc nối dữ liệu là lớp Binding mà nhiệm vụ của nó là liên kết control trên giao diện (đích) với đối tượng quản lý dữ liệu (nguồn). Mối quan hệ này được minh họa trong hình dưới đây: Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 15
6. Hình 0.9. Quan hệ giữa đối tượng dữ liệu và đối tượng phụ thuộc. Việc hỗ trợ móc nối dữ liệu được xây dựng ngay từ nhân của WPF. Tất cả các đối tượng đồ họa trong WPF đều kế thừa từ DependencyObject, chúng là các đối tượng phụ thuộc. Chức năng mà lớp cơ sở này hỗ trợ cho phép thực hiện hiệu ứng hoạt họa, tạo kiểu mẫu (styling) và móc nối dữ liệu. Các đối tượng này đều mang một thuộc tính đặc biệt gọi là DependencyProperty, thuộc tính phụ thuộc. Phần lớn các thuộc tính hay dùng như Text, Content, Width, Height, vân vân đều là các thuộc tính phụ thuộc. Tất cả các thuộc tính phụ thuộc đều có thể tạo hiệu ứng hoạt họa, tạo kiểu và kết nối dữ liệu. Cơ chế móc nối dữ liệu trong WPF còn cung cấp thêm những tính năng như xác thực tính hợp lệ, sắp xếp, lọc và phân nhóm dữ liệu. Thêm vào đó, tính năng móc nối dữ liệu cũng hỗ trợ sử dụng khuôn mẫu dữ liệu (data template) để tạo ra các đối tượng giao diện tùy biến có kết nối dữ liệu, khi các control chuẩn không phù hợp. Móc nối dữ liệu và khuôn dạng dữ liệu có thể được coi là tính năng mạnh nhất của WPF. 4. Công cụ phát triển WPF Như đã trình bày ở trên, WPF cung cấp rất nhiều tính năng cho những lập trình viên. Tuy nhiên, một công nghệ dù có hữu dụng đến đâu cũng cần một công cụ và môi trường tốt để phát huy những lợi điểm của nó. Đối với WPF, Microsoft cung cấp một công cụ chuyên dùng cho lập trình viên, và một công cụ khác phục vụ người thiết kế giao diện. Phần dưới đây đề cập ngắn gọn về những công cụ này. 4.1 Microsoft Visual Studio - Công cụ cho lập trình viên Visual Studio là công cụ chủ đạo của Microsoft dành cho lập trình viên phần mềm. Microsoft cung cấp thành phần mở rộng cho Visual Studio 2005 cho phép lập trình viên có thể tạo ra các ứng dụng WPF. Phiên bản tiếp theo của Visual Studio (2008) có bổ sung thêm các tính năng phát triển ứng dụng WPF, trong đó bao gồm Visual Designer, môi trường thiết kế giao diện cho WPF. Sử dụng công cụ này, lập trình viên có thể tạo ra giao diện WPF một cách trực quan, trong khi sản sinh các đặc tả XAML tương ứng một cách tự động. Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 16
7. 4.2 Microsoft Expression Design – Công cụ cho người thiết kế Như đã giới thiệu trong phần trước, mục tiêu cơ bản của WPF là nâng cao vị thế của người thiết kế trong việc tạo giao diện người dùng. Để đạt mục tiêu này, ngoài XAML là công nghệ cốt lõi, Microsoft cũng đưa ra một công cụ mới cho phép người thiết kế làm việc thuận tiện hơn, đó là Microsoft Expression Design (Hình 0.10). Hình 0.10. Giao diện của công cụ Microsoft Expression Design. Microsoft Expression Design cung cấp những tính năng truyền thống của một công cụ thiết kế, cho phép người dùng làm việc theo cách quen thuộc. Ngoài ra, công cụ này đặc biệt tập trung vào việc hỗ trợ tạo giao diện cho các ứng dụng WPF. Tất cả các tính năng WPF mô tả ở trên đều sẵn có trong môi trường thiết kế này, và cho phép người dùng thiết kế một cách trực quan. Kết quả thiết kế được biểu diễn dưới dạng file XAML do công cụ này sinh ra, và sau đó có thể được nhập vào môi trường Visual Studio. Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 17
8. 5. Ứng dụng đầu tiên với WPF – Hello World Phần này giúp các bạn làm quen với lập trình WPF thông qua một ví dụ kinh điển: Hello World. Ứng dụng chỉ bao gồm một nút bấm có nhãn ban đầu là Hello World. Khi nhắp chuột vào nút, nút sẽ đổi tên thành “From Hanoi, Vietnam”. Môi trường lập trình ở đây là bộ Visual Studio 2008 với .NET Framework 3.5. Quy trình thực hiện như sau: 5.1 Tạo ứng dụng WPF Ở đây, ta chú ý chọn .Net Framework 3.5. Giao diện thiết kế ứng dụng: Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 18
9. Chúng ta sẽ làm 2 phương pháp, một là viết code C# trực tiếp trong ứng dụng, hai là viết bằng mã XAML. 5.2 Tạo ứng dụng Hello World bằng code C# Khai báo Button trong lớp Window1. Lớp Button được tạo ra từ namespace: System.Windows.Controls; namespace Helloworld { public partial class Window1:Window { // khai báo 1 button Button button; public Window1() { InitializeComponent(); } } } Ở phương thức khởi tạo, ta sẽ lần lượt đặt thuộc tính cho nút bấm: Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 19
10. //tạo mới button button = new Button(); //xác định thuộc tính cho button button.Content = "Hello World"; button.LayoutTransform = new ScaleTransform(3, 3); button.Margin = new System.Windows.Thickness(10); //thêm phương thức xử lý sự kiện Click cho button button.Click += new RoutedEventHandler(button_Click); //đưa button vao Window this.Content = button; Để tạo phương thức xử lý sự kiện Click cho button, chúng ta chỉ thêm lệnh button.Click += và nhấn Tab 2 lần. Code tự sinh ra như sau: void button_Click(object sender, RoutedEventArgs e) { // xử lý button khi người dùng click } Trong phương thức này, ta thêm vào dòng lệnh: button.Content = "From Hanoi, Vietnam";//đổi nội dung (caption) của button Nhấn F5 để biên dịch project và chạy kết quả. 5.3 Tạo ứng dụng Hello World bằng XAML WPF hỗ trợ trên nền tảng XAML nên ta có thể tạo đối tượng hoàn toàn bằng ngôn ngữ XAML. Lưu ý, với cùng project trên, muốn viết đặc tả bằng XAML tương đương ta cần xóa bỏ phần mã trình C# cũ đi, vì C# và XAML không thể cùng sinh một đối tượng. Cách thực hiện: Mở file Window1.xaml tương ứng với file code Window1.xaml.cs ở trên. Thêm đoạn mã đặc tả XAML tương đương sau: Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 20
11. Hello World Giờ ta gán tên phương thức xử lý sự kiện Click cho nút bấm này: F5 để chạy ứng dụng. Ta sẽ thu được kết quả tương tự như phần 5.2. Câu hỏi ôn tập 1. WPF là gì? WPF, viết tắt của Windows Presentation Foundation, là hệ thống API mới hỗ trợ việc xây dựng giao diện đồ hoạ trên nền Windows. WPF tăng cường khả năng lập trình giao diện của lập trình viên bằng cách cung cấp các API cho phép tích hợp nhiều dịch vụ trực quan trên cùng một ứng dụng: các form, control, hình ảnh 2 chiều, 3 chiều, văn bản cố định và thích nghi, in ấn, đồ họa vector, hoạt họa, móc nối dữ liệu, âm thanh và video. Thêm vào đó, các ứng dụng WPF còn có khả năng triển khai như một chương trình độc lập hoặc trên trình duyệt Web mà không phải thay đổi code giao diện. Sử dụng ngôn ngữ markup XAML có bản chất XML, WPF tạo cơ sở làm việc chung giữa người thiết kế giao diện và người lập trình. Là một bộ phận của .NET Framework 3.0, WPF sẵn có trong Windows Vista và Windows Server 2008. Đồng thời, WPF cũng có thể hoạt động trên nền Windows XP Service Pack 2 hoặc mới hơn, và cả Windows Server 2003. Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 21
12. 2. Mục tiêu cơ bản của WPF là gì? A. Cung cấp một nền tảng thống nhất để xây dựng giao diện người dùng. B. Cho phép người lập trình và người thiết kế giao diện làm việc cùng nhau một cách dễ dàng. C. Cung cấp một công nghệ chung để xây dựng giao diện người dùng trên cả Windows và trình duyệt Web. D. Cả ba mục tiêu trên. Câu trả lời: D 3. XAML là gì? XAML, viết tắt của Extensible Application Markup Language, là ngôn ngữ đặc tả dựa trên XML được dùng để định nghĩa các đối tượng và thuộc tính của chúng, mối quan hệ cũng như sự tương tác. XAML đặc biệt được dùng trong các công nghệ của .NET Framework 3.0 (trong đó có WPF) như ngôn ngữ đặc tả giao diện người dùng (user interface - UI) nhằm mô tả cấu trúc và đặc tính của các phần tử UI, sự liên kết dữ liệu, các sự kiện và các đặc tính khác. XAML là mô hình có tính đột phá trong lĩnh vực tính toán trên Internet được chấp nhận rộng rãi trong nhiều hệ thống và bởi nhiều nhà cung cấp phần mềm. 4. Vai trò của XAML trong việc tạo môi trường làm việc chung giữa người thiết kế giao diện và người lập trình. XAML đóng vai trò một ngôn ngữ chung giữa môi trường thiết kế giao diện và môi trường lập trình. Đối với người thiết kế, XAML không những cho phép người thiết kế dễ dàng mô tả, chỉnh sửa các đối tượng UI và các đặc tính của chúng, mà còn cho phép họ tương tác với các đối tượng này ở mức độ nhất định. Do vậy, tăng khả năng cảm quan của người thiết kế đối với giao diện. Ngoài ra, nó cũng giúp người thiết kế hạn chế những ý tưởng đồ họa không khả thi khi lập trình. Đối với người lập trình, nhờ một môi trường lập trình có khả năng tự động tái tạo giao diện đã thiết kế dựa trên file đặc tả bằng XAML do người thiết kế chuyển sang, người lập trình không cần tự mình tái tạo lại giao diện. Điều này giảm đi nhiều công sức và thời gian để phát triển giao diện, cũng như tránh những sai lệch giữa giao diện do người thiết kế và giao diện do người lập trình tái tạo. Vì cả môi trường thiết kế và lập trình đều có khả năng hiểu và sử dụng XAML, ứng dụng WPF có thể chuyển qua lại giữa hai môi trường phát triển để sửa đổi hay bổ sung giao diện một Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 22
13. cách dễ dàng. Với tất cả những lợi điểm này, vị thế của người thiết kế trong việc xây dựng giao diện được nâng cao. 5. Trong ứng dụng WPF, phần giao diện người dùng có thể được viết bằng: A. XAML B. Mã trình (C# hoặc Visual Basic) C. Cả A và B Câu trả lời: C 6. Trong ứng dụng WPF, việc xử lý các sự kiện có thể được viết bằng: A. XAML B. Mã trình (C# hoặc Visual Basic) C. Cả A và B Câu trả lời: B Tài liệu tham khảo 1. Windows Presentation Foundation, URL: us/library/ms754130.aspx. 2. Introducing Windows Presentation Foundation, URL: us/library/aa663364.aspx. 3. WPF Architecture, URL: 4. WPF Tutorial, URL: 5. WPF Tutorials, URL: Microsoft Vietnam – DPE Team |WPF – Bài mở đầu: Tổng quan về WPF 23
14. Bài 1 BỐ TRÍ GIAO DIỆN TRONG ỨNG DỤNG WPF Bài này giới thiệu cách thức bố trí giao diện trong ứng dụng WPF. Phần đầu sẽ giới thiệu về các dạng panel, một sự đổi mới trong phương thức bố trí giao diện của ứng dụng WPF so với MFC, VB Forms hay ngay cả Windows Forms nhằm tăng tính linh hoạt. Sau đó, các dạng panel thông dụng cùng với đặc tính của chúng sẽ được trình bày thông qua các ví dụ đơn giản. 1 Giới thiệu chung Như đã giới thiệu trong bài mở đầu, WPF sử dụng các dạng panel khác nhau để bố trí các phần tử trên giao diện người dùng. Điều này xuất phát từ ý tưởng kết hợp công nghệ giao diện mạnh như Windows Forms, với các kỹ thuật sắp đặt (layout) của trình duyệt nhằm nâng cao tính linh hoạt trong việc bố trí các phần tử trên giao diện. Các công nghệ xây dựng giao diện như VB6 form, Access forms dựa trên nguyên tắc bố trí theo vị trí tuyệt đối. Nghĩa là, người lập trình phải xác định giá trị tọa độ góc trên bên trái của một control (so với với góc trên bên trái của một form) khi muốn đặt nó lên form. Điều này cho phép lập trình viên điều khiển vị trí của control khá dễ dàng, nhưng lại thường đòi hỏi một lượng lớn mã trình khi cần thay đổi kích thước form. Đây là phương pháp tiếp cận theo hướng áp đặt (imperative), trong đó máy tính được chỉ rõ phải làm những bước gì, khi nào và theo trình tự nào. Với cách thức bố trí này, các điều khiển như Label hay Panel không tự động kéo giãn để phù hợp với kích thước phần nội dung chứa trong nó. Và như vậy, nếu phần nội dung của một Label lớn hơn vùng có thể hiển thị của Label đó, thì nội dung này sẽ bị cắt đi hoặc bị che lấp. Trong khi đó, các phần tử giao diện Web trên trình duyệt được sắp xếp theo phương thức khai báo (declarative), trong đó, người lập trình chỉ đưa ra những thứ cần làm, còn máy tính sẽ giải quyết vấn đề làm như thế nào. Với phương thức này, giao diện trên trình duyệt không đòi hỏi mã trình để thay đổi kích thước các vùng chứa (containner). HTML cho phép ta định ra một chuỗi các vùng chứa, ví dụ như các phần tử , , và , để bố trí các phần tử UI khác trong đó một cách linh động bên phải hoặc bên trái một đối tượng; hay cũng có thể sắp xếp chúng theo vị trí Microsoft Vietnam – DPE Team | WPF – Bài 1: Bố trí giao diện trong ứng dụng WPF 1