Tải bản đầy đủ (.pdf) (59 trang)
  1. Trang chủ
    2. >>
  2. Công Nghệ Thông Tin
    3. >>
  3. Quản trị Web

Bài tập thực hành lập trình trực quan WPF,C#,XAML,CS

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (3.64 MB, 59 trang )

TRƯỜNG ĐẠI HỌC HỒNG ĐỨC
KHOA CÔNG NGHỆ THÔNG TIN VÀ TRÙN THƠNG

BÀI THỰC HÀNH

HỌC PHẦN: LẬP TRÌNH TRỰC QUAN
SỚ TÍN CHỈ: 3
DÙNG CHO: SINH VIÊN NGÀNH CNTT
NGƯỜI BIÊN SOẠN: NGUYỄN THỊ BÍCH NHẬT

THANH HÓA, 9/2021


HƯỚNG DẪN CHUNG

I. CHÍNH SÁCH CỦA MÔN HỌC
−

Sinh viên "bắt buộc" phải in bài thực hành và mang theo khi đến buổi thực hành. Không chấp
nhận cho sinh viên vào lớp nếu không có bài thực hành. Sinh viên vắng 1 (một) buổi thực hành
sẽ bị đánh vắng tương đương 05 (năm) tiết học.

−

Sinh viên phải mang thêm bài giảng lý thuyết, tài liệu tham khảo của học phần.

−

Tổng số buổi thực hành của học phần là 06 buổi, tương đương 30 tiết.

II. PHẦN MỀM PHỤC VỤ


+ Các bài tập thực hành trong học phần này được xây dựng thực hành với ngôn ngữ c# trên bộ công
cụ Visual Studio (Visual Studio phiên bản 2013 hoặc 2015 hoặc 2017 hoặc 2019)
+ Yêu cầu phần cứng, phần mềm liên quan khi cài đặt:
−

CPU: Dual Core 1.8 GHz trở lên

−

RAM: Tối thiểu 2 GB, đề nghị 4 GB, nếu chạy trên máy ảo cần tối thiểu 2.5 GB

−

HDD: 1 GB đến 40 GB, phụ tḥc vào các tính năng được cài đặt

−

Card video hỗ trợ màn hình hiển thị tới thiểu 720 (1280 x 720). Visual Studio làm việc tốt nhất
ở độ phân giải WXGA (1366 x 768) trở lên.

III. TÀI LIỆU THAM KHẢO
[2]
[3] />
1


Bài thực hành số 1

(5 tiết)
✓ Mục tiêu

− Tạo được dự án WPF.
− Tạo các dự án với từng loại layout khác nhau.
− Biết cách tạo các điều khiển cơ bản.
− Biết cách thay đởi các tḥc tính phở biến của từng loại điều khiển cơ bản.
✓ Nội dung thực hành
− Tạo dự án WPF trên bộ công cụ Microsoft Visual Studio.
− Sử dụng các điều khiển cơ bản, các loại layout trong WPF
Bài 1: Khởi động VisualStudio, tạo project, sử dụng các control cơ bản:
+

TextBlock control

+

TextBlock control - Inline formatting

+

Label control

+

TextBox control

+

Button control

+


CheckBox control

+

RadioButton control

+

PasswordBox control

+ Image control
Hướng dẫn tạo project Hello World:

1. File > New > Project menu option.

•

Hộp thoại sau sẽ được hiển thị.

2


•

trong Mẫu, chọn Visual C # và trong bảng giữa, chọn Ứng dụng WPF.

•

Đặt tên cho dự án. Gõ HelloWorld trong lĩnh vực tên và nhấp vào nút OK.


•

Theo mặc định, hai tệp được tạo, một là tệp XAML (mainwindow.xaml) và tệp cịn lại là
tệp CS (mainwindow.cs)

•

Trên mainwindow.xaml, bạn sẽ thấy hai cửa sổ phụ, một là cửa sổ thiết kế và một là cửa
sổ nguồn (XAML).

•

Trong ứng dụng WPF, có hai cách để thiết kế giao diện người dùng cho ứng dụng của bạn. Một là
chỉ cần kéo và thả các thành phần UI từ hộp công cụ vào Cửa sổ thiết kế. Cách thứ hai là thiết kế
giao diện người dùng của bạn bằng cách viết các thẻ XAML cho các thành phần UI. Visual Studio
xử lý các thẻ XAML khi tính năng kéo và thả được sử dụng để thiết kế UI.

•

Trong tệp mainwindow.xaml, các thẻ XAML sau đây được ghi theo mặc định.

xmlns = " />xmlns:x = " />Title = "MainWindow" Height = "350" Width = "604">
<Grid>
</Grid>
</Window>
•

Theo mặc định, Lưới được đặt làm thành phần đầu tiên sau trang.


•

Hãy đi đến hộp cơng cụ và kéo TextBlock vào cửa sổ thiết kế.

3


•

TextBlock trên cửa sổ thiết kế.

•

Nhìn vào cửa sổ nguồn, bạn sẽ thấy Visual Studio đã tạo mã XAML của TextBlock cho bạn.

•

Hãy thay đổi thuộc tính Text của TextBlock bằng mã XAML từ TextBlock thành Hello World.

xmlns = " />xmlns:x = " />Title = "MainWindow" Height = "350" Width = "604">
<Grid>
Margin = "235,143,0,0" TextWrapping = "Wrap" Text = "Hello World!"
VerticalAlignment = "Top" Height = "44" Width = "102" />
</Grid>
</Window>

4



•

sự thay đổi trên Cửa sổ thiết kế.

Khi đoạn mã trên được biên dịch và thực thi, bạn sẽ thấy cửa sổ sau.

Bài 2: Xây dựng form có chứa các điều khiển cơ bản của wpf sử dụng một số tḥc tính và sự kiện
cơ bản(mầu chữ, font chữ, icon kèm theo, click chuột, text change….)
a. TextBlock:

5


b. Label:

c. Button:

6


d. Checkbox

e. RadioButton

f. password box

g. image, menu, combobox, listbox …. (tự tìm hiểu thêm)

7



Bài 3: Xây dựng form với các dạng layout cho ứng dụng có các điều khiển cơ bản
-

Stackpanel

<StackPanel Orientation="Horizontal">
<Label Content="Họ và tên" Height="25px"/>
<TextBox Name="txt_hoVaTen" Margin="10" Width="150px" Height="25px"/>
<Label Content="Tuổi:" Height="25px"/>
<TextBox Name="txtTuoi" Margin="10" Width="80px" Height="25px"/>
<Label Content="Giới tính:" Height="25px"/>
<TextBox Name="txtGioiTinh" Margin="10" Width="100px" Height="25px"/>
<Button Content="Thêm" Height="25px" Width="120px"></Button>
</StackPanel>

-

<!--Thực hiện thêm: để mặc định hoặc để theo chiều dọc-->

WrapPanel

<WrapPanel>
<Label Content="Họ và tên" Height="25px"/>
<TextBox Name="txt_hoVaTen" Margin="10" Width="150px" Height="25px"/>
<Label Content="T̉i:" Height="25px"/>
<TextBox Name="txtTuoi" Margin="10" Width="80px" Height="25px"/>
<Label Content="Giới tính:" Height="25px"/>
<TextBox Name="txtGioiTinh" Margin="10" Width="100px" Height="25px"/>

<Button Content="Thêm" Height="25px" Width="120px"></Button>
</WrapPanel>

-

DockPanel

<DockPanel>

8


<Button Height="30px" Width="80px" Content="top" DockPanel.Dock="Top" Click="click_me"/>
<Button Height="30px" Width="80px" Content="Bottom" DockPanel.Dock="Bottom" Click="click_me"/>
<Button Content="Left" Height="30px" Width="80px" DockPanel.Dock="Left" Click="click_me"/>
<Button Content="Right" Height="30px" Width="80px" DockPanel.Dock="Right" Click="click_me"/>
<TextBox Width="160px" Height="40px" Name="txt_show"/>
</DockPanel>
private void click_me(object sender, RoutedEventArgs e)
{
Button _bt = sender as Button;
txt_show.Text = _bt.Content.ToString() + " Button Clicked";
}

-

Canvas

<Canvas>

Canvas.Top="80px" ></TextBox>

Tài liệu liên quan

Tài liệu bạn tìm kiếm đã sẵn sàng tải về

Tải bản đầy đủ ngay
×