Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Editable Label
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=""></a><!-- m -->
'Discussion of this class is held at BP Forums
' A direct link to the thread: <!-- l --><a class="postlink-local" href="">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?)
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?)
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

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:

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

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

Attached Files Thumbnail(s)

.zip (Size: 72.03 KB / Downloads: 144)
.zip (Size: 4.33 KB / Downloads: 147)
My Blog | My Setup | My Videos | Have a wonderful day.
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.
Derek275 Wrote:, I could see how this could be extremely useful.
I agree! It is seriously beneficial to any office style application.

Derek275 Wrote: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.
My Blog | My Setup | My Videos | Have a wonderful day.

Possibly Related Threads...
Thread Author Replies Views Last Post
  Trimming a label brandonio21 2 1,819 07-10-2012, 12:08 PM
Last Post: brandonio21

Forum Jump:

Users browsing this thread: 1 Guest(s)