How to Create a Quick Access Toolbar

In our latest how-to video, we show you how to create an Office-inspired Windows Forms application, complete with a Quick Access Toolbar! Check it out: 

TRANSCRIPT:

First, we’ll open up Visual Studio, and go to "File," "New," "New Project," and start with the Windows Forms application. First let's make it larger. To start, we’re going to go to the Toolbox to add the UltraToolbarsManager. When we add that to the form, we're going to get prompted: do we want to add a Panel control? Let’s say yes and add a Panel control to the form, which is going to hold our control. We'll pick the middle option which is the lighter-weight Panel control.

So now what we’ll do is click "Show Ribbon" and right here at the top is a Quick Access Toolbar. To add a new tool here, simply click "Insert New Tool" and it's going to be type “button”, and let’s select “Cut”. At this point, let’s go ahead and add a little Cut button, like Cut and Paste. We’ll hit "Add" and "Close," and now you'll see that the button was added here but it has no image. So let's go ahead and add an image! We’ll right click on that, and under Images, I'm going to say "Set Small Image". I’ll navigate to an image - for a small button, you're going to want to use the image of size 24 x 24. So I’ll select the image called Cut. Click "OK," and click "OK" again, and there you have it. Now, you can see we have a Quick Access Tool right here: Cut. We’ll hit F5 to see what it looks like – and great! It looks good to me!

Now, the only thing we need to do is to handle the click event, and there’s a really easy way to do that. Click on the UltraToolbarsManager, open up the properties, and at the bottom right you'll notice “Generate Tool Click Code”. Let’s click that. Right now, I only have one command but just imagine if you had around 10 or 20 commands here. You're going to hit "Select All" and on the right, you'll see that the code is generated to handle that click event. So we’ll say Select All, Copy To Clipboard, close this, and now we need to get inside that click event of the toolbar. So let's double click to get to the UltraToolbarsManager_ToolClick event. Here we'll paste in our code that was generated for us.

Basically, here's what's happening: in this event, you get a ToolClickEventArg and you're basically just interrogating that object and looking at the key property and doing a case statement, so you might have a case for a copy, case for paste, etc. In this example, we're just going to have a cut, so let's just throw up a quick message - that looks good to me! Now let's hit F5, and there we go! I've gotten a Quick Access Tool here. I'll click it, and there we go. You can see that we've successfully invoked our code and that's all there is to it. To add more, you simply click on that new icon right next to it and just continue adding.