/ / Cách tạo ứng dụng Windows Forms (Winforms) đầu tiên của bạn trong Visual Studio

Cách tạo ứng dụng Windows Forms (Winforms) đầu tiên của bạn trong Visual Studio

Bởi MUO nhân viên

Làm quen với Microsoft Visual Studio và phát triển ứng dụng của riêng bạn với Windows Forms mà hầu như không cần viết mã.


Máy tính trên bàn có mã

Windows Forms là một khuôn khổ có sẵn trong Visual Studio cho phép bạn tạo các ứng dụng trên máy tính để bàn với sự hỗ trợ của giao diện người dùng đồ họa. Điều này cho phép bạn nhấp và kéo các tiện ích con như nút hoặc nhãn trực tiếp lên canvas và thao tác các thuộc tính của từng tiện ích con như kích thước phông chữ, màu sắc hoặc đường viền của nó.

Trong bài viết này, bộ chuyển đổi độ C sang độ F đơn giản sẽ được sử dụng làm ví dụ để đi sâu vào các kiến ​​thức cơ bản về cách thiết lập Ứng dụng Windows Form. Visual Studio 2019 Community Edition là phiên bản được sử dụng cho hướng dẫn này.


Cách tạo dự án biểu mẫu Windows trong Visual Studio

Đầu tiên, tạo dự án trong Visual Studio.

  1. Mở Visual Studio và chọn Tạo một dự án mới.
  2. Visual Studio sẽ cung cấp cho bạn danh sách các mẫu dự án mà bạn có thể chọn.
  3. Để tạo Ứng dụng Windows Forms, hãy tìm kiếm Ứng dụng biểu mẫu Windows và chọn nó từ danh sách các mẫu. Khi cái này được chọn, hãy nhấp vào Tiếp theo.
    Chọn Winforms từ các Mẫu dự án

    Nếu Ứng dụng biểu mẫu Windows tùy chọn không có sẵn trên danh sách, hãy sửa đổi phiên bản Visual Studio đã cài đặt của bạn. Trong Trình cài đặt Visual Studio, thêm khối lượng công việc phát triển máy tính để bàn .NET cho Máy tính để bàn và Di động, và khởi chạy lại Visual Studio.

  4. Thêm tên và vị trí cho dự án và nhấp vào Tiếp theo. Vị trí là thư mục nơi các tệp mã sẽ được lưu trữ.
    Định cấu hình cài đặt dự án Winforms

  5. Trên màn hình tiếp theo, hãy giữ nguyên lựa chọn mặc định của .NET Core 3.1.
  6. Nhấp chuột Tạo ra.
    Chọn Phiên bản .Net của Winforms

  7. Sau khi Visual Studio hoàn tất việc tạo dự án, dự án sẽ mở.
    Môi trường Visual Studio với Canvas

LÀM VIDEO TRONG NGÀY

Cách thêm các phần tử vào Project Canvas

Khung vẽ là vùng màu trắng nằm ở phía trên bên trái của màn hình. Nhấp và kéo các điểm ở dưới cùng, bên phải hoặc dưới cùng bên phải của canvas để thay đổi kích thước nếu cần.

Để tạo giao diện người dùng của ứng dụng, hãy thêm các tiện ích con như nút hoặc hộp văn bản vào canvas.

  1. Mở Xem tab ở đầu cửa sổ và chọn Hộp công cụ.
    Mở tab View trong Visual Studio để xem thanh công cụ

  2. Thao tác này sẽ thêm một hộp công cụ vào bên trái của ứng dụng. Chọn biểu tượng ghim ở trên cùng bên phải của hộp công cụ để ghim vĩnh viễn vào đó.
  3. Đây là nơi bạn có thể kéo bất kỳ tiện ích nào từ hộp công cụ vào canvas. Đánh dấu một nút từ hộp công cụ và kéo nó vào canvas.
    Kéo tiện ích con vào Canvas trong Visual Studio

  4. Kéo thêm hai hộp văn bản vào canvas, cùng với ba nhãn (hai nhãn cho mỗi hộp văn bản và một nhãn cho tiêu đề ở đầu ứng dụng).
    Visual Studio Canvas với ba nhãn, hai hộp văn bản và một nút

  5. Mọi tiện ích con trên canvas đều có các thuộc tính được liên kết với chúng. Đánh dấu một tiện ích để hiển thị Tính chất cửa sổ ở dưới cùng bên phải của Visual Studio, nơi liệt kê tất cả các thuộc tính mà tiện ích con có. Các thuộc tính này có thể bao gồm văn bản, tên, cỡ chữ, đường viền hoặc căn chỉnh của tiện ích con được đánh dấu.
  6. Hiện tại, văn bản trên các tiện ích con này vẫn cho biết label1, label2hoặc button1. Chọn label1 widget và chỉnh sửa Bản văn trong cửa sổ thuộc tính để nói “độ C đến độ F”. Thay đổi kích thước phông chữ thành 22pt.
    Visual Studio thay đổi thuộc tính của tiện ích con

  7. Tương tự, hãy chỉnh sửa các thuộc tính của các tiện ích con khác trên canvas thành như sau:
    Widget Bất động sản Giá trị mới
    label2 Bản văn Độ C
    nhãn3 Bản văn độ F
    khuy ao Bản văn Tính toán
    Hộp văn bản Fahrenheit Chỉ đọc Thật


Cách xử lý sự kiện và viết mã trong đoạn mã

Các widget trên canvas có thể được gắn với các sự kiện. Sự kiện có thể bao gồm những thứ như nhấp vào nút, thay đổi văn bản bên trong hộp văn bản hoặc chọn một nút radio cụ thể. Khi những sự kiện này xảy ra, nó có thể khiến một phần mã trong Đoạn mã phía sau kích hoạt.

C # là ngôn ngữ được sử dụng khi tạo Windows Form. Nếu bạn chưa sử dụng C #, có rất nhiều lý do thực tế để học lập trình C #.

Đối với ứng dụng cụ thể này, hãy thêm một sự kiện vào Tính toán để kích hoạt một phần mã chạy khi nút này được nhấn.

  1. Bấm đúp vào Tính toán để tự động mở Form1.cs bằng một phương thức Sự kiện mới:
    private void calculateButton_Click(object sender, EventArgs e)
  2. Đây là nơi bạn sẽ thêm mã sẽ thực hiện phép tính độ C sang độ F và hiển thị kết quả trong hộp văn bản độ F. Để làm điều này, bạn cần có thể đọc giá trị từ hộp văn bản độ C và sửa đổi hộp văn bản độ F để hiển thị kết quả.
  3. Quay lại canvas và chỉnh sửa lại các thuộc tính như được hiển thị trước đó. Lần này, chỉnh sửa Tên thuộc tính cho cả hộp văn bản độ C và độ F. Những tên này có thể được sử dụng để tham chiếu đến các hộp văn bản trong mã.
    Widget Bất động sản Giá trị mới
    Hộp văn bản độ C Tên c °TextBox
    Hộp văn bản Fahrenheit Tên fahrenheitTextBox
  4. Quay lại hàm tính toán trong Form1.cs.
  5. Bây giờ, hộp văn bản độ C có thể được tham chiếu trong mã bằng tên “c CelsiusTextBox”. Giá trị độ C mà người dùng đã nhập được lưu trữ trong thuộc tính Văn bản của nó. Tuy nhiên, vì nó là một chuỗi, hãy phân tích cú pháp này thành một chuỗi kép để đưa nó vào các phép tính Fahrenheit trong tương lai.
    private void calculateButton_Click(object sender, EventArgs e)
    {
    // Get the value that the user entered in the Celsius Text Box
    double celsiusValue = Double.Parse(celsiusTextBox.Text);
    }
  6. Giờ đây, biến c CelsiusValue lưu trữ giá trị mà người dùng đã nhập vào Hộp văn bản độ C. Công thức chuyển đổi độ C sang độ F là (độ C Giá trị * 9/5) + 32. Do đó, kết quả bây giờ có thể được tính toán và lưu trữ trong Hộp văn bản độ F.
    private void calculateButton_Click(object sender, EventArgs e)
    {
    // Get the value that the user entered in the Celsius Text Box
    double celsiusValue = Double.Parse(celsiusTextBox.Text);
    // Apply the calculation
    double result = (celsiusValue * 9 / 5) + 32;
    // Store the result in the Fahrenheit Textbox
    fahrenheitTextBox.Text = result.ToString();
    }


Cách chạy và gỡ lỗi chương trình biểu mẫu Windows

Chạy chương trình Windows Forms trong Visual Studio

Bây giờ giao diện người dùng và logic mã đã được thiết lập, hãy chạy chương trình để xem nó hoạt động.

  1. Để chạy chương trình, hãy chọn mũi tên màu xanh lục ở đầu thanh công cụ trong Visual Studio.
    Chạy ứng dụng Winforms bằng nút phát màu xanh lá cây

  2. Khi dự án đã được tải, hãy thêm một giá trị vào hộp văn bản độ C và nhấn Tính toán khuy ao. Thao tác này sẽ thêm kết quả vào hộp văn bản Fahrenheit.
    Chương trình Winform đang chạy

  3. Nếu chương trình bị mờ trong thời gian chạy, có thể ứng dụng của bạn không nhận biết được DPI. Điều này có thể gây ra các vấn đề về tỷ lệ và độ phân giải, vì vậy điều này sẽ cần được bật. Bạn cũng có thể đọc thêm về cách định cấu hình tỷ lệ hiển thị trên Windows 10 cho màn hình DPI cao.
  4. Nhấp chuột phải vào Dự án Bộ chuyển đổi nhiệt độ bên trong Trình khám phá giải pháp. Lựa chọn Thêm vàosau đó chọn Vật phẩm mới.
  5. Tìm kiếm Tệp kê khai Ứng dụng và nhấp vào Thêm vào.
    Tìm kiếm và chọn tệp kê khai trong Visual Studio

  6. Sao chép mã sau vào tệp app.manifest mới, dưới dạng phần tử con của thẻ lắp ráp (nếu mã đã được tạo, chỉ cần bỏ nhận xét nó).
    <application xmlns="urn:schemas-microsoft-com:asm.v3">
    <windowsSettings>
    <dpiAware xmlns="http://schemas.microsoft.com/SMI/2005/WindowsSettings">true</dpiAware>
    <longPathAware xmlns="http://schemas.microsoft.com/SMI/2016/WindowsSettings">true</longPathAware>
    </windowsSettings>
    </application>
  7. Để thay đổi này có hiệu lực, hãy chạy lại chương trình. Chọn nút dừng màu đỏ ở đầu thanh công cụ, sau đó chọn lại nút phát màu xanh lá cây.


Gỡ lỗi chương trình biểu mẫu Windows

Bạn có thể muốn gỡ lỗi chương trình nếu logic của ứng dụng Windows Forms của bạn không hoạt động như mong đợi.

  1. Điều hướng trở lại chức năng CalculButton_Click trong Form1.cs và nhấp vào bất kỳ đâu trên thanh màu xám ở ngoài cùng bên trái của màn hình. Thao tác này sẽ thêm một điểm ngắt, được biểu thị bằng một vòng tròn màu đỏ.
  2. Nhấn lại nút “Tính toán” để kích hoạt phương pháp này thực thi. Chương trình sẽ tạm dừng khi nó chạm đến điểm ngắt để hiển thị tất cả các giá trị được lưu trữ trong các biến tại điểm đó.
  3. Để tiếp tục chương trình, hãy nhấp vào màu xanh lục Tiếp tục mũi tên ở đầu thanh công cụ.
    Thêm một điểm ngắt để bắt đầu chương trình gỡ lỗi trong Visual Studio

Chạy chương trình bằng tệp thực thi

Nếu bạn không muốn chạy chương trình của mình thông qua Visual Studio, hãy sử dụng tệp thực thi độc lập cho chương trình. Điều này được tạo tự động.

  1. Điều hướng đến tệp thực thi, có thể được tìm thấy tại đây:
    <your-project-folder>/bin/Debug/netcoreapp3.1/TemperatureConverter.exe
  2. Nhấp vào tệp thực thi để chạy trực tiếp chương trình.

Thêm nhiều hơn vào biểu mẫu Windows của bạn

Hy vọng rằng bây giờ bạn đã hiểu cơ bản về cấu trúc cơ bản của Ứng dụng Windows Form. Bạn có thể tiếp tục khám phá các tính năng bổ sung của Windows Forms bằng cách thử nghiệm với các tiện ích con mới và tìm hiểu sâu hơn về các sự kiện khác nhau có thể được xử lý.

Khi bạn đã quen thuộc hơn với Windows Forms, bạn có thể bắt đầu tạo các ứng dụng phức tạp hơn. Bạn cũng có thể khám phá nhiều cách khác để tạo ứng dụng trên màn hình Windows.


site-in-app-windows

Sử dụng Chrome để tạo ứng dụng Windows 10 từ bất kỳ trang web nào

Đọc tiếp


Thông tin về các Tác giả

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *