Dynamic tree list display of WinForm development main interface Menu

I have in a lot of articles, introduced WinForm main interface development, basically is the standard interface, placed on the top of the toolbar, the middle area is a multi-document content, but at the top of the menu more, you need to divide the menu into a few levels, such as the top menu can be placed on the level one or two menu, This way in general function point is not too much, the appearance of the interface effect is more intuitive, but also more beautiful. However, with the increase of some system functions, this way may seem to be more crowded, so we can put a tree on the left side of the list, so through the shrinking of the tree list, we can put a lot of menu functions.

1, the menu of tree-shaped list display

In general, the display of the tree list can be divided into multiple nodes, the node can be shrunk or expanded, of course, the node has a different icon. In this way, many function points can be integrated into a tree list, the nodes of the tree can be divided into many levels, many levels

If we want to differentiate according to the scope of business, can also be divided into several modules to show, similar to the way the tab, a module of the Function menu list to display together, as shown below.

The above folding display is advantageous to the business category, and can make the tree menu menu not very large, is a better interface organization.

2, the dynamic configuration of the menuManagement

The above describes the tree menu display, and how to organize the contents of the menu, to do this, we have laid the interface menu organization of the embryonic.

Then the problem comes, we generally need to create a lot of menus according to the system, if it can be configured in a way, so as to better manage these menus, and can dynamically assign permissions to the menu, to achieve different role user permissions control.

Then we need to introduce a menu management module in the system to implement the menu configuration management function, so that we can dynamically create the menu operation later.

Through the configuration of the menu, we can specify the menu icon, whether it is visible, whether to expand, the right control point, and the menu trigger click, the processing of the form object and other information, with these basic information, we are easy to put the menu in the tree list in the appropriate, beautiful display.

3, the implementation of dynamic menu construction

Described earlier, how to store the menu data in the database, so that we can be in the system's main interface, the dynamic construction of the list of properties to display the menu operation.

Firstly, we need to design the layout of the main interface at design time, and put some initialized tree lists to make it easier to see the effects. As for the contents, we can dynamically retrieve the menu information from the database according to the menu configuration of the database, and build it in the tree list on the left.

We can create the menu dynamically through an auxiliary class, as shown below.

        Private void Inittoolbar ()        {            new treemenuhelper (This this. imageList1);            Helper. Init ();        }

In the case of auxiliary classes, passing in parameters such as the current form, and the navigation controls on the left, we encapsulate the logical processing of the corresponding dynamic build menu in the helper class.

First of all, we started the dynamic creation, to clear the original control to display the menu content, and re-obtained from the database, as shown in the following code.

            //clears the contents of all navigation controlsbarControl.Controls.Clear ();            BarControl.Groups.Clear ();            BarControl.Items.Clear ();  This. ImageList.Images.Clear (); //limit display of several navigation tabsBarcontrol.navigationpanemaxvisiblegroups =3; //There are 3 levels in the Contract menu, the first level is the big category, the second level is the Small module group, the third level is the specific menulist<menunodeinfo> menulist = bllfactory<sysmenu>.            Instance.gettree (Portal.gc.SystemType); if(Menulist.count = =0)return;

Then we will walk through the menu and determine if there is a corresponding permission point, and if there is no corresponding permission, then the submenu of the corresponding menu will not be shown further.

            // recursively traverse all menus for grading            foreach inch menulist)            {                // If there are no permissions on the menu, skip                if continue;

When creating a menu, we notice that the entire menu item is dynamically built, so we need to dynamically build the corresponding tab navbargroup, display container navbargroup, tree object TreeView, Navbarcontrol control Properties, Tree node TreeNode, and so on, as shown in the following code.

TreeView TreeView =NewTreeView (); Treeview.dock=DockStyle.Fill; Treeview.imagelist= This. imageList; Treeview.itemheight= -;//Set the height, display more beautifulNavbargroupcontrolcontainer Container=NewNavbargroupcontrolcontainer (); Container. Size=NewSystem.Drawing.Size (213,412); Container.                Controls.Add (TreeView);                BARCONTROL.CONTROLS.ADD (container); //load Icon                 This. IMAGELIST.IMAGES.ADD (LoadIcon (Firstinfo.icon)); intindex = This. ImageList.Images.Count-1;//last ordinalNavbargroup Group=NewNavbargroup (); Group. Caption=Firstinfo.name; Group. Controlcontainer=container; Group. Expanded=true; Group. Groupclientheight=410; Group. GroupStyle=Navbargroupstyle.controlcontainer; Group. Largeimageindex=index; Group. Smallimageindex=index;                BARCONTROL.GROUPS.ADD (group); //Create a level listTreeNode Pnode =NewTreeNode (); Pnode.text=Firstinfo.name; Pnode.tag=Firstinfo.winformtype; Pnode.imageindex=index; Pnode.selectedimageindex=index;                TREEVIEW.NODES.ADD (Pnode); //recursively creating sub-listsAddtreeitems (Pnode, Firstinfo.children);

By recursion, it is easy to recursively construct all levels of the tree menu and display it appropriately.

Menu Click event, we can do it with a function code implementation.

                // Handle the Click action of the Tree menu, if tag exists, parse and load the corresponding page into multiple documents                Treeview.afterselect + = (sender, e) + =                {                    stringasstring;                     if (! string . IsNullOrEmpty (tag))                    {                        loadpluginform (tag);                    }                };

This is the processing of its AfterSelect event, which enables us to dynamically load the form object to the multi-document interface.

4, the overall effect of the system interface

Finally, in order to better understand the entire dynamic menu interface effect, paste a few Good interface display diagram, for reference learning.

1) How to handle the standard interface

2) How to handle the tree list interface

Open the Multi-document page as shown below.

Dynamic tree list display of WinForm development main interface Menu