Đang tải... (xem toàn văn)
TÀI LIỆU THAM KHẢO 2 https:wpftutorial.com 3 https:www.tutorialspoint.comwpfindex.htm 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 thuộ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
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Ỉ: 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 đế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 (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 học phần này được xây dựng thực hành với ngôn ngữ c# bộ công cụ Visual Studio (Visual Studio phiên bản 2013 2015 2017 2019) + Yêu cầu phần cứng, phần mềm liên quan cài đặt: − CPU: Dual Core 1.8 GHz trở lên − RAM: Tối thiểu GB, đề nghị GB, nếu chạy máy ảo cần tối thiểu 2.5 GB − HDD: GB đến 40 GB, phụ tḥc vào các tính được cài đặt − Card video hỗ trợ 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] https://wpf-tutorial.com [3] https://www.tutorialspoint.com/wpf/index.htm Bài thực hành số (5 tiết) ✓ Mục tiêu − Tạo được dự án WPF − Tạo dự án với loại layout khác − Biết cách tạo các điều khiển bản − Biết cách thay đởi tḥc tính phở biến của loại điều khiển bản ✓ Nội dung thực hành − Tạo dự án WPF bộ công cụ Microsoft Visual Studio − Sử dụng các điều khiển bản, loại layout WPF Bài 1: Khởi động VisualStudio, tạo project, sử dụng control 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: File > New > Project menu option • Hộp thoại sau hiển thị • Mẫu, chọn Visual C # bảng giữa, chọn Ứng dụng WPF • Đặt tên cho dự án Gõ HelloWorld lĩnh vực tên nhấp vào nút OK • Theo mặc định, hai tệp tạo, tệp XAML (mainwindow.xaml) tệp lại tệp CS (mainwindow.cs) • Trên mainwindow.xaml, bạn thấy hai cửa sổ phụ, cửa sổ thiết kế 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 bạn Một cần kéo thả thành phần UI từ hộp công cụ vào Cửa sổ thiết kế Cách thứ hai thiết kế giao diện người dùng bạn cách viết thẻ XAML cho thành phần UI Visual Studio xử lý thẻ XAML tính kéo thả sử dụng để thiết kế UI • Trong tệp mainwindow.xaml, thẻ XAML sau ghi theo mặc định • Theo mặc định, Lưới đặt làm thành phần sau trang • Hãy đến hộp công cụ kéo TextBlock vào cửa sổ thiết kế • TextBlock cửa sổ thiết kế • Nhìn vào cửa sổ nguồn, bạn thấy Visual Studio tạo mã XAML TextBlock cho bạn • Hãy thay đổi thuộc tính Text TextBlock mã XAML từ TextBlock thành Hello World • thay đổi Cửa sổ thiết kế Khi đoạn mã biên dịch thực thi, bạn thấy cửa sổ sau Bài 2: Xây dựng form có chứa điều khiển wpf sử dụng mợt số tḥc tính kiện bản(mầu chữ, font chữ, icon kèm theo, click chuột, text change….) a TextBlock: b Label: c Button: d Checkbox e RadioButton f password box g image, menu, combobox, listbox … (tự tìm hiểu thêm) Bài 3: Xây dựng form với dạng layout cho ứng dụng có điều khiển - Stackpanel - WrapPanel - DockPanel private void click_me(object sender, RoutedEventArgs e) { Button _bt = sender as Button; txt_show.Text = _bt.Content.ToString() + " Button Clicked"; } - Canvas - Grid Bài 4: Tạo dự án WPF bộ công cụ Visual Studio, thao tác với các điều khiển (control) bản của WPF: Label (nhãn), TextBox (Hộp soạn thảo), Button (Nút bấm), CheckBox (Hộp chọn), RadioButtom (Lựa chọn), ListBox, ComboBox (lựa chọn danh sách)… Thiết kế giao diện hình Khi nhấn chọn vào phép tính kết thơng báo có thơng tin: họ tên, giới tính, Q qn, chọn mơn học Bước 3: Trong File MainWindow.xaml: Tạo Form theo mẫu Code Xaml: Bước 4: Trong File MainWindows.xaml.cs: ❖ Hiển thị tất sách 44 ❖ Thêm Sách vào CSDL - Khi Click vào nút Thêm-> Tất cả TextBox đều Clear Sau nhập thông tin Sách vào Textbox, nhấn vào nút Ghi nhận -> Sách được thêm vào CSDL, hiển thị lên DataGrid Clear TextBox ➔ Tại nút Thêm thực hiện: Clear, Focus vào txtMaSach Tại nút Ghi nhận: Thêm CSDL vào Database, gọi reload (Hiển thị liệu lên Datagrid) ➔ ❖ Sửa thông tin CSDL - Click chọn Sách Datagrid (Thông tin sách sẽ hiện lên Textbox tương ứng) -> Nhấn nút Sửa (DataGrid sẽ bị Enable=False) 45 - Sau sửa thông tin Sách Textbox -> Nhấn nút Ghi nhận -> Thông tin sách DataGrid sẽ được cập nhật Clear Textbox - 46 Bài quản lý sinh viên bool UpdateSinhVien(long id, string maSV, string hoTen, int diemRenLuyen) { var context = new QLSinhVienEntities1(); if (context.SinhViens.Any(x => x.MaSV == maSV && x.Id != id)) return false; //Lấy ghi cũ CSDL var updatingItem = context.SinhViens.Find(id); if (updatingItem == null) return false;//Nếu không thấy =>update không thành công //Cập nhật lại thông tin updatingItem.MaSV = maSV; updatingItem.TenSinhVien = hoTen; updatingItem.DiemRenLuyen = diemRenLuyen; context.Entry(updatingItem).State = System.Data.Entity.EntityState.Modified; context.SaveChanges(); return true; } bool AddSinhVien(string maSV, string hoTen, int diemRenLuyen) { var context = new QLSinhVienEntities1(); if (context.SinhViens.Any(x => x.MaSV == maSV)) return false; var newItem = new SinhVien() { MaSV = maSV, TenSinhVien = hoTen, DiemRenLuyen = diemRenLuyen }; context.SinhViens.Add(newItem); context.SaveChanges(); return true; } private void btnSave_Click(object sender, RoutedEventArgs e) { string maSV = tbMaSV.Text; string hoTen = tbTenSV.Text; int diemRenLuyen; int.TryParse(tbDiemRenLuyen.Text.Trim(), out diemRenLuyen); if (gridSinhVien.SelectedItem == null)//Đang thêm { AddSinhVien(maSV, hoTen, diemRenLuyen); } else { var id = ((SinhVien)gridSinhVien.SelectedItem).Id; UpdateSinhVien(id, maSV, hoTen, diemRenLuyen); } LoadDataToGrid(); } private void gridSinhVien_SelectionChanged(object sender, SelectionChangedEventArgs e) { btnCancel.IsEnabled = btnDelete.IsEnabled = (gridSinhVien.SelectedIndex != -1); if(gridSinhVien.SelectedIndex != -1) { var sv = (SinhVien)gridSinhVien.SelectedItem; tbMaSV.Text = sv.MaSV; tbTenSV.Text = sv.TenSinhVien; tbDiemRenLuyen.Text = sv.DiemRenLuyen.ToString(); } } private void btnCancel_Click(object sender, RoutedEventArgs e) { gridSinhVien.SelectedIndex = -1; } private void btnDelete_Click(object sender, RoutedEventArgs e) { if (gridSinhVien.SelectedItem != null) { var sv = (SinhVien)gridSinhVien.SelectedItem; var context = new QLSinhVienEntities1(); var item = context.SinhViens.Find(sv.Id); 47 if (item != null) context.SinhViens.Remove(item); context.SaveChanges(); LoadDataToGrid(); } } private void btnAdd_Click(object sender, RoutedEventArgs e) { gridSinhVien.SelectedIndex = -1; tbMaSV.Text = tbTenSV.Text = ""; tbMaSV.Focus(); } } } Bài 2: Cho CSDL được thiết kế hình vẽ: Thực hiện yêu cầu: - Đưa liệu từ bảng LoaiSach vào Combobox tên loại sách - Hiển thị liệu của bảng Sách DataGridView - Thực hiện chức nhập mới sách theo Loại sách 48 Hướng dẫn: Tạo CSDL Như bài yêu cầu (2 bảng: Loại sách Sách) Chuỗi kết nối tệp config: 49 Lớp Kết nối CSDL: Lớp Loại sách: 50 Với combobox Loại sách: Mã nguồn codebehin Chạy chương trình và xem demo 51 Bài 3: Xây dựng CSDL: Tạo chức phân quyền: Bước 1: Kết nối CSDL Tạo thư mục Dao-> Kết nối CSDL Bước 2: Tạo Form LoginWindows 52 Trong File App.xaml -> Khởi đợng chương trình bắt đầu Form Login 53 Trong File LonginWindow.xaml: Code xaml: Bước 3: Tạo Form AdminWindow Code Xaml: 54 Bước Tạo Form ThuThuWindow Bước 5: Tạo Form BanDocWindow 55 Code xaml: Bước 6: Khởi tạo liệu (Chỉ chạy lần đầu) Trong File LoginWindow.xaml.cs 56 public partial class Login : Window { QuanLySachDb db = new QuanLySachDb(); NguoiDung user; public void InnitData()//Khởi tạo liệu { NguoiDung admin = new NguoiDung(); admin.HoTen = "Administrator"; admin.Username = "admin"; admin.Password = Common.admin.LaQuanTri = true; if(!db.NguoiDungs.Any(x=>x.Username==admin.Username)) { db.NguoiDungs.Add(admin); db.SaveChanges(); } NguoiDung thuthu = new NguoiDung(); thuthu.HoTen = "Bích nhật"; thuthu.Username = "thuthu"; thuthu.LaThuThu = true; thuthu.Password = Common.Sha256_hash("thuthu"); if (!db.NguoiDungs.Any(x => x.Username == thuthu.Username)) { db.NguoiDungs.Add(thuthu); db.SaveChanges(); } NguoiDung bandoc = new NguoiDung(); bandoc.HoTen = "Diệu Linh"; bandoc.Username = "bandoc"; bandoc.LaBanDoc = true; bandoc.Password = Common.Sha256_hash("bandoc"); if (!db.NguoiDungs.Any(x => x.Username == bandoc.Username)) { db.NguoiDungs.Add(bandoc); db.SaveChanges(); } } public Login() { InitializeComponent(); InnitData(); } Bước 7: Xử lý kiện với nút Login Trong File AdminWindow.xaml.cs 57 Trong File LoginWindow.xaml.cs private void btnLogin_Click(object sender, RoutedEventArgs e) { string userName = txtUsername.Text; string password = Common.Sha256_hash(txtPassword.Password); user = db.NguoiDungs.Where(x => x.Username == userName && x.Password == password).FirstOrDefault(); if(user==null) { MessageBox.Show("Sai tên đăng nhập mật khẩu"); } else { Window w=new Window(); if (user.LaQuanTri==true) w = new AdminWindow(user); else if (user.LaThuThu == true) w = new ThuThuWindow(user); else if (user.LaBanDoc == true) w = new BanDocWindow(user); w.Show(); this.Close(); } } Bước 8: Logout private void lblLogout_MouseDown(object sender, MouseButtonEventArgs e) { if(MessageBox.Show("Bạn có chắn muốn đăng xuất","Thơng báo", MessageBoxButton.YesNo)==MessageBoxResult.Yes) { Login loginWindow = new Login(); this.Close(); loginWindow.Show(); } } 58