wpf c# là gì

Trong bài viết này

Bằng cách hoàn thành hướng dẫn này, bạn sẽ làm quen với nhiều công cụ, hộp thoại và trình thiết kế mà bạn có thể sử dụng khi phát triển ứng dụng với Visual Studio. Bạn sẽ tạo ứng dụng “Hello, World”, thiết kế giao diện người dùng, thêm mã và gỡ lỗi trong khi bạn tìm hiểu về cách làm việc trong môi trường phát triển tích hợp (IDE).

Điều kiện tiên quyết

Nếu bạn chưa cài đặt Visual Studio, hãy truy cập trang tải xuống Visual Studio để cài đặt miễn phí.

Bạn có thể sử dụng .NET Framework hoặc .NET Core cho hướng dẫn này. .NET Core là framework mới hơn, hiện đại hơn. .NET Core yêu cầu Visual Studio 2019 phiên bản 16.3 trở lên.

Khi bạn mở Visual Studio lần đầu tiên, bạn sẽ được nhắc đăng nhập. Bước này là tùy chọn cho hướng dẫn này. Tiếp theo, bạn có thể thấy một hộp thoại yêu cầu bạn chọn cài đặt phát triển và chủ đề màu sắc của mình. Giữ nguyên giá trị mặc định và lựa chọn Khởi động Visual Studio.

*

Sau khi Visual Studio khởi chạy, bạn sẽ thấy các cửa sổ công cụ, menu và thanh công cụ cũng như không gian cửa sổ chính. Các cửa sổ công cụ được gắn ở bên trái và bên phải của cửa sổ ứng dụng, với Khởi động nhanh, thanh menu và thanh công cụ tiêu chuẩn ở trên cùng. Ở giữa cửa sổ ứng dụng là Trang bắt đầu. Khi bạn tải một giải pháp hoặc dự án, những người chỉnh sửa và thiết kế sẽ xuất hiện trong không gian nơi Trang bắt đầu Là. Khi bạn phát triển một ứng dụng, bạn sẽ dành phần lớn thời gian của mình ở khu vực trung tâm này.

*

Khi bạn khởi chạy Visual Studio, cửa sổ bắt đầu sẽ mở ra trước tiên. Lựa chọn Tiếp tục mà không cần mã để mở môi trường phát triển. Bạn sẽ thấy các cửa sổ công cụ, các menu và thanh công cụ cũng như không gian cửa sổ chính. Các cửa sổ công cụ được gắn ở bên trái và bên phải của cửa sổ ứng dụng, với hộp tìm kiếm, thanh menu và thanh công cụ tiêu chuẩn ở trên cùng. Khi bạn tải một giải pháp hoặc dự án, những người chỉnh sửa và thiết kế sẽ xuất hiện trong không gian trung tâm của cửa sổ ứng dụng. Khi bạn phát triển một ứng dụng, bạn sẽ dành phần lớn thời gian của mình ở khu vực trung tâm này.

Tạo dự án

Khi bạn tạo một ứng dụng trong Visual Studio, trước tiên bạn tạo một dự án và một giải pháp. Đối với ví dụ này, bạn sẽ tạo một dự án Windows Presentation Foundation (WPF).

Tạo một dự án mới. Trên thanh menu, chọn Tập tin > Mới > Dự án.

*

bên trong Dự án mới hộp thoại, chọn Cài đặt > Visual C # > Máy tính để bàn Windows danh mục, sau đó chọn Ứng dụng WPF (.NET Framework) bản mẫu. Đặt tên cho dự án HelloWPFAppvà chọn đồng ý.

*

Mở Visual Studio 2019.

Trên cửa sổ bắt đầu, hãy chọn Tạo dự án mới.

*

Trên Tạo một dự án mới màn hình, tìm kiếm “WPF”, chọn Ứng dụng WPF, và sau đó chọn Kế tiếp.

*

Ở màn hình tiếp theo, đặt tên cho dự án, HelloWPFApp, và lựa chọn Kế tiếp.

*

bên trong Thông tin thêm cửa sổ, .NET Core 3.1 nên đã được chọn cho khung mục tiêu của bạn. Nếu không, hãy chọn .NET Core 3.1. Sau đó chọn Tạo nên.

*

Visual Studio tạo dự án và giải pháp HelloWPFApp, và Giải pháp Explorer hiển thị các tệp khác nhau. Các Nhà thiết kế WPF hiển thị chế độ xem thiết kế và chế độ xem XAML của MainWindow.xaml trong một chế độ xem phân chia. Bạn có thể trượt bộ chia để hiển thị nhiều hơn hoặc ít hơn một trong hai chế độ xem. Bạn có thể chọn chỉ xem chế độ xem trực quan hoặc chỉ xem XAML.

*

Ghi chú

Để biết thêm thông tin về XAML (Ngôn ngữ đánh dấu ứng dụng eXtensible), hãy xem tổng quan về XAML cho trang WPF.

Sau khi bạn tạo dự án, bạn có thể tùy chỉnh nó. Để làm như vậy, hãy chọn Cửa sổ thuộc tính từ Lượt xem menu hoặc nhấn F4. Sau đó, bạn có thể hiển thị và thay đổi các tùy chọn cho các mục dự án, điều khiển và các mục khác trong một ứng dụng.

*

Thay đổi tên của MainWindow.xaml

Hãy đặt cho MainWindow một cái tên cụ thể hơn. Trong Giải pháp Explorer, nhấp chuột phải vào MainWindow.xaml và lựa chọn Đổi tên. Đổi tên tệp thành Greetings.xaml.

Thiết kế giao diện người dùng (UI)

Nếu trình thiết kế không mở, hãy chọn Greetings.xaml và hãy nhấn Sự thay đổi+F7 để mở trình thiết kế.

Chúng tôi sẽ thêm ba loại điều khiển vào ứng dụng này: một điều khiển TextBlock, hai điều khiển RadioButton và một điều khiển Nút.

Thêm điều khiển TextBlock

nhấn Ctrl+Q để kích hoạt hộp tìm kiếm và nhập Hộp công cụ. Chọn Xem> Hộp công cụ từ danh sách kết quả.

bên trong Hộp công cụ, mở rộng Các điều khiển WPF phổ biến để xem điều khiển TextBlock.

*

Thêm điều khiển TextBlock vào bề mặt thiết kế bằng cách chọn TextBlock và kéo nó đến cửa sổ trên bề mặt thiết kế. Căn giữa điều khiển gần đầu cửa sổ. Trong Visual Studio 2019 trở lên, bạn có thể sử dụng các hướng dẫn màu đỏ để căn giữa điều khiển.

Cửa sổ của bạn sẽ giống như hình minh họa sau:

*

Đánh dấu XAML sẽ trông giống như ví dụ sau:

Tùy chỉnh văn bản trong khối văn bản

Trong chế độ xem XAML, xác định vị trí đánh dấu cho TextBlock và thay đổi Bản văn từ TextBox thành Tùy chọn tin nhắn rồi chọn nút Hiển thị.

Đánh dấu XAML sẽ trông giống như ví dụ sau:

Căn giữa TextBlock lại nếu bạn muốn, sau đó lưu các thay đổi của bạn bằng cách nhấn Ctrl + S hoặc sử dụng Tập tin mục menu.

Tiếp theo, bạn sẽ thêm hai điều khiển RadioButton vào biểu mẫu.

Thêm các nút radio

bên trong Hộp công cụ, tìm Nút radio điều khiển.

*

Thêm hai điều khiển RadioButton vào bề mặt thiết kế bằng cách chọn Nút radio và kéo nó đến cửa sổ trên bề mặt thiết kế. Di chuyển các nút (bằng cách chọn chúng và sử dụng các phím mũi tên) để các nút xuất hiện cạnh nhau trong điều khiển TextBlock. Sử dụng các hướng dẫn màu đỏ để căn chỉnh các điều khiển.

Cửa sổ của bạn sẽ trông như thế này:

*

bên trong Tính chất cửa sổ cho điều khiển RadioButton bên trái, thay đổi Tên tài sản (tài sản ở đầu Tính chất cửa sổ) sang HelloButton.

*

bên trong Tính chất cửa sổ cho điều khiển RadioButton phù hợp, thay đổi Tên thuộc tính GoodbyeButton, và sau đó lưu các thay đổi của bạn.

Tiếp theo, bạn sẽ thêm văn bản hiển thị cho mỗi điều khiển RadioButton. Quy trình sau sẽ cập nhật Nội dung thuộc tính cho một điều khiển RadioButton.

Thêm văn bản hiển thị cho mỗi nút radio

Cập nhật Nội dung thuộc tính HelloButton và GoodbyeButton thành “Xin chào” và “Tạm biệt” trong XAML. Đánh dấu XAML bây giờ sẽ trông giống như ví dụ sau:

Đặt nút radio được kiểm tra theo mặc định

Trong bước này, chúng tôi sẽ đặt HelloButton được kiểm tra theo mặc định để một trong hai nút radio luôn được chọn.

Trong dạng xem XAML, xác định vị trí đánh dấu cho HelloButton.

Thêm một IsChecked thuộc tính và đặt nó thành Thật. Cụ thể, hãy thêm IsChecked = “True”.

Đánh dấu XAML bây giờ sẽ trông giống như ví dụ sau:

Phần tử giao diện người dùng cuối cùng mà bạn sẽ thêm là một nút điều khiển.

Thêm nút điều khiển

bên trong Hộp công cụ, tìm Cái nút điều khiển, và sau đó thêm nó vào bề mặt thiết kế dưới các điều khiển RadioButton bằng cách kéo nó vào biểu mẫu trong dạng xem thiết kế. Nếu bạn đang sử dụng Visual Studio 2019 trở lên, một đường màu đỏ sẽ giúp bạn căn giữa điều khiển.

Trong chế độ xem XAML, hãy thay đổi giá trị của Nội dung cho điều khiển Nút từ Nội dung = “Nút” thành Nội dung = “Hiển thị”, rồi lưu các thay đổi.

Cửa sổ của bạn sẽ giống như hình minh họa sau đây.

*

Đánh dấu XAML bây giờ sẽ trông giống như ví dụ sau:

Thêm mã vào nút hiển thị

Khi ứng dụng này chạy, một hộp thông báo xuất hiện sau khi người dùng chọn một nút radio và sau đó chọn Trưng bày cái nút. Một hộp thông báo sẽ xuất hiện cho Xin chào và một hộp khác sẽ xuất hiện cho Tạm biệt. Để tạo hành vi này, bạn sẽ thêm mã vào sự kiện Button_Click trong Xin chào.xaml.cs.

Trên bề mặt thiết kế, bấm đúp vào Trưng bày cái nút.

Xin chào.xaml.cs mở bằng con trỏ trong sự kiện Button_Click.

private void Button_Click (object sender, RoutedEventArgs e) {} Nhập mã sau:

if (HelloButton.IsChecked == true) {MessageBox.Show (“Xin chào.”);} else if (GoodbyeButton.IsChecked == true) {MessageBox.Show (“Tạm biệt.”);} Lưu ứng dụng.

Gỡ lỗi và kiểm tra ứng dụng

Tiếp theo, bạn sẽ gỡ lỗi ứng dụng để tìm lỗi và kiểm tra xem cả hai hộp thông báo đều xuất hiện chính xác. Hướng dẫn sau cho bạn biết cách tạo và khởi chạy trình gỡ lỗi, nhưng sau này bạn có thể đọc Xây dựng ứng dụng WPF (WPF) và Gỡ lỗi WPF cho thêm thông tin.

Tìm và sửa lỗi

Trong bước này, bạn sẽ tìm thấy lỗi mà chúng tôi đã gây ra trước đó bằng cách thay đổi tên của MainWindow.xaml tập tin.

Bắt đầu gỡ lỗi và tìm lỗi

Khởi động trình gỡ lỗi bằng cách nhấn F5 hoặc lựa chọn Gỡ lỗi, sau đó Bắt đầu gỡ lỗi.

A Chế độ nghỉ cửa sổ xuất hiện và Đầu ra cửa sổ cho biết IOException đã xảy ra: Không thể định vị tài nguyên “mainwindow.xaml”.

*

Dừng trình gỡ lỗi bằng cách chọn Gỡ lỗi > Dừng gỡ lỗi.

Chúng tôi đã đổi tên MainWindow.xaml đến Greetings.xaml ở đầu hướng dẫn này, nhưng mã vẫn đề cập đến MainWindow.xaml là URI khởi động cho ứng dụng, vì vậy dự án không thể bắt đầu.

Chỉ định Greetings.xaml làm URI khởi động

Trong Giải pháp Explorer, mở App.xaml tập tin.

Thay đổi StartupUri = “MainWindow.xaml” thành StartupUri = “Greetings.xaml”, rồi lưu các thay đổi.

Khởi động lại trình gỡ lỗi (nhấn F5). Bạn sẽ thấy Lời chào hỏi cửa sổ của ứng dụng.

XEM THÊM CÁC BÀI VIẾT MỚI NHẤT TẠI: https://tocchienhuyenthoai.com/

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *