Editable Label

[brandonio21]

This is more of a control than a code snippet, but I wanted to share my "editable label" control anyway.

The premise behind this control is the idea that users should be able to view and edit information; however, the ability to edit should remain non-intrusive. This is especially useful for people like on-phone tech-support who often need to view information but very rarely need to edit it.

The control consists of the following items
-A FlowLayoutPanel
-Two Labels
-A TextBox

Here is the code behind the control:
[code2=vbnet]Public Class ChangableLabel
'============================================================================
'ChangableLabel class created by Brandon Milton (brandonio21)
'This class was created specifically for a tutorial on the BrandonioProductions YouTube channel
' You can find this channel at: <!-- m --><a class="postlink" href="http://youtube.com/BrandonioProductions">http://youtube.com/BrandonioProductions</a><!-- m -->
'Discussion of this class is held at BP Forums
' A direct link to the thread: <!-- l --><a class="postlink-local" href="http://bpforums.info/viewtopic.php?f=22&t=745">viewtopic.php?f=22&t=745</a><!-- l -->
'Feel free to use this class in any way, but please remember to credit the author somewhere in the application
'=============================================================================

Public Property IdentifierText As String
'This property allows us to change the text of the first label when objectilized (sp?)
Get
Return lbl_identifier.Text
End Get
Set(value As String)
lbl_identifier.Text = value
End Set
End Property
Public Property InformationText As String
'This property allows us to change the text of the second label when objectilized (sp?)
Get
Return lbl_information.Text
End Get
Set(value As String)
lbl_information.Text = value
End Set
End Property

Private Sub lbl_information_MouseDoubleClick(sender As System.Object, e As System.Windows.Forms.MouseEventArgs) Handles lbl_information.MouseDoubleClick
'Here we want the textbox to appear
Dim oldLabel As Label = CType(flp_main.Controls.Item(1), Label) 'Save the label
flp_main.Controls.RemoveAt(1) 'Remove the label from the FlowLayoutPanel (so it can be replaced)

Dim txt_information As New TextBox 'Create textbox
Dim textboxSize As New Size(GetLabelWidth(oldLabel) + 25, txt_information.Size.Height) 'set size to ~ same size as label to avoid awkwardness
txt_information.Size = textboxSize 'set the size
txt_information.Text = oldLabel.Text 'set the text as old label text
AddHandler txt_information.KeyPress, AddressOf txt_information_keypress 'add handler to detect "enter" presses

flp_main.Controls.Add(txt_information) 'add the textbox to the FlowLayoutPanel
End Sub

Private Function GetLabelWidth(ByVal label As Label) As Integer
'This method gets the pixel width of labels
Dim g As Graphics = label.CreateGraphics() 'create graphix object for label to access info
Dim fontSize As SizeF 'var to save font sizes
fontSize = g.MeasureString(label.Text, label.Font) 'save the pixeled size of the label's text
Return fontSize.Width 'return the object (this is a function, afterall)
End Function
Private Sub txt_information_keypress(sender As Object, e As KeyPressEventArgs)
'this method is used to detect when the enter key is pressed on the textbox, return everything to normal state
If (e.KeyChar = Microsoft.VisualBasic.ChrW(Keys.Enter)) Then
Dim txt_information As TextBox = CType(sender, TextBox) 'save textbox var
Dim newLabel As New Label 'create new label
newLabel.AutoSize = True 'This gave lots of problems; allows for the control to resize with new label
newLabel.Text = txt_information.Text 'set the labels text to user input
AddHandler newLabel.MouseDoubleClick, AddressOf lbl_information_MouseDoubleClick
AddHandler newLabel.TextChanged, AddressOf ResizeControl
'^Adding handlers to resize the control and to detect double clicks, self-explanatory

'now we need to remove the textbox and add the label
flp_main.Controls.RemoveAt(1)
flp_main.Controls.Add(newLabel)


ResizeControl() 'resize the entire control to fit the new objects
End If
End Sub

Private Sub ResizeControl() Handles lbl_identifier.TextChanged, lbl_information.TextChanged
'this method resizes the control to fit the new objects and to make room for others around it

'create vars to hold size information
Dim identLabel As Label = CType(flp_main.Controls.Item(0), Label) 'save copy of first label
Dim infoLabel As Label = CType(flp_main.Controls.Item(1), Label) 'save copy of second label
Dim paddingSpace As Integer = 50

Dim width As Integer = GetLabelWidth(identLabel) + GetLabelWidth(infoLabel) + paddingSpace 'add all the widths!
Me.Size = New Size(width, Me.Size.Height) 'set the new size
End Sub


End Class[/code2]

Here is a quick screenshot of the control in action:
[attachment=2]<!-- ia2 -->changeablelabelconcept.png<!-- ia2 -->[/attachment]


Instead of typing out all of the information about this control, I have made a video tutorial that explains it. Watch it here:
[youtube]PcumZmVh4JM[/youtube]

Download the project here:
[attachment=1]<!-- ia1 -->TextBoxChangeControlTut.zip<!-- ia1 -->[/attachment]

Download only the control resources here:[attachment=0]<!-- ia0 -->ChangableLabel.zip<!-- ia0 -->[/attachment]

[Derek275]

Why haven;t more people came up with this?

Though I don't program with .NET anymore, I could see how this could be extremely useful. Once I semi-master the Java language and learn how to make custom controls, I might try to make a Java counter part for this, so it's not only for Window's Operating Systems.

[brandonio21]

, I could see how this could be extremely useful.

I agree! It is seriously beneficial to any office style application.

I might try to make a Java counter part for this, so it's not only for Window's Operating Systems.

Wow! A Java alternative to this control might actually prove very useful! That would be great.