Lập trình UD Desktop_07_ListView (tt) TreeView (tt) Menu

Bài trước: Lập trình UD Desktop_06_ListView (tt) TreeView
-----

Viết xử lý khi người dùng bấm chuột vào một thư mục bên TreeView, chương trình sẽ hiển thị thư mục và tập tin có trong thư mục đó ra cửa sổ bên phải.


Để bắt sự kiện người dùng bấm chuột vào một mục của TreeView sử dụng sự kiện TreeNodeMouseClickEventArgs

Để xóa sạch ListView, dùng hàm: ListView.Items.Clear();

Đọc thêm về item.SubItems.AddRange(subItems); tại đây: https://msdn.microsoft.com/en-us/library/1c1wawcw(v=vs.110).aspx

Đọc thêm về điều chỉnh kích thước cột của ListView (lvExplorer.AutoResizeColumns(ColumnHeaderAutoResizeStyle.HeaderSize);) tại đây:

Gắn sự kiện bấm chuột vào TreeView (viết trong hàm khởi tạo của Form):

this.treeView1.NodeMouseClick +=
            new TreeNodeMouseClickEventHandler(this.treeView1_NodeMouseClick);

[Tham khảo mã nguồn]

public Form1()
        {
            InitializeComponent();
            XuatTreeView();
            this.tvExplorer.NodeMouseClick += new TreeNodeMouseClickEventHandler(this.tvExplorer_NodeMouseClick);
        }


// hàm xử lý khi người dùng chọn một thư mục ở khung bên trái,
        // xuất thư mục con và tập tin sang khung bên phải
        void tvExplorer_NodeMouseClick(object sender, TreeNodeMouseClickEventArgs e)
        {
            // lấy nút được chọn
            TreeNode newSelected = e.Node;
            // xóa sạch lvExplorer
            lvExplorer.Items.Clear();
            // lấy thông tin của nút được chọn, dựa vào thông tin được gắn trước đó - khi tạo nút
            DirectoryInfo nodeDirInfo = (DirectoryInfo)newSelected.Tag;
            // khai báo mảng subItems
            ListViewItem.ListViewSubItem[] subItems;
            // khai báo biến item
            ListViewItem item = null;
            // duyệt để hiển thị các thư mục bên trong
            foreach (DirectoryInfo dir in nodeDirInfo.GetDirectories())//với mỗi thư mục con
            {
                // tạo một item gồm tên thư mục và icon đi kèm
                item = new ListViewItem(dir.Name, 0);
                // lấy thêm thông tin về Type và Last Modified của thư mục
                subItems = new ListViewItem.ListViewSubItem[]
                    { new ListViewItem.ListViewSubItem (item, "Directory"),
                      new ListViewItem.ListViewSubItem(item, dir.LastAccessTime.ToShortDateString())};
                // đưa thông tin về Type và Last Modified vào item
                item.SubItems.AddRange(subItems);
                // gắn item vào ListView
                lvExplorer.Items.Add(item);
            }
            // duyệt để hiển thị các tập tin bên trong
            foreach (FileInfo file in nodeDirInfo.GetFiles())
            {
                // tạo một item gồm tên tập tin và icon đi kèm
                item = new ListViewItem(file.Name, 1);
                // lấy thêm thông tin về Type và Last Modified của tập tin
                subItems = new ListViewItem.ListViewSubItem[]
                    { new ListViewItem.ListViewSubItem (item, "File"),
                      new ListViewItem.ListViewSubItem (item, file.LastAccessTime.ToShortDateString()) };
                item.SubItems.AddRange(subItems);
                lvExplorer.Items.Add(item);
            }
            // điều chỉnh lại kích thước cột
            lvExplorer.AutoResizeColumns(ColumnHeaderAutoResizeStyle.HeaderSize);
        }
[Giao diện kết quả]



2.16       MenuStrip


Xem clip tham khảo:


MenuStrip được sử dụng để tạo menu. Trong menu có thể có các mục, menu con, combobox, textbox, separator.

Có thể xem mỗi thành phần trong một MenuStrip là một control, do vậy có thể bắt sự kiện và thực hiện các xử lý tương ứng.

Có thể thiết lập phím tắt cho một mục trong menu, thiết lập trong thuộc tính ShortcutKeys.

Để chèn hình ảnh cho mỗi mục trong menu, thiết lập trong thuộc tính image.

Để thay đổi vị trí của thanh menu trên form, thiết lập trong thuộc tính Dock. Nhớ phải chọn menu trước thì mới thấy thuộc tính Dock, bấm vào biểu tượng của menuStrip ở cửa sổ phụ phía dưới.

Lab 13. Thêm menu View cho chương trình FileExplorer

[Yêu cầu]

– Quan sát cách hoạt động thực tế của menu View trong File Explorer để có ý tưởng về các việc cần làm

– Thêm các chức năng của menu View vào chương trình FileExplorer (Lab 12)

– Khi người dùng rê chuột lên một chế độ xem bất kỳ (LargeIcon, SmallIcon, Details, Tile, List), cửa sổ bên phải sẽ thay đổi theo chế độ xem tương ứng. Tuy nhiên, chỉ thực sự chuyển chế độ xem khi người dùng bấm chuột vào một mục.

[Gợi ý cách làm]

– Thiết lập menu như hình sau



– Tạo thêm imageList2 để chứa các Icon của thư mục và tập tin với kích thước lớn hơn. Thuộc tính Images chứa Icon của Thư mục và Tập tin như trong smallImageList, chỉ thay đổi thuộc tính ImageSize là 40x40

– Trỏ thuộc tính LargeImageList của lvExplorer tới imageList2

– Khi người dùng rê chuột lên mỗi mục của menu View, viết xử lý cho sự kiện MouseHover: (tạm) chuyển chế độ xem của lvExplorer sang chế độ tương ứng

Ví dụ hàm xử lý cho sự kiện rê chuột,

        private void listToolStripMenuItem_MouseHover(object sender, EventArgs e)
        {
            lvExplorer.View = View.List;
        }

– Khi người dùng rê chuột ra ngoài vùng các mục con (DropDown) của menu View:  chuyển chế độ xem của lvExplorer về chế độ xem trước đó. Ví dụ, khi mới chạy chương trình mà người dùng chưa chọn chế độ xem mới thì “chế độ xem trước đó” sẽ là Details

// tạo sự kiện để xử lý khi người dùng rê chuột ra ngoài vùng các mục chọn của View
public Form1()
        {
bool flagClick = false; // kiểm tra xem item trong View có được click không. false: không; true: có
            string lastViewType = "Details"; // kiểu View trước đó, khởi tạo là Details
            string currentViewType = "Details"; // kiểu View hiện thời, khởi tạo luôn là Details
           
InitializeComponent();
            XuatTreeView();
            this.tvExplorer.NodeMouseClick += new TreeNodeMouseClickEventHandler(this.tvExplorer_NodeMouseClick);
            viewToolStripMenuItem.DropDown.MouseLeave += new EventHandler(DropDown_MouseLeave);
        }
// Viết hàm xử lý DropDown_MouseLeave
void DropDown_MouseLeave(object sender, EventArgs e)
        {
            // kiểm tra xem trước đó có click chuột vào item không
            if (flagClick == true) {
                flagClick = false;// reset lại cờ báo
                lastViewType = currentViewType;
            }
            switch (lastViewType)
            {
                 case "Details":
                      lvExplorer.View = View.Details;
                      break;
                 case "LargeIcon":
                      lvExplorer.View = View.LargeIcon;
                      break;
                 case "SmallIcon":
                      lvExplorer.View = View.SmallIcon;
                      break;
                 case "Tile":
                      lvExplorer.View = View.Tile;
                      break;
                 case "List":
                      lvExplorer.View = View.List;
                      break;
                }
        }

– Chỉ khi nào người dùng bấm chuột chọn một mục của menu thì mới chuyển lvExplorer sang chế độ xem tương ứng, đồng thời đóng lại các mục con của menu View

Ví dụ hàm xử lý cho sự kiện bấm chuột vào một mục của menu View,

private void tileToolStripMenuItem_Click(object sender, EventArgs e)
        {
            flagClick = true;
            currentViewType = "Tile";
        }

[Giao diện kết quả]




<///// hết buổi 9
-----
Tiếp theo: Lập trình UD Desktop_08_ToolTip StatusBar
Xem thêm: Danh sách các bài học