Click here to Skip to main content
15,892,005 members
Articles / Multimedia / GDI+
Article

SplitButton: an XP style dropdown split button

Rate me:
Please Sign up or sign in to vote.
4.73/5 (41 votes)
25 Oct 2006CPOL2 min read 294.1K   11.5K   166   38
The SplitButton control represents a dropdown split button in standard theme-supported XP style.

Demo

Demo

Introduction

Yesterday, I was thinking the best way to solve a particular situation (specific actions derived logically from one) was a split button. Searching and searching on MSDN produced no results, so I was perplexed: no split button in .NET? No, there isn't. The strange thing is that a StripSplitButton (or something like that) exists, that is, the split button equivalent for the ToolStrip. Probably, not being a standard control for the system, they though not to include the control, because it was easy to simulate its functionality with images, and that's what I did.

Using the code

The control is very easy to use. Anyway, this is the step-by-step how-to-do:

  1. Include SplitButton.cs and SplitButton.designer.cs in your project.
  2. Load the assembly in the toolbox of Visual Studio, or just insert a Button control in your form, and then change the type from Button to SplitButton.

    [Updated: Oct '06] You can stop here, default images for split states will be used by the control, or you can follow next steps to customize split images.

    Optional:

  3. Add an ImageList to your form (or control or whatever) and set the ImageList property of the SplitButton to this ImageList.
  4. Add images you want to the ImageList for the SplitButton splitter side statuses: Normal, Hover, Clicked, Disabled, Focused.
  5. Now, have a look at the property windows for the SplitButton, go to "Split Button Images" category, and simply select an image for each status from the list box of images (the ones in the ImageList of the SplitButton).
  6. Now, you can set some suggested options: TextAlign to MiddleLeft, ImageAlign to MiddleRight, and TextImageRelation to TextBeforeImage. You're done.

Now you can set some custom options for the SplitButton, a brief description follows:

  • bool DoubleClickedEnabled - Indicates whether the double click event is raised on the SplitButton.
  • bool AlwaysDropDown - Indicates whether the SplitButton always shows the drop down menu even if the button part is clicked.
  • bool AlwaysHoverChange - Indicates whether the SplitButton always shows the hover image status in the split part even if the button part is hovered.
  • bool CalculateSplitRect - Indicates whether the split rectangle must be calculated (based on the split image size).
  • bool FillSplitHeight - Indicates whether the split height must be filled to the button height even if the split image height is lower.
  • int SplitHeight - The split height (ignored if CalculateSplitRect is set to true).
  • int SplitWidth - The split width (ignored if CalculateSplitRect is set to true).

In addition to this, there are two events:

  • ButtonClick - Occurs when the button part of the SplitButton is clicked.
  • ButtonDoubleClick - Occurs when the button part of the SplitButton is double-clicked.

Conclusion

It's only a simple control, I know, but it could be useful in my opinion.

So, that's all, I think. I hope you'll find it useful, bye!

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Synved Ltd.
Ireland Ireland

Comments and Discussions

 
GeneralRe: Background image stays enabled Pin
Elia Sarti21-Oct-06 5:17
Elia Sarti21-Oct-06 5:17 
GeneralRe: Background image stays enabled Pin
golan.barnov21-Oct-06 5:38
golan.barnov21-Oct-06 5:38 
GeneralRe: Background image stays enabled Pin
Elia Sarti21-Oct-06 13:57
Elia Sarti21-Oct-06 13:57 
GeneralRe: Background image stays enabled Pin
Elia Sarti21-Oct-06 14:07
Elia Sarti21-Oct-06 14:07 
GeneralRe: Background image stays enabled Pin
golan.barnov22-Oct-06 15:31
golan.barnov22-Oct-06 15:31 
GeneralA much easier way without programming. Pin
Joe Sonderegger26-Sep-06 21:25
Joe Sonderegger26-Sep-06 21:25 
GeneralRe: A much easier way without programming. Pin
leggan26-Sep-06 21:41
leggan26-Sep-06 21:41 
GeneralRe: A much easier way without programming. Pin
Joe Sonderegger26-Sep-06 22:03
Joe Sonderegger26-Sep-06 22:03 
It has the same colour as the dialog itself. You should try it...

Have a nice life!!

GeneralRe: A much easier way without programming. Pin
leggan26-Sep-06 22:13
leggan26-Sep-06 22:13 
AnswerRe: A much easier way without programming. Pin
tCodex14-Nov-06 8:29
tCodex14-Nov-06 8:29 
GeneralRe: A much easier way without programming. Pin
Adadurov24-Feb-08 10:16
Adadurov24-Feb-08 10:16 
Questiondo u have a .net 1.1 source available ? Pin
pepedupuis25-Sep-06 4:10
pepedupuis25-Sep-06 4:10 
AnswerRe: do u have a .net 1.1 source available ? Pin
Elia Sarti25-Sep-06 7:51
Elia Sarti25-Sep-06 7:51 
QuestionSplitButton as UserControl Pin
leggan21-Sep-06 0:07
leggan21-Sep-06 0:07 
AnswerRe: SplitButton as UserControl Pin
Elia Sarti21-Sep-06 7:24
Elia Sarti21-Sep-06 7:24 
GeneralRe: SplitButton as UserControl Pin
leggan22-Sep-06 13:19
leggan22-Sep-06 13:19 
Generalnicer looking one Pin
Almighty Bob18-Sep-06 12:32
Almighty Bob18-Sep-06 12:32 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.