Articles in this section
Category / Section

How to set the location of the sub text in the WinForms TileLayout?

2 mins read

Set location of sub text

We can display the SubText at custom location on TileLayout. It can be achieved by setting the Location and TextAlign property of ImageStraemer. The following code demonstrates the same.

C#

//Initialize the TileLayout control
this.tileLayout1 = new Syncfusion.Windows.Forms.Tools.TileLayout();
 
//Initilaize the TileLayout Layoutgroup
this.layoutGroup1 = new Syncfusion.Windows.Forms.Tools.LayoutGroup();
 
//initialize the imagestreamer
this.imageStreamer1 = new Syncfusion.Windows.Forms.Tools.ImageStreamer();
this.imageStreamer2 = new Syncfusion.Windows.Forms.Tools.ImageStreamer();
this.imageStreamer3 = new Syncfusion.Windows.Forms.Tools.ImageStreamer();
this.imageStreamer4 = new Syncfusion.Windows.Forms.Tools.ImageStreamer();
 
//Add LayoutGroup into TileLayout
this.tileLayout1.Controls.Add(this.layoutGroup1);
 
//Add ImageStreamer into LayoutGroup
this.layoutGroup1.Controls.Add(this.imageStreamer1);
this.layoutGroup1.Controls.Add(this.imageStreamer2);
this.layoutGroup1.Controls.Add(this.imageStreamer3);
this.layoutGroup1.Controls.Add(this.imageStreamer4);
 
//Add Image to ImageStreamer
this.imageStreamer1.Images.Add(((System.Drawing.Image)(resources.GetObject("imageStreamer1.Images"))));
this.imageStreamer2.Images.Add(((System.Drawing.Image)(resources.GetObject("imageStreamer2.Images"))));
this.imageStreamer3.Images.Add(((System.Drawing.Image)(resources.GetObject("imageStreamer3.Images"))));
this.imageStreamer4.Images.Add(((System.Drawing.Image)(resources.GetObject("imageStreamer4.Images"))));
 
//For ImageStreamer1 SubText
this.imageStreamer1.SubText.Text = "Mouse";
this.imageStreamer1.SubText.ForeColor = Color.Red;
Size size = TextRenderer.MeasureText(imageStreamer1.SubText.Text, this.Font);
 
//Set location of subtext in ImageStreamer
this.imageStreamer1.SubText.Location = new Point(0, this.imageStreamer1.Height –
(size.Height+100));
this.imageStreamer1.SubText.TextAlign = ContentAlignment.TopLeft;
 
//For ImageStreamer2 SubText
this.imageStreamer2.SubText.Text = "Flight 1";
this.imageStreamer2.SubText.ForeColor = Color.Green;
size = TextRenderer.MeasureText(imageStreamer2.SubText.Text, this.Font);
 
//Set location of subtext in ImageStreamer
this.imageStreamer2.SubText.Location = new Point(0, this.imageStreamer2.Height - (size.Height + 2));
this.imageStreamer2.SubText.TextAlign = ContentAlignment.TopLeft;
 
//For ImageStreamer3 SubText
this.imageStreamer3.SubText.Text = "Flight 2";
this.imageStreamer3.SubText.ForeColor = Color.DarkBlue;
size = TextRenderer.MeasureText(imageStreamer3.SubText.Text, this.Font);
 
//Set location of subtext in ImageStreamer
this.imageStreamer3.SubText.Location = new Point(0, this.imageStreamer3.Height –
(size.Height + 100));
this.imageStreamer3.SubText.TextAlign = ContentAlignment.TopRight;
 
//For ImageStreamer4 SubText
this.imageStreamer4.SubText.Text = "Computer";
this.imageStreamer4.SubText.ForeColor = Color.White;
size = TextRenderer.MeasureText(imageStreamer4.SubText.Text, this.Font);
 
//Set location of subtext in ImageStreamer
this.imageStreamer4.SubText.Location = new Point(10, this.imageStreamer4.Height - (size.Height + 50));
this.imageStreamer4.SubText.TextAlign = ContentAlignment.TopCenter;

VB

'Initialize the TileLayout control
Me.tileLayout1 = New Syncfusion.Windows.Forms.Tools.TileLayout()
 
'Initilaize the TileLayout Layoutgroup
Me.layoutGroup1 = New Syncfusion.Windows.Forms.Tools.LayoutGroup()
 
'initialize the Imagestreamer
Me.imageStreamer1 = New Syncfusion.Windows.Forms.Tools.ImageStreamer()
Me.imageStreamer2 = New Syncfusion.Windows.Forms.Tools.ImageStreamer()
Me.imageStreamer3 = New Syncfusion.Windows.Forms.Tools.ImageStreamer()
Me.imageStreamer4 = New Syncfusion.Windows.Forms.Tools.ImageStreamer()
 
'Add LayoutGroup into TileLayout
Me.tileLayout1.Controls.Add(Me.layoutGroup1)
 
'Add ImageStreamer into LayoutGroup
Me.layoutGroup1.Controls.Add(Me.imageStreamer1)
Me.layoutGroup1.Controls.Add(Me.imageStreamer2)
Me.layoutGroup1.Controls.Add(Me.imageStreamer3)
Me.layoutGroup1.Controls.Add(Me.imageStreamer4)
 
'Add Image to ImageStreamer
Me.imageStreamer1.Images.Add((CType(resources.GetObject("imageStreamer1.Images"), System.Drawing.Image)))
Me.imageStreamer2.Images.Add((CType(resources.GetObject("imageStreamer2.Images"), System.Drawing.Image)))
Me.imageStreamer3.Images.Add((CType(resources.GetObject("imageStreamer3.Images"), 
System.Drawing.Image)))
Me.imageStreamer4.Images.Add((CType(resources.GetObject("imageStreamer4.Images"), System.Drawing.Image)))
 
'For ImageStreamer1 SubText
Me.imageStreamer1.SubText.Text = "Mouse"
Me.imageStreamer1.SubText.ForeColor = Color.Red
Dim size_Renamed As Size = TextRenderer.MeasureText(imageStreamer1.SubText.Text, Me.Font)
 
'Set location of subtext in ImageStreamer
Me.imageStreamer1.SubText.Location = New Point(0, Me.imageStreamer1.Height –
(size_Renamed.Height+100))
Me.imageStreamer1.SubText.TextAlign = ContentAlignment.TopLeft
 
'For ImageStreamer2 SubText
Me.imageStreamer2.SubText.Text = "Flight 1"
Me.imageStreamer2.SubText.ForeColor = Color.Green
size_Renamed = TextRenderer.MeasureText(imageStreamer2.SubText.Text, Me.Font)
 
'Set location of subtext in ImageStreamer
Me.imageStreamer2.SubText.Location = New Point(0, Me.imageStreamer2.Height - (size_Renamed.Height + 2))
Me.imageStreamer2.SubText.TextAlign = ContentAlignment.TopLeft
 
'For ImageStreamer3 SubText
Me.imageStreamer3.SubText.Text = "Flight 2"
Me.imageStreamer3.SubText.ForeColor = Color.DarkBlue
size_Renamed = TextRenderer.MeasureText(imageStreamer3.SubText.Text, Me.Font)
 
'Set location of subtext in ImageStreamer
Me.imageStreamer3.SubText.Location = New Point(0, Me.imageStreamer3.Height - (size_Renamed.Height + 100))
Me.imageStreamer3.SubText.TextAlign = ContentAlignment.TopRight
 
'For ImageStreamer4 SubText
Me.imageStreamer4.SubText.Text = "Computer"
Me.imageStreamer4.SubText.ForeColor = Color.White
size_Renamed = TextRenderer.MeasureText(imageStreamer4.SubText.Text, Me.Font)
 
'Set location of subtext in ImageStreamer
Me.imageStreamer4.SubText.Location = New Point(10, Me.imageStreamer4.Height - (size_Renamed.Height + 50))
Me.imageStreamer4.SubText.TextAlign = ContentAlignment.TopCenter

Screenshot:

Set location of sub text in TileLayout

Samples:

C#:  TileLayoutSample

VB:  TileLayoutSample

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied