|
The MatrixLedMarquee control is a scrolling LED display. It is modelled on the early
monochrome versions. As usual on the Silverlight Dashboard project the mode is fully go-retro.
As usual we start with a basic example to get us going.
The marquee in code (as in real life) is constructed from multiple panels
that are 5 wide by seven high. in code we specify this via the Panels property,
the message can be specified in XAML by the Text property
|
<db:MatrixLedMarquee
Panels="10"
Text="Hello Silverlight."/>
|
|
There are properties to specified the on and off colors of the LEDS
LedOnColor and not unsurprisingly LedOffColor
You can also specify the interval between steps for the anination using the
TimerDuration property.
Which gives us:
|
<db:MatrixLedMarquee
TimerDuration="00:00:0.1"
LedOnColor="#FFFF00FF"
LedOffColor="#22FF00FF"
Panels="10"
Text="Hello Silverlight."/>
|
|
Modes
As you will see when the above animation completes, the marquee is empty. That's because the default mode for the
MatrixLedMarquee is SingleShot and we don't supply additional text.
The three modes that the MatrixLedMarquee supports are:
- SingleShot
- Continious
- Motionless
SingleShot: The text is scrolled once, whe the last digit is fully rendered on the
panel, the MatrixLedMarquee will raise an event allowing you to set the next piece of text.
Continious: The text is scrolled, when it comes to an end the text is started again.
Motionless: The Text is not scrolled, it is rendered in place and alligned according to
the TextAlign property.
For SingleShot and Continious modes: the new text goes straight on after the
previous one, it is up to the caller to pad with spaces as required.
|
|
|
SingleShot
Single shot can be fire and forget, but it can also be useful for a news ticker, where after a headline has finished
scrolling, you retrieve the next one and start it away.
|
|
The XAML for the control initializes it and sets up the event handler
<db:MatrixLedMarquee Panels="10" TimerDuration="00:00:0.1"
Mode="SingleShot" x:Name="_marq"
MarqueeFinished="_marq_MarqueeFinished"
/>
|
|
|
Our user control that hosts the marquee initializes the first text
on load and then the next one after each message finishes.
In reality the list would come from a web service
public partial class Mat3 : UserControl
{
/// <summary>
/// Our messages, we will continuously rotate through them
/// </summary>
List<string> Messages = new List<string>
{
"Message one",
"Message two",
"Message three"
};
/// <summary>
/// Constructs a Mat3
/// </summary>
public Mat3()
{
InitializeComponent();
Loaded += new RoutedEventHandler(IAmLoaded);
}
/// <summary>
/// Control is loaded set the first message
/// </summary>
void IAmLoaded(object sender, RoutedEventArgs e)
{
SetNextMessage();
}
/// <summary>
/// Marquee has finished animating, get the next message going
/// </summary>
private void _marq_MarqueeFinished(object sender, EventArgs e)
{
SetNextMessage();
}
int _message = 0;
/// <summary>
/// Sets the next message and puts a little place holder between em
/// </summary>
private void SetNextMessage()
{
_marq.Text = Messages[_message] + " * ";
_message += 1;
if (_message > Messages.Count -1 )
{
_message = 0;
}
}
}
|
Continious
Continious operation is as simple as setting the text and the mode to Continious. Note that
the Text defintion has an space at the end to sperate the next copy from the previous one
|
<db:MatrixLedMarquee
Panels="10"
TimerDuration="00:00:0.1"
Mode="Continious"
Text="David Black "/>
|
|
Motionless
For motonless text we set the text, the Model to motionless and !
nothing much else happens :-). Seen here with text left, right and center justified
|
<db:MatrixLedMarquee Panels="10" Mode="Motionless"
TextAlignment="Left" Text="lft" />
<db:MatrixLedMarquee Panels="10" Mode="Motionless"
TextAlignment="Right" Text="rgt" />
<db:MatrixLedMarquee Panels="10" Mode="Motionless"
TextAlignment="Center" Text="cent" />
|
|
Character set
The current release supports the most common characters for English. Further support will be added
if an when requested. Please note this control is very low resolution and as such will not
support Japanese or Chinese characters. I would need to create a 24 by 16 matrix for that to be possible
There is a very basic font editor available on the demo site I will include instructions on how to
ue it later if required.
Current character support is
|
|
|
|
|
|
|