This is a migrated thread and some comments may be shown as answers.

Using Rotator to scroll text.

10 Answers 90 Views
Rotator
This is a migrated thread and some comments may be shown as answers.
Jeff Bradshaw
Top achievements
Rank 1
Jeff Bradshaw asked on 30 May 2011, 03:49 AM
Can I use the rotator to create a ticker on a window's program? (Ticker like the ticker on CNN at the bottom of the screen)

TIA - Jeff.

10 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 01 Jun 2011, 03:44 PM
Hi Jeff,

Thank you for writing.

You you can use RadRotator as a ticker to scroll text. Here are a few steps that you need to take to accomplish this behavior:
  • Dock the control to bottom and size it accordingly;
  • Add the desired text as RadLabelElements;
  • Change the LocationAnimation to (1,0) to move the items from right to left and to (-1,0) for left to right;
  • Set the desired interval between the news;
  • Start the rotator;
Here is a sample implementation:
public Form1()
{
    InitializeComponent();
 
    radRotator1.LocationAnimation = new SizeF(1, 0);
    radRotator1.AnimationFrames = 30;
    radRotator1.Interval = 5000;
 
    RadLabelElement news1 = new RadLabelElement();
    news1.Text = "First news";
    RadLabelElement news2 = new RadLabelElement();
    news2.Text = "Second news";
    RadLabelElement news3 = new RadLabelElement();
    news3.Text = "Third news";
    RadLabelElement news4 = new RadLabelElement();
    news4.Text = "Forth news";
 
    radRotator1.Items.Add(news1);
    radRotator1.Items.Add(news2);
    radRotator1.Items.Add(news3);
    radRotator1.Items.Add(news4);
 
    radRotator1.Start();
     
    //if you want to hide the border, uncomment the following line
    //((BorderPrimitive)radRotator1.RotatorElement.Children[1]).Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
}

I hope that the provided information addresses your question. Should you have any other questions, do not hesitate to contact us.
 
Regards,
Stefan
the Telerik team
Q1’11 SP1 of RadControls for WinForms is available for download; also available is the Q2'11 Roadmap for Telerik Windows Forms controls.
0
Mahmoud
Top achievements
Rank 1
answered on 30 Apr 2013, 08:50 PM
Hi Stefan,

Your example is really great, thank you very much.

I have 2 issues that I would like to ask:

1- How do we set the text alignment to be RTL, I tried setting all properties to RTL, none of them achieved that.

2- Can we let text scroll just like we see scrolling bar on TV?

Thanks for your help once again.

-Mahmoud
0
Mahmoud
Top achievements
Rank 1
answered on 30 Apr 2013, 09:52 PM
Hi Stefan,

Your example is really great, thank you very much.

I have 2 issues that I would like to ask:

1- How do we set the text alignment to be RTL, I tried setting all properties to RTL, none of them achieved that.

2- Can we let text scroll just like we see scrolling bar on TV?

Thanks for your help once again.

-Mahmoud
0
Stefan
Telerik team
answered on 03 May 2013, 01:13 PM
Hi Mahmoud,

Thank you for writing.

To make the right align their text to the right side, you can use the following property:
news1.TextAlignment = ContentAlignment.MiddleRight;

However, I do not think that you would be able to overlap the items so that they can rotate one after the other. This would take completely different approach. Attached you can find a sample control that does the job. I hope that you find it useful.
 

Greetings,
Stefan
the Telerik team
WinForms Q1 2013 boasts PivotGrid, PDF Viewer, Chart enhancements and more. Check out all of the latest highlights.
0
pbt
Top achievements
Rank 2
answered on 28 Nov 2013, 11:54 AM

Hi Stefan,

This is a great example. However there is an issue which I cannot understand.

I used RadLabelElements with HTML formatted text (within <html></html>). My content was a couple of long phrases and I noticed that the content of a RadLabelElement partially overlaps the content of the previous RadLabelElement.

Is this a shortcoming of the RadLabelElement when used with html-formatted text ?

I tried it with multiple short phrases and it works. However, once I insert a long phrase, problems start.

Thank you for your time.

0
Stefan
Telerik team
answered on 02 Dec 2013, 07:31 AM
Hi Panayotis,

Would you please send me a sample of the label initialization and the html string you use, so I can reproduce the undesired behavior and investigate the reasons causing it.

Thank you in advance for your time and cooperation.

Regards,
Stefan
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WINFORMS.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0
pbt
Top achievements
Rank 2
answered on 30 Dec 2013, 10:18 AM

Hi Stefan,

If you just use the modified code below for file MyNewsReader.cs you will be able to generate to long messages (messages that will take more width that the available screen width) to see the issue. For your benefit, I have included two sample messages and the modified code of MyNewsReader.cs.

Thank you!!

###   Form Load event   ###

string sMessageContent = String.Empty;

RadLabelElement radlbl = null;

// add first message

sMessageContent = "<span style=\"font-size: 28pt; font-family: Tahoma; color: #ab00cd;\">HELLO, THIS IS AN EXTREMELY LONG DUMMY MESSAGE AS AN ATTEMPT TO SHOW THE CONTENT OVERLAY ISSUE BETWEEN CONSECUTIVE ELEMENTS WITHIN A STACKLAYOUTPANEL.</span>";

radlbl = new RadLabelElement() { TextWrap = false, Text = String.Format("<html>{0}</html>", sMessageContent) };

myNewsReader1.Items.Add(radlbl);


// add second message

sMessageContent = "<span style=\"font-size: 28pt; font-family: Tahoma; color: #ab00cd;\">THIS IS ANOTHER VERY LONG DUMMY MESSAGE TO DEMONSTRATE THE ISSUE I AM HAVING WHEN TRYING TO SHOW HTML CONTENT AS A MARQUEE FROM RIGHT TO LEFT!</span>";

radlbl = new RadLabelElement() { TextWrap = false, Text = String.Format("<html>{0}</html>", sMessageContent) };

myNewsReader1.Items.Add(radlbl);


###   MyNewsReader.cs   ###

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using Telerik.WinControls;

using Telerik.WinControls.UI;

using System.Windows.Forms;

using System.Drawing;

using System.ComponentModel;

using Telerik.WinControls.Layouts;

namespace _569811


{


[ToolboxItem(true)]

public class MyNewsReader : RadControl



{


MyNewsReaderElement element;

protected override void CreateChildItems(RadElement parent)


{


base.CreateChildItems(parent);

element = new MyNewsReaderElement();

this.RootElement.Children.Add(element);


}


protected override System.Drawing.Size DefaultSize


{


get



{


return new Size(300, 60);


}

}


public MyNewsReaderElement Element


{


get



{


return element;


}

}


[DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]

[Browsable(true)]

public RadItemOwnerCollection Items


{


get



{


return this.element.Items;


}

}

}


public class MyNewsReaderElement : StackLayoutElement



{


RadItemOwnerCollection items;

Timer timer;

protected override void CreateChildElements()


{


base.CreateChildElements();

this.DrawBorder = true;

this.Orientation = Orientation.Horizontal;

this.StretchHorizontally = true;

this.StretchVertically = true;

items = new RadItemOwnerCollection();

items.ItemTypes = new Type[]


{


typeof(LightVisualElement),

typeof(RadButtonElement),

typeof(RadLabelElement),

typeof(HtmlElement)


};


items.Owner = this;

timer = new Timer();


timer.Interval = 20;


timer.Tick += new EventHandler(timer_Tick);


timer.Start();

}


void timer_Tick(object sender, EventArgs e)


{


this.ItemsOffset -= 3;

this.InvalidateMeasure();


}


protected override void ArrangeItemsHorizontaly(RectangleF clientRect, SizeF finalSize, float stretchableWidth, float spacing)


{


float totalWidth = 0;

foreach (RadElement item in this.Children)


{

totalWidth += item.DesiredSize.Width;

}


if (ItemsOffset + totalWidth < 0)


{


ItemsOffset = (int)clientRect.Right - (int)totalWidth;


}


bool[] used = new bool[this.Children.Count];

float x = clientRect.X + ItemsOffset;

float y = clientRect.Y;


 


for (int i = 0; i < this.Children.Count; i++)


{


RadElement element = this.Children[i];

if (x + element.DesiredSize.Width > clientRect.Left)


{


this.ArrangeElement(element, clientRect, new RectangleF(x, y, element.DesiredSize.Width, clientRect.Height), finalSize);

used[i] = true;


}

x += element.DesiredSize.Width + spacing;

}


if (totalWidth < clientRect.Width)


{

x += clientRect.Width - totalWidth;

}


for (int i = 0; i < this.Children.Count; i++)


{


RadElement element = this.Children[i];

if (x + element.DesiredSize.Width < clientRect.Right && used[i] == false)


{


this.ArrangeElement(element, clientRect, new RectangleF(x, y, element.DesiredSize.Width, clientRect.Height), finalSize);


}


else



{


break;


}

x += element.DesiredSize.Width + spacing;

}

}


#region Properties and Methods

public RadItemOwnerCollection Items


{


get



{


return this.items;


}

}


public int ItemsOffset { get; set; }

public void BeginRotation()


{

timer.Start();

}


public void EndRotation()


{

timer.Stop();

}


#endregion



}

}


0
George
Telerik team
answered on 02 Jan 2014, 11:54 AM
Hi Panayotis,

Thank you for replying.

This misplacement of the text is due to the fact that you are formatting the text using html tags. This does not allow the RadLabelElement to measure its size accordingly. In this case you will need to manually measure the size of your element, however even this will not be 100% correct since there is no 100% accurate method in WinForms to measure the size of a text. First I recommend you to set the Font with code:
sMessageContent = "<span style=\"color: #ab00cd;\">HELLO, THIS IS AN EXTREMELY LONG DUMMY MESSAGE AS AN ATTEMPT TO SHOW THE CONTENT OVERLAY ISSUE BETWEEN CONSECUTIVE ELEMENTS WITHIN A STACKLAYOUTPANEL.</span>";
radlbl = new RadLabelElement() { TextWrap = false, Text = String.Format("<html>{0}</html>", sMessageContent) };
radlbl.Font = new Font("Tahoma", 28);
myNewsReader1.Items.Add(radlbl);

Then you can replace the ArrangeItemsHorizontally method in the MyNewsReaderElement class to the following:
protected override void ArrangeItemsHorizontaly(RectangleF clientRect, SizeF finalSize, float stretchableWidth, float spacing)
{
    float totalWidth = 0;
    foreach (RadItem item in this.Children)
    {
        SizeF size = TextRenderer.MeasureText(item.Text, item.Font);
        typeof(RadElement).GetField("_desiredSize", System.Reflection.BindingFlags.NonPublic | System.Reflection.BindingFlags.Instance).SetValue(item, size);
 
        totalWidth += item.DesiredSize.Width;
    }
 
    if (ItemsOffset + totalWidth < 0)
    {
        ItemsOffset = (int)clientRect.Right - (int)totalWidth;
    }
 
    bool[] used = new bool[this.Children.Count];
    float x = clientRect.X + ItemsOffset;
    float y = clientRect.Y;
    for (int i = 0; i < this.Children.Count; i++)
    {
        RadElement element = this.Children[i];
        if (x + element.DesiredSize.Width > clientRect.Left)
        {
            this.ArrangeElement(element, clientRect, new RectangleF(x, y, element.DesiredSize.Width, clientRect.Height), finalSize);
            used[i] = true;
        }
        x += element.DesiredSize.Width + spacing;
    }
 
    if (totalWidth < clientRect.Width)
    {
        x += clientRect.Width - totalWidth;
    }
 
    for (int i = 0; i < this.Children.Count; i++)
    {
        RadElement element = this.Children[i];
        if (x + element.DesiredSize.Width < clientRect.Right && used[i] == false)
        {
            this.ArrangeElement(element, clientRect, new RectangleF(x, y, element.DesiredSize.Width, clientRect.Height), finalSize);
        }
        else
        {
            break;
        }
 
        x += element.DesiredSize.Width + spacing;
    }
}

If you need to further tune the example you can edit the size which is measured by the TextRenderer in the first loop. 

I hope this helps. Let me know if I can assist you further.

Regards,
George
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WINFORMS.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0
Eko
Top achievements
Rank 1
answered on 23 Apr 2014, 12:39 PM
Can you rewrite your demo on vb.net, it try to convert but not successfully

Many Thanks
0
George
Telerik team
answered on 25 Apr 2014, 09:49 AM
Hello Eko,

Thank you for replying.

Below you can find the converted code:
Protected Overrides Sub ArrangeItemsHorizontaly(clientRect As RectangleF, finalSize As SizeF, stretchableWidth As Single, spacing As Single)
    Dim totalWidth As Single = 0
    For Each item As RadItem In Me.Children
        Dim size As SizeF = TextRenderer.MeasureText(item.Text, item.Font)
        GetType(RadElement).GetField("_desiredSize", System.Reflection.BindingFlags.NonPublic Or System.Reflection.BindingFlags.Instance).SetValue(item, size)
 
        totalWidth += item.DesiredSize.Width
    Next
 
    If ItemsOffset + totalWidth < 0 Then
        ItemsOffset = CInt(clientRect.Right) - CInt(totalWidth)
    End If
 
    Dim used As Boolean() = New Boolean(Me.Children.Count - 1) {}
    Dim x As Single = clientRect.X + ItemsOffset
    Dim y As Single = clientRect.Y
    For i As Integer = 0 To Me.Children.Count - 1
        Dim element As RadElement = Me.Children(i)
        If x + element.DesiredSize.Width > clientRect.Left Then
            Me.ArrangeElement(element, clientRect, New RectangleF(x, y, element.DesiredSize.Width, clientRect.Height), finalSize)
            used(i) = True
        End If
        x += element.DesiredSize.Width + spacing
    Next
 
    If totalWidth < clientRect.Width Then
        x += clientRect.Width - totalWidth
    End If
 
    For i As Integer = 0 To Me.Children.Count - 1
        Dim element As RadElement = Me.Children(i)
        If x + element.DesiredSize.Width < clientRect.Right AndAlso used(i) = False Then
            Me.ArrangeElement(element, clientRect, New RectangleF(x, y, element.DesiredSize.Width, clientRect.Height), finalSize)
        Else
            Exit For
        End If
 
        x += element.DesiredSize.Width + spacing
    Next
End Sub

In future you can use our Online Converter for such purposes.

I hope this will help.

Regards,
George
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
Tags
Rotator
Asked by
Jeff Bradshaw
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Mahmoud
Top achievements
Rank 1
pbt
Top achievements
Rank 2
George
Telerik team
Eko
Top achievements
Rank 1
Share this question
or