ExControls Version 1.0






4.69/5 (30 votes)
Oct 13, 2006
6 min read

109356

4261
Extending some C# controls to introudce round labels, text boxes, comboboxes etc.
Introduction
When I was looking for some fancy looking user controls for my .NET applications, I found many commercial custom user controls. And, I decided to implement my own custom looking user entry controls.
This is version 1.0 of ExControls. The next versions will contain extra controls, graphics enhancements, and features. Community support and input regarding what to be in version 2.0 will be so much appreciated.
If you have any difficulties downloading or running the demo, please contact me.
Background
To find all about the ExControls library, take a look at the Klik commercial user controls library.
ExControls Library
The ExControls library uses round rectangle effects to render the controls as show in the screenshots in the beginning of the article. The following controls have been implemented:
LabelEntry
TextEntry
ComboBoxEntry
ListBoxEntry
DateTimePickerEntry
LinkLabelEntry
MaskedEditEntry
MonthCalendarEntry
PictureBoxEntry
RoundCornerPanel
RoundRectForm
ExLabel
ExTextBox
Each one of these control inherits from the BaseEntry
user control. The BaseEntry
control encapsulates the drawing and hosting of different controls.
The entry title label holds the title of the entry. The round panel is used to host other controls.
The relation between the controls and BaseEntry
is described in the following diagram
BaseEntry
The base of all the Entry controls. The gradient drawing and sizing logic is encapsulated inside this base class. This class is an abstract
and can't be instantiated.
Properties
public string TitleText
: The title label textpublic Font TitleFont
: The title label fontpublic Color TitleForeColor
: The title label fore colorpublic int TitleWidth
: The title label width, this will affect the hosted control and the round panel sizepublic Image TitleImage
: The title label imagepublic ContentAlignment TitleImageAlign
: The title label image alignmentpublic int TitleImageIndex
: The title label image index, in case of using an image listpublic ImageList TitleImageList
: The title label image listpublic ContentAlignment TitleTextAlign
: The title label text alignmentpublic RightToLeft TitleRightToLeft
: The title label, right or leftpublic Color NormalBackColor1
: The control gradient start normal colorpublic Color NormalBackColor2
: The control gradient end normal colorpublic Color HoverBackColor1
: The control gradient start mouse over colorpublic Color HoverBackColor2
: The control gradient end mouse over colorpublic Color ActiveBackColor1
: The control gradient start focus colorpublic Color ActiveBackColor2
: The control gradient end focus colorpublic Color DisabledBackColor1
: The control gradient start disabled colorpublic Color DisabledBackColor2
: The control gradient end disabled color
LabelEntry
Simple label entry control.
Properties
public Label LabelControl
: The hosted label controlpublic string EntryText
: TheLabel
text
TextEntry
Textbox entry control.
Properties
public TextBox TextBoxControl
: The hosted text controlpublic string EntryText
: TheTextBox
text.
MaskedEditEntry
Masked edit entry control.
Properties
public MaskedTextBox MaskedTextBoxControl
: the hostedMaskedEdit
controlpublic string EntryMaskedText
: theMaskedTextBox
text
ComboBoxEntry
Combo box entry control.
Properties
public ComboBox ComboBoxControl
: The hostedComboBox
controlpublic object DataSource
: The combo box data source, the attribute provider tells the form designer to use theIListSource
to edit this propertypublic string DataMember
: The combo box data member property, theTypeConverter
andEditor
properties tell the form designer how to edit this propertypublic string ValueMember
: The combo box value member, theEditor
properties tell the form designer how to edit this propertypublic string LookupMember
: The combo box selected value property
ListBoxEntry
List box entry control.
Properties
public ListBox ListBoxControl
: The hostedListBox
controlpublic object DataSource
: The list box data source, the attribute provider tells the form designer to use theIListSource
to edit this propertypublic string DataMember
: The list box data member property, theTypeConverter
andEditor
properties tell the form designer how to edit this propertypublic string ValueMember
: The list box value member, theEditor
properties tell the form designer how to edit this propertypublic string LookupMember
: The list box selected value propertyinternal int TitleWidth
: TheTitleWidth
property is hidden and can't be modified for this control
DateTimePickerEntry
Date-time picker entry control.
Properties
public DateTimePicker DateTimePickerControl
: The hostedDateTimePicker
controlpublic DateTime EntryDateTime
: The entry date time value
MonthCalendarEntry
Calendar entry control.
Properties
public MonthCalendar MonthCalendarControl
: The hosted month calendar controlpublic DateTime EntryTodayDate
: The current date to show in the calendarinternal int TitleWidth
: TheTitleWidth
property is hidden and can't be modified for this control
LinkLabelEntry
Link label entry control
Properties
public LinkLabel LinkLabelControl
: The hostedLinkLabel
controlpublic string EntryLinkText
: TheLinkLabel
text
PictureBoxEntry
Picture box entry control
Properties
public PictureBox PictureBoxControl
: The hostedPictureBox
controlpublic Image EntryImage
: ThePictureBox
imageinternal int TitleWidth
: TheTitleWidth
property is hidden and can't be modified for this control
RoundRectForm
A border-less form with round corners. This form supports dragging by mouse, by clicking any where over it.
public partial class RoundCornerForm : Form
{
private bool isDrag = false;
private Size mouseDistance;
public RoundCornerForm()
{
InitializeComponent();
}
private void RoundRectForm_Resize(object sender, EventArgs e)
{
Rectangle rect = new Rectangle(0, 0, Width, Height);
GraphicsPath path = Helper.GetRoundRectPath(rect, 8);
this.Region = new Region(path);
}
private void RoundRectForm_MouseMove(object sender,
MouseEventArgs e)
{
if (isDrag)
{
this.Location = new Point(MousePosition.X -
mouseDistance.Width, MousePosition.Y -
mouseDistance.Height);
}
}
private void RoundRectForm_MouseUp(object sender,
MouseEventArgs e)
{
isDrag = !(e.Button == MouseButtons.Left);
}
private void RoundRectForm_MouseDown(object sender,
MouseEventArgs e)
{
mouseDistance = new Size(MousePosition.X -
Location.X, MousePosition.Y - Location.Y);
isDrag = e.Button == MouseButtons.Left;
}
}
RoundCornerPanel
A panel with round corners to host other controls.
public partial class RoundCornerPanel : Panel
{
public RoundCornerPanel()
{
InitializeComponent();
}
public RoundCornerPanel(IContainer container)
{
container.Add(this);
InitializeComponent();
}
private void RoundCornerPanel_Resize(object sender, EventArgs e)
{
Rectangle rect = new Rectangle(0, 0, Width, Height);
GraphicsPath path = Helper.GetRoundRectPath(rect, 8);
this.Region = new Region(path);
}
}
ExLabel
A label with round corners, and uses gradients to fill the background.
public partial class ExLabel : Label
{
private Color backColorStart = Color.Orange;
public Color BackColorStart
{
get { return backColorStart; }
set
{
if (!value.IsEmpty)
{
backColorStart = value;
}
else
{
backColorStart = Color.Orange;
}
}
}
private Color backColorEnd = Color.FromArgb(255, 206, 157);
public Color BackColorEnd
{
get { return backColorEnd; }
set
{
if (!value.IsEmpty)
{
backColorEnd = value;
}
else
{
backColorEnd = Color.FromArgb(255, 206, 157);
}
}
}
public ExLabel()
{
InitializeComponent();
SetStyle(ControlStyles.UserPaint, true);
}
private void ExLabel_Paint(object sender, PaintEventArgs e)
{
Rectangle rect = new Rectangle(0, 0, Width, Height);
LinearGradientBrush b = new LinearGradientBrush(rect,
BackColorStart, BackColorEnd, 90);
GraphicsPath path = Helper.GetRoundRectPath(rect, 8);
e.Graphics.FillPath(b, path);
ContentAlignment align = this.TextAlign;
StringFormat format = new StringFormat();
switch (align)
{
case ContentAlignment.TopLeft:
format.Alignment = StringAlignment.Near;
format.LineAlignment = StringAlignment.Near;
break;
case ContentAlignment.TopCenter:
format.Alignment = StringAlignment.Center;
format.LineAlignment = StringAlignment.Near;
break;
case ContentAlignment.TopRight:
format.Alignment = StringAlignment.Far;
format.LineAlignment = StringAlignment.Near;
break;
case ContentAlignment.MiddleLeft:
format.Alignment = StringAlignment.Near;
format.LineAlignment = StringAlignment.Center;
break;
case ContentAlignment.MiddleCenter:
format.Alignment = StringAlignment.Center;
format.LineAlignment = StringAlignment.Center;
break;
case ContentAlignment.MiddleRight:
format.Alignment = StringAlignment.Far;
format.LineAlignment = StringAlignment.Center;
break;
case ContentAlignment.BottomLeft:
format.Alignment = StringAlignment.Near;
format.LineAlignment = StringAlignment.Far;
break;
case ContentAlignment.BottomCenter:
format.Alignment = StringAlignment.Center;
format.LineAlignment = StringAlignment.Far;
break;
case ContentAlignment.BottomRight:
format.Alignment = StringAlignment.Far;
format.LineAlignment = StringAlignment.Far;
break;
}
rect.Inflate(-10, 0);
e.Graphics.DrawString(Text, Font,
new SolidBrush(ForeColor), rect, format);
}
}
ExTextBox
A text box with no restriction in sizing (AutoSize
property turned off).
public partial class ExTextBox : TextBox
{
public ExTextBox()
{
InitializeComponent();
this.AutoSize = false;
}
}
Helper class
A class with some helper functions to be used with ExControls or any other. Currently, the RoundRectPath
functionality is implemented in the helper class.
public class Helper
{
private Helper()
{
}
public static GraphicsPath
GetRoundRectPath(RectangleF rect, float radius)
{
return GetRoundRectPath(rect.X, rect.Y,
rect.Width, rect.Height, radius);
}
public static GraphicsPath GetRoundRectPath(float X,
float Y, float width, float height, float radius)
{
GraphicsPath gp = new GraphicsPath();
gp.AddLine(X + radius, Y, X + width - (radius * 2), Y);
gp.AddArc(X + width - (radius * 2), Y, radius * 2,
radius * 2, 270, 90);
gp.AddLine(X + width, Y + radius, X + width,
Y + height - (radius * 2));
gp.AddArc(X + width - (radius * 2), Y + height - (radius * 2),
radius * 2, radius * 2, 0, 90);
gp.AddLine(X + width - (radius * 2),
Y + height, X + radius, Y + height);
gp.AddArc(X, Y + height - (radius * 2),
radius * 2, radius * 2, 90, 90);
gp.AddLine(X, Y + height - (radius * 2), X, Y + radius);
gp.AddArc(X, Y, radius * 2, radius * 2, 180, 90);
gp.CloseFigure();
return gp;
}
}
Control Properties Attributes Pain
The controls property attributes was the most pain while developing the ExControls 1.0. The documentation is poor, and the resources are little. So I added this section to describe some of the attributes I used in ExControls 1.0.
DefaultBindingProperty("PropertyName")
Attribute to specify which control property to be used by default when binding.
LookupBindingProperties("DataSource", "DataMember", "ValueMember", "LookupMember")
Attribute to specify which control properties to bind list/combo control to data source.
DesignerSerializationVisibility(DesignerSerializationVisibility.Content)
Attribute to tell the form designer to serialize all the changes done by the control property that has internal properties. This attribute is used with control properties like: TextBoxControlPropery
, ComboBoxControl
. If this attribute is omitted, any changes you do to the property will not be saved.
Bindable(true)
Attribute to specify whether the control property can be bound to the data source or not.
Data Binding
The controls can be bound to any data source like the standard .NET controls. To use ExControls for binding from VS 2005 Data Sources window, select the appropriate ExControl for each field you want to bind to. For example: TextEntry
for text fields, LabelEntry
for read only fields, etc..
Manual binding is also available via the Controls data binding properties.
What's Next
- Support more controls (numeric edit, spin up/down, progress, slider, etc..), other suggestions are welcome.
- Fix bugs
- Enhance control appearance more (for
ComboBox
andDateTimePicker
) - Generate documentation
- Any other ideas
History
- 11-Oct-2006
- Version 1.0 release
- 18-Oct-2006
- Removed strong name signing file password