Click here to Skip to main content
Click here to Skip to main content
Go to top

Custom Arrow Button

, 13 Sep 2005
Rate this:
Please Sign up or sign in to vote.
A button that looks like an arrow.

Testform with several ArrowButtons

Introduction

In an earlier VC++ (MFC) project, I designed a GUI with which the assistance robots in a machine could be positioned. For that I changed the rectangular button shape into an arrow shape. I have taken up the idea to program such arrows also in C# (.NET Framework). For that I read the most, very helpful, article about shaped forms on CodeProject. So with that information and the goal to deepen my knowledge in C# (GDI+, .NET Framework), I started the project. Here is the result.

Using the code

The project is designed as a custom control. In my article "PictureBox with zooming and scrolling", I described how to install and use such a control, or have a look at the different articles about that topic in CodeProject, for example "Writing your Custom Control: step by step" by Alexandr Khilov.

Methods / Properties

The control provides six designer related properties:

Designer properties

  • NormalStartColor, NormalEndColor -> Start- and End color for the LinearGradientBrush in normal state.
  • HoverStartColor, HoverEndColor -> Start- and End color for the LinearGradientBrush if the mouse cursor is over the arrow.
  • Rotation -> The pointing direction of the arrow in degrees. Starting with 0° at 12 O' clock raising clockwise to 360°.
  • ArrowEnabled -> Enable or disable the button. Act like the enable/disable in other controls.

Events

There is one public event in the class OnClickEvent. The event is fired if the mouse button is over the arrow and pressed.

Helper classes

The class BitArray is a simple helper class that I used to hold different button states (and to play a little bit with indexer). In the code you can see how to work with it.

ArrowButtonDesigner is derived from System.Windows.Forms.Design.ControlDesigner. A base designer class for extending the design mode behavior of a control. I used it only to hide properties.

A suggestion about the demo

Apart from the buttons -X and +X the other buttons have no function. If you click the x-value lower than 0 or make it bigger than 50, the HoverColor of the special ArrowButton will change to red.

Known restrictions

  • If you make the arrow too big, sometimes the calculation to prevent clipping doesn't work correct.
  • There is no test to check if the button text is correct in length and size.

License

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

Share

About the Author

Alexander Kloep
Software Developer www.rowa.de
Germany Germany
Working as software engineer since 2001. I started with c, c++ came up to c# and wpf today.

Comments and Discussions

 
GeneralGood control PinmemberBill Seddon7-Jan-07 1:21 

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

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

| Advertise | Privacy | Mobile
Web04 | 2.8.140916.1 | Last Updated 13 Sep 2005
Article Copyright 2005 by Alexander Kloep
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid