Silverlight team's blog

Telerik Commanding mechanism for Silverlight Overview

Silverlight Team — Fri, 08 Jan 2010 05:29:00 GMT

Q2 and Q3 releases brought up support for commands usable in a similar way as the commanding mechanism from WPF.

In a few points the Commanding mechanism provides several classes:

RoutedCommand and RoutedUICommand – ICommand implementations, the second has a Text property
ICommandSource – once an object implement it, it knows how to invoke a command, i.e. it receives Command, CommandParameter and CommandTarget properties.
CommandBinding – maps the command logic to the command
CommandManager – provides methods that register CommandBinding and InputBinding objects, add and remove command event handlers, and provides services for querying the status of a command.

Creating a command

Basically, we can implement the ICommand interface in order to create our command class. However, we can also use the provided RoutedUICommand(or RoutedCommand) just as we do in WPF:

public static class DateTimeCommands
{
private static RoutedUICommand myCommand = new RoutedUICommand("ShowLocalTime", "ShowLocalTimeCommand", typeof(DateTimeCommands));

public static RoutedUICommand ShowLocalTimeCommand
{
get { return myCommand; }
}
}

In order to use our new command, we need to register a CommandBinding in the class’ static constructor where we would like to use it:

static MainPage()
{
CommandManager.RegisterClassCommandBinding(typeof(MainPage), new CommandBinding(DateTimeCommands.ShowLocalTimeCommand, OnShowLocalTimeCommand, OnQueryShowLocalTimeCommand));
}

As seen this involves specifying handlers where we implement our logic which is executed upon invocation of the command. If we want to disable execution, all we need to do is set the CanExecute property of CanExecuteRoutedEventArgs to false:

private static void OnQueryShowLocalTimeCommand(object sender, CanExecuteRoutedEventArgs e)
{
e.CanExecute = false;
}

Apart from CanExecute, we have access to the Parameter property which holds the CommandParameter passed when this property is set to the command source. This is also accessible in the ExecutedRoutedEventHandler’s event args and can be used to implement different logic according to the parameter input like:

private static void OnShowLocalTimeCommand(object sender, ExecutedRoutedEventArgs e)
{
var universalTime = DateTime.Now.ToUniversalTime();
string alertContent = String.Concat("Time in ", e.Parameter, ": ");

switch ((string)e.Parameter)
{
case "Sofia": { alertContent += universalTime.AddHours(2).ToShortTimeString(); break; }
case "Munich": { alertContent += universalTime.AddHours(1).ToShortTimeString(); break; }
case "Boston": { alertContent += universalTime.AddHours(-5).ToShortTimeString(); break; }
case "Dallas": { alertContent += universalTime.AddHours(-6).ToShortTimeString(); break; }
default: alertContent = "Unknown time zone"; break;
}

RadWindow.Alert(new DialogParameters() { Content = alertContent });
}

See attached example demonstrating usage of RoutedUICommand.

CommandingExample.zip

Using Compass indicators properties for Telerik's Docking Control for Silverlight and WPF

Silverlight Team — Tue, 29 Dec 2009 02:24:00 GMT

Sometimes when using a Docking control and implementing complex UI with it we need to add some custom rules about allowing some panes to be docked in some parts of the application and to disallow them to dock to other parts. As this behavior is quite complex itself, we’ve decided to enable some scenarios to be available in XAML in a declarative way (the more static scenarios) and some scenarios to be available only through the code-behind.

In this post I will guide you through some simple steps that will show you how you could use both approaches. First of all I will explain you some of the properties of the Compass class that will allow to control its options. After that I will show how to statically set the enabled compass directions. At the end I will show you how to implement some complex logic for enabling and disabling compass directions.

Compass directions

Both the Compass and RootCompass controls have some dependency properties that allow you to customize their docking directions. The RootCompass inherits from the Compass class, so it contains all the properties defined for the Compass class. Both classes have the following properties:

IsLeftIndicatorVisible
IsTopIndicatorVisible
IsRightIndicatorVisible
IsBottomIndicatorVisible
IsCenterIndicatorVisible

These properties by default are controlling the visibility of the Compass and RootCompass parts. On Figure 1.1 and 1.2 you can see the parts of the Compass and the RootCompass controls.

Figure 1.1 Parts of the Compass Control

Figure 1.2 Parts of the RootCompass Control

In the RootCompass class the IsCenterIndicatorVisible property is not in use, because the RootCompass doesn’t have a center indicator. Figure 2.1 and 2.2 shows how each property affects both of the compasses:

Figure 2.1 Compass indicator visibility properties

Figure 2.2 RootCompass indicator visibility properties

Using compass indicators properties globally with Styles

One common scenario is to say that the user is not allowed to dock at one side of the Docking control (for example at the right one). Another common scenario is that our application doesn’t allow the user to have more than one pane in a group. Both of these scenarios are pretty static and we could achieve them using the previously mentioned configuration properties of the Compass and RootCompass controls without writing any code-behind. To achieve the first scenario we need to say to the RootCompass that its right indicator is always invisible. You could do that using the RootCompassStyle property of the Docking control. Listing 1.1 shows how we could use this property.

<telerikDocking:RadDocking.CompassStyle>

<Style TargetType="dock:Compass">

<Setter Property="IsCenterIndicatorVisible" Value="false" />

</Style>

</telerikDocking:RadDocking.CompassStyle>

<telerikDocking:RadDocking.RootCompassStyle>

<Style TargetType="dock:RootCompass">

<Setter Property="IsTopIndicatorVisible" Value="false" />

</Style>

</telerikDocking:RadDocking.RootCompassStyle>

Listing 1.1: Configure RootCompass using the RootCompassStyle property of the Docking control

Using compass indicators properties in code behind

When is needed for a group of the same type panes, or even for each pane, to be granted different permissions for docking, the code-behind is used for achieving this more complex scenario.
First, you must hook on the PreviewShowCompass event of the Docking control in the XAML and implement your logic in the event-handler in the code-behind. To divide the logic for the RootCompass and the other Compass you should use the TargetGroup property of the e argument. If its TargetGroup property is null, this means that the event is fired for the RootCompass, if not – for the other Compass. It is good to keep in mind that the programming overrides the styles in XAML, so if you are using both approaches the explicit settings of the properties are “stronger”.

So let’s create an example that will utilize the features we already mentioned.
First, we need to create a method called GetPaneType, which returns the type of the panes. This is achieved by comparing the resources of the panes, more specificly the color of the brush of the pane’s background, using simple if statements. We will need the type of the panes, so that we can decide which Compass indicators to show and which to hide depending on these types. Here is the code:

private PaneType GetPaneType(RadPane pane)

{

Panel c = pane.Content as Panel;

if (c != null)

{

if (c.Background.Equals(this.Resources["OliveBrush"]))

{

return PaneType.Olive;

}

else if (c.Background.Equals(this.Resources["BlueBrush"]))

{

return PaneType.Blue;

}

else

{

return PaneType.Purple;

}

return PaneType.Purple;

}

Then, we will define a method called CanDockIn. The return type of this method is Boolean and its parameters are:

paneToDock of type RadPane - the pane that will be docked in;
paneInTargetGroup also of type RadPane - the pane that is targeted at the moment;
position of type DockPosition, which is the direction the indicators point.

The return value will indicate whether the first pane (paneToDock) can be docked next to the second one(paneInTargetGroup). The third parameter indicates where we want to dock the first pane relatively to second one - to its left, right, top or bottom side or in the same group. We will use this value to set the visibility of the indicators of the Compass for each pane in the event PreviewShowCompass. For that we make 2 variables paneInTargetGroupType, of type PaneType, which is the pane that is the targeted one (the one that we are holding and moving at the moment), and paneToDockType, also of type PaneType, which is the one in which we are eventually going to dock. To the variable paneToDockType is assigned the value of GetPaneType(paneToDock) - this is the method that we have initially created with the first argument of the method CanDockIn. To the paneInTargetGroupType is assigned the GetPaneType(paneInTargetGroup).

After getting the type of the panes via the method GetPaneType, using switch statements we set the value (true or false) for each type of pane (in the example olive, purple and blue). The value of the outer switch expression, which is shown below, is the paneToDockType. If we take for example this code snippet:

case PaneType.Olive:

switch (paneInTargetGroupType)

{

case PaneType.Olive:

return true;

case PaneType.Blue:

return position != DockPosition.Left && position != DockPosition.Right;

case PaneType.Purple:

return false;

}

break;

This code shows that one olive pane:

can be docked in another olive pane
in the blue pane, the left and right indicators are disabled
in the purple the olive pane can’t be docked at all

In a similar way is defined the visibility of the indicators for the other remaining pane groups.
Similar logic is used for defining the visibility of the indicators of the RootCompass in the method CanDock. Again switch statements are used to define for each pane which indicators of the RootCompass are enabled.

switch (paneToDockType)

{

case PaneType.Olive:

return position != DockPosition.Left;

case PaneType.Blue:

return false;

case PaneType.Purple:

return true;

}

return false;

Here we can see that for the olive pane the docking to the left is disabled, for the blue pane all 4 indicators in the RootCompass are disabled and for the purple pane all indicators are visible.
We are now able to set the visibility of all indicators of the two Compasses for every pane in the PreviewShowCompass event.
The values for the previously mentioned properties IsLeftIndicatorVisible, IsTopIndicatorVisible, IsRightIndicatorVisible, IsBottomIndicatorVisible, IsCenterIndicatorVisible are determined with the help of the methods CanDockIn and CanDock, which we have created.

private void RadDocking_PreviewShowCompass(object sender, Telerik.Windows.Controls.Docking.PreviewShowCompassEventArgs e)

{

if (e.TargetGroup != null)

{

e.Compass.IsCenterIndicatorVisible = CanDockIn(e.DraggedSplitContainer, e.TargetGroup, DockPosition.Center);

e.Compass.IsLeftIndicatorVisible = CanDockIn(e.DraggedSplitContainer, e.TargetGroup, DockPosition.Left);

e.Compass.IsTopIndicatorVisible = CanDockIn(e.DraggedSplitContainer, e.TargetGroup, DockPosition.Top);

e.Compass.IsRightIndicatorVisible = CanDockIn(e.DraggedSplitContainer, e.TargetGroup, DockPosition.Right);

e.Compass.IsBottomIndicatorVisible = CanDockIn(e.DraggedSplitContainer, e.TargetGroup, DockPosition.Bottom);

}

else

{

e.Compass.IsLeftIndicatorVisible = CanDock(e.DraggedSplitContainer, DockPosition.Left);

e.Compass.IsTopIndicatorVisible = CanDock(e.DraggedSplitContainer, DockPosition.Top);

e.Compass.IsRightIndicatorVisible = CanDock(e.DraggedSplitContainer, DockPosition.Right);

e.Compass.IsBottomIndicatorVisible = CanDock(e.DraggedSplitContainer, DockPosition.Bottom);

}

e.Canceled = !(CompassNeedsToShow(e.Compass));

}

As we can see in the Boolean value, which is returned by the methods CanDock and CanDockIn, is set to the corresponding properties IsCenterIndicatorVisible, IsLeftIndicatorVisible, IsTopIndicatorVisible, IsRightIndicatorVisible, IsBottomIndicatorVisible, which make the indicator visible or invisible.
The property Canceled of the e argument, if set to true, disables the whole Compass. The line

e.Canceled = !(CompassNeedsToShow(e.Compass));

refers to another method, called CompassNeedsToShow, which checks if all indicators are disabled, if so, disables the whole Compass, like so:

private static bool CompassNeedsToShow(Telerik.Windows.Controls.Docking.Compass compass)

{

return

compass.IsLeftIndicatorVisible || compass.IsTopIndicatorVisible || compass.IsRightIndicatorVisible || compass.IsBottomIndicatorVisible || compass.IsCenterIndicatorVisible;

}

Here you can find an example which illustrates the described implementation of the RadDocking Control. For more information please refer to Telerik’s online demos for Silverlight, the demos for WPF and help documentation for WPF and help documentation for Silverlight.

How to add a scrollbar to Telerik RadMenu for Silverlight

Silverlight Team — Thu, 10 Dec 2009 11:10:00 GMT

As we received a lot of questions on how to add a ScrollViewer to the RadMenu control for Silverlight, in this blog post I am going to explain how you can achieve this.

Adding a ScrollViewer to RadMenu for Silverlight can be easily accomplished using Expression Blend.

Step 1. Create a new Silverlight 3 Application.

Step 2. Add references to Telerik.Windows.Controls.dll and Telerik.Windows.Controls.Navigation.dll in your project.

Step 3. Drag RadMenu and RadMenuItem controls from the Toolbox and drop them on the design surface.

Step 4. Right-click on one of the RadMenuItems and select EditStyle or select it and from the menu by choosing Object -> Edit Style -> Edit a Copy.

You will be prompted for the name of the style and where it should be placed within your application:

After that, Blend will create all the needed styles and templates for you.

Step 5. Open the XAML code and find the ItemsPresenter element. It is located in the TopLevelHeaderTemplate and SubMenuHeaderTemplate templates. This element is used to specify the place in the control’s visual tree where the ItemsPanel (defined by the ItemsControl) will be added.

Step 6. After locating the ItemsPresenter(s), wrap each one of them into a ScrollViewer:

Set MaxHeight on each ScrollViewer:

<ScrollViewer MaxHeight=”140”>

To enable scrolling in the menu you should set the ScrollViewerExtensions.EnableMouseWheel attached property to true

If you want to set a theme, you should use:

StyleManager.Theme="Office_Black"

The final result will be looking like this:

Here is an example project which includes the above implementation of the RadMenu and ScrollViewer. For more information about the RadMenu and the ScrollViewer control please see Telerik’s online demos and help documentation.

WPF RadDocking Overview

Silverlight Team — Mon, 07 Dec 2009 11:04:39 GMT

It’s been a while since the Q3 2009 release. Lots of controls have been added in our toolbox for WPF. One of them is considered as a final official release of RadDocking control for WPF. We have made a lot of improvements since the last release of the controls. For example each of the six themes included in the bundle now has different type of appearance when applied to a control. RadDocking is a fully customizable and skinnable control that enhances the power of a layout system. It is providing you with a docking system like the one in Microsoft Visual Studio. You are getting the dockable ToolWindows, a hidden DockingManager control, and a designer to easily create attractive layouts. It is good to mention that the WPF RadDocking code is absolutely compatible with its Silverlight counterpart.

RadDocking key features list:

· Save/Load Layout - When building complex layouts with RadDocking the users will often expect to persist the layout from one session to another. It can be easily achieved with the advanced Save\Load layout mechanism of the RadDocking control. It provides a method that stores the entire layout in a stream containing XML. After the storing you can simply restore the layout from its previous state. In addition, you can choose to save the stream elsewhere, in a text box, or directly in the isolated storage

· Split Containers – The RadSplitContainer allows you to use movable bars to divide the displayed area into resizable parts. With the RadDocking'sRadSplitContainers you can build complex layouts that can even include nested split areas. Some immediate examples of such layouts are Explorer-like and outlook-like interfaces. The RadDocking's RadSplitContainers allows you to define the Orientation and the InitialPosition of the container.

· Tabbed Documents - RadDocking supports tabbed documents for document -oriented applications. It allows you to see documents by splitting them into multiple panes

· Pin/Unpin and Hide Panes - To display content on demand, a docked window can be pinned, unpinned or hidden. The pane is in an unpinned state by default. When unpinned the pane collapses down to a tab.

· Dockable Windows - RadDocking has a full drag-and-drop support including the docking compass and the docking hints for visual feedback. You are free to drag the dockable windows anywhere in the container to create customized layouts.

· Floating Windows - Once you start dragging Pane or Group it moves to Floating Window almost immediately. The hints of the RadDocking for visual feedback are showing the user where the object will be placed.

· WPF/Silverlight Code Compatibility - The WPF RadDocking shares a common code-base and API with its Silverlight counterpart. That means that you can achieve close to 100% code reuse for your grid logic if you have parallel Silverlight/WPF development.

A brand new Timeline view for Teleriks Scheduler control for Silverlight/WPF

Silverlight Team — Tue, 17 Nov 2009 06:20:00 GMT

Along with other main features like standard resources and resource grouping, the Q3 2009 release brought an additional view to the present ones (Day, Week and Month) – Timeline. Briefly said, it displays a certain number of consecutive time slots and like all other views, the Timeline view is configurable in almost the same way. Here is how it looks like by default:

… where each time slot is 1 day long (i.e. TimeSlotLength of the TimelineViewDefinition is equal to one day) and the date in each header is displayed in a “d-M-yyyy” format.

Let’s tweak a bit some of the settings related to the Timeline view and add some resources:

<telerik:RadScheduler Grid.Row="0" x:Name="scheduler" TimelineHeaderFormat="{}{0:H:mm tt}" GroupBy="Person" >
            <telerik:RadScheduler.TimelineViewDefinition>
                <telerik:TimelineViewDefinition DayStartTime="08:00:00" DayEndTime="19:00:00" TimeSlotLength="1:0:0" VisibleDays="1" />
            </telerik:RadScheduler.TimelineViewDefinition>
            <telerik:RadScheduler.ResourceTypes>
                <telerik:ResourceType Name="Person" AllowMultipleSelection="True" >
                    <telerik:ResourceType.Resources>
                        <telerik:Resource ResourceName="Rosi" />
                        <telerik:Resource ResourceName="Toti" />
                    </telerik:ResourceType.Resources>
                </telerik:ResourceType>
            </telerik:RadScheduler.ResourceTypes>
            <telerik:RadScheduler.ResourceStyleMappings>
                <telerik:ResourceStyleMapping ResourceType="Person" ResourceName="Rosi" ResourceBrush="LightPink" />
                <telerik:ResourceStyleMapping ResourceType="Person" ResourceName="Toti" ResourceBrush="LightBlue" />
            </telerik:RadScheduler.ResourceStyleMappings>
        </telerik:RadScheduler>

As you see setting the DayStartTime and DayEndTime properties allow us to show only working hours and thus concentrating on what is important.

Hope this will be of use!

Drag and drop items onto RadScheduler for Silverlight

Silverlight Team — Wed, 19 Aug 2009 03:36:58 GMT

We all are aware that users tend to look for the easiest and most rational way to do something. That is why developers always strive to create their products' interface as intuitive as possible. Speaking in this context, dragging and dropping helps us improve user experience significantly and make end users happier.

In this blog post I will explain how we can use RadDragAndDrop to enable users drag items from a certain control and drop them over RadScheduler, while notifying about that. Of course, the described scenario could be extended to act in many different scenarios.

Let us say we will drag items from a listbox to a scheduler control. The xaml should look like:

    <Grid x:Name="LayoutRoot">   
         <Grid.ColumnDefinitions>  
             <ColumnDefinition Width="100" />  
             <ColumnDefinition />  
         </Grid.ColumnDefinitions>  
         <ListBox x:Name="listBox" >  
             <ListBox.ItemContainerStyle>  
                 <Style TargetType="ListBoxItem">   
                     <Setter Property="dragDrop:RadDragAndDropManager.AllowDrag" Value="True" />  
                 </Style>  
             </ListBox.ItemContainerStyle>  
             <ListBox.ItemTemplate>  
                 <DataTemplate>  
                     <TextBlock Text="{Binding}" />  
                 </DataTemplate>  
             </ListBox.ItemTemplate>  
         </ListBox>  
             <Controls:RadScheduler Grid.Column="1" Name="Scheduler" />  
   </Grid>  
  

Please note that we must set the RadDragAndDropManager.AllowDrag attached property to True for each ListBoxItem to "activate" the drag functionality.

To enable drop onto the TimeSlotItem elements in our RadScheduler control, we find them in the code behind and set the RadDragAndDropManager.AllowDropProperty to true:

private void InitializeTimeSlotItems()

{

   this.timeSlotItems = this.Scheduler.ChildrenOfType<TimeSlotItem>();

   foreach (TimeSlotItem item in this.timeSlotItems)

   {

      item.SetValue(RadDragAndDropManager.AllowDropProperty, true);

   }

}

Additionally, to enable users to drag and drop, in the constructor of the Page just add handlers needed by RadDragAndDropManager:

RadDragAndDropManager.AddDragQueryHandler(this, OnDragQuery);

RadDragAndDropManager.AddDropQueryHandler(this, OnDropQuery);

RadDragAndDropManager.AddDropInfoHandler(this, OnDropInfo);

And On Drop Info we add a new appointment over the corresponding TimeSlotItem, and delete the dragged ListBoxItem in this way:

    private void OnDropInfo(object sender, DragDropEventArgs e)   
 {   
     var sourceListBoxItem = e.Options.Source as System.Windows.Controls.ListBoxItem;   
     var timeSlotItem = e.Options.Destination as TimeSlotItem;   
     if (e.Options.Status == DragStatus.DropComplete && timeSlotItem != null)   
     {   
         this.Scheduler.Appointments.Add(   
             new Appointment()   
             {   
                 Start = timeSlotItem.TimeSlot.Start,   
                 End = timeSlotItem.TimeSlot.End,   
                 Subject = sourceListBoxItem.FindChildByType<TextBlock>().Text   
             }   
         );   
         this.source.Remove(sourceListBoxItem.Content.ToString());   
     }   
 }  
  

Here is the example project including the above described implementation of RadScheduler, Listbox and RadDragAndDrop for Silverlight. For more info on how you can use and customize RadDragAndDrop and RadScheduler for Silverlight, refer to Telerik's online demos and help.

Hope this will be of use!

Enhancing the Localization Support of RadControls for Silverlight and WPF

Silverlight Team — Sat, 30 May 2009 01:00:00 GMT

With the Q1 2009 SP2 release of RadControls for Silverlight we introduced an enhancement of the LocalizationManager class. Two new properties were added to enrich the localization support in the suite - DefaultCulture and DefaultResourceManager. With the new properties you no longer have to always create an instance of the LocalizationManager. Here is a brief description of the two properties:

DefaultCulture
A static property of type System.Globalization.CultureInfo.
Use this one to change localized values without changing the UI culture of the current thread.
DefaultResourceManager
A static property of type System.Resources.ResourceManager.
Use this one to change localized values using a new resource manager, i.e. a new resource file.

Example:

The attached example demonstrates how LocalizationManager's DefaultCulture and DefaultResourceManager properties work in conjunction with the thread's UI culture.

Localization_for_WPF.RadGridView_example.20090530

Localization for RadControls for Silverlight and WPF

Silverlight Team — Wed, 13 May 2009 01:00:00 GMT

As we are continuously working on the localization of all our controls, we'd like to share how the localization is actually progressing at our side.

With the RadControls for Silverlight Q1 2009 SP1 we introduced the LocalizationManager. Actually we have used it to localize the RadUpload control for Silverlight. Now we have four more controls localized right from the box: RadTreeView, RadMediaPlayer, RadColorSelector and RadColorPicker. In the attached example you can see them localized. Another control to be localized soon is the RadGridView control. The LocalizationManager allows you to easily localize any of our controls. In addition, we followed the practice to share the same code across Silverlight and WPF. Hence, once a control has been localized for Silverlight, the control's declaration can be reused in WPF.

To localize your own code you can either use resources or you can override the string loading process with your custom logic. Below is a snippet of the LocalizationManager declaration:

    public class LocalizationManager // Assembly: Telerik.Windows.Controls   
 {   
     public static readonly DependencyProperty ResourceKeyProperty; // Attached   
     public static LocalizationManager Manager;   
     public ResourceManager ResourceManager;   
     public CultureInfo Culture;   
     public static string GetString(string key);   
     public virtual string GetStringOverride(string key);   
 }   
  

To start the localization you should instantiate your manager and assign it to the LocalizationManager.Manager static property. This should happen before the creation of the UI, otherwise some parts might remain not-localized:

    public partial class Page : UserControl   
 {   
     public Page()   
     {   
         LocalizationManager.Manager = new MyLocalizationManager();   
         InitializeComponent();   
     }   
 }   
  

Usually, you can store the strings in Resource files or in Your custom holder.

Using Resource files as string storage:

If you prefer this approach you should store the string in a resource file and enable ResXFileCodeGenerator (internal or public) for it. Then, you should instantiate the LocalizationManager object and set its ResourceManager property to your strings' resource manager - for example:

    LocalizationManager.Manager = new LocalizationManager()  
 {  
    ResourceManager = YourApplication.Strings.ResourceManager  
 };  
  

Initialize the LocalizationManager.Manager property with this new object (as shown in the code above). Now you can create the application's UI.

Note:
If you rely on culture settings to load the right resource value, you have to write some code inside your application's project file. For example, if you have to support English, German and Japanese strings, you can store the localized strings in strings.resx, strings.de.resx and strings.ja.resx files. For the strings.resx file you can set ResXFileCodeGenerator (internal or public) and for others set No code generation. Then, you can open the project file in a text-mode and append the code below to notify the framework about the supported cultures:

Now you can rely on the UI culture or you can set the localization manager's Culture property:

myLocalizationManager.Culture = new CultureInfo("de");

Using custom string storage:

Another approach is to implement your own storage for the localized strings (i.e. a database). In this case you should inherit the LocalizationManager class and override its GetStringOverride method. Here is the starting frame of the code:

    using Telerik.Windows.Controls;   
    
 public class MyLocalizationManager : LocalizationManager   
 {   
     public override string GetStringOverride(string key)   
     {   
         // ...   
         // Your code here   
         // ...   
         return base.GetStringOverride(key);   
     }   
 }   
  

Finally, you should instantiate your manager and assign it to the LocalizationManager.Manager static property:

    public partial class Page : UserControl   
 {   
     public Page()   
     {   
         LocalizationManager.Manager = new MyLocalizationManager();   
         InitializeComponent();   
     }   
 }  
  

Below are some code-snippets demonstrating the localization with the LocalizationManager.

Inside XAML code:

Separately from the instantiated LocalizationManager, in your XAML code you can use the LocalizationManager.ResourceKey attached property to initialize your controls. For example, if you want to localize a button on your page, you can use the following code:

    xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"  
 ...  
 <Button  
    Content="Default value"  
    telerik:LocalizationManager.ResourceKey="MyButtonContentKey"  
 />  
  

In the Code-Behind:

In the code-behind, you can use the LocalizationManager's GetString static method, or, if you have instantiated a LocalizationManager object, you can use its GetStringOverride method, like:

    // Loading localized data:  
 string localizedData = LocalizationManager.GetString(key);  
   
 // Constructing a custom localizer and load from it:  
 MyLocalizationManager locMan = new MyLocalizationManager();   
 string localizedData = locMan.GetStringOverride(key);  
   
 // Same as the localization in XAML shown above:  
 TextBlock textBlock = new TextBlock()  
 LocalizationManager.SetResourceKey(textBlock, key);  
  

The SetResourceKey method triggers the OnResourceKeyChanged method where a type-oriented initialization occurs. For the time being, we have implemented initialization for the following types:

TextBlock - the Text property is initialized;
Button - the Content property is initialized;
ContentControl - the Content property is initialized;
ContentPresenter - the Content property is initialized;
ILocalizable - ILocalizable.SetString is used;

Note: the ILocalizable interface exposes the SetString method. If you need some specific initialization in your custom control you should implement this interface and the LocalizationManager will take care to invoke the SetString method.

Example:

Attached, you can find two examples where LocalizationManager and localized RadControls are demonstrated.

Localization_SL_example.20090512.zip,
Localization_WPF_example.20090512,
Localization_for_SL.RadGridView.20090513.zip,
Localization_for_WPF.RadGridView.20090513.zip.

Telerik announces the RadToolBar for Silverlight.

Silverlight Team — Fri, 13 Feb 2009 08:56:46 GMT

With the upcoming Q1 release Telerik will include an official version of the RadToolBar control in the RadControls for Silverlight bundle. RadToolBar will mimic the functionalities and behavior of the VS toolbar with its Strip and Overflow areas. All the items in the toolbar will jump between the strip and the overflow depending on the toolbar’s size. In addition, the developer will be able to stick items into one of these areas using a single property - OverflowMode.

RadToolBar will also support Style Selector for item containers. We pre-defined styles for many of the regular controls – button, textbox , combobox and expander.

Along with the RadToolBar control a RadToolBarTray is also coming with Q1 to let you handle multiple toolbars in the same tray. RadToolBarTray will be a container control that will handle the position, the sizing and the order of toolbars inside it. Virtually, the tray will be divided by Bands, where each Band will contain multiple toolbars. The developer will be able to arrange the toolbars by simply initializing the Band and BandIndex properties.

We are currently working on two new major features like: “Drag and Drop” and “Vertical Orientation”.
We will greatly appreciate your feedback on what features you would like to see in the the RadToolBar control. This is always the best way to ensure our products keep getting better.

Announcing RadEditor for Silverlight CTP

Silverlight Team — Tue, 10 Feb 2009 06:39:27 GMT

We are very excited to announce that our Q1 release will feature a CTP edition of Telerik RadEditor for Silverlight. This initial version will support the most basic set of features but you can rest assured that there is a lot more cooking. RadEditor integrates three of our new controls for Silverlight – RadToolbar, RadToobarTray and RadColorPicker. The first two will give you fine-grained control over the positioning of the elements you choose to insert in your editor. The customizable RadColorPicker is used for choosing font and highlight colors and offers a well-known tool to end-users. Below you can find a non-exhaustive list of the initially supported text-formatting features:

Undo
Redo
Insert Hyperlink
Insert Image
Insert Horizontal Rule
Indent
Outdent
Bold
Italic
Underline
Justify Left
Justify Center
Justify Right
Justify Full
Ordered List
Unordered List
Superscript
Subscript
Strikethrough
Font Size
Font Family
Font Color
Highlight Color

API-wise you will be able to manipulate the text in the editor via the exposed methods used internally by the toolbar elements. Getting and setting the selected text, events for changes in the text, etc. will all be available for you to use, of course, enabling you to make the best out of the control. In case we missed something you consider important, please let us know and we’ll do our best to include it in the future versions of RadEditor. We highly value your feedback, so please let us know what you think about RadEditor and the scenarios in which you might want to use it.

RadControls for Silverlight 2.0 World Premier Webcast

Silverlight Team — Tue, 11 Dec 2007 23:51:00 GMT

Join Telerik Chief Technical Evangelist Todd Anglin as he introduces you to Telerik's brand new suite of components for Microsoft's Silverlight 2.0. This is the first time the RadControls for Silverlight 2.0 have ever been shown in public, so don't miss your opportunity to be among the first to see what Telerik is doing in the Silverlight space. Anyone considering Silverlight development in 2008 should attend this event to learn how leading .NET UI component vendor Telerik is going to make it easy to develop professional applications on this brand new framework with very little code.

The webcast will be on Friday, December 14, 2007 3:00 PM - 3:30 PM EST

Registration is free, space is limited - follow this web address:
https://www1.gotomeeting.com/register/490004761

PS: For those of you who can not participate in the live online webcast - a video will be available later on our website (www.telerik.com) - so stay tuned.

The Minesweeper Game Done in Silverlight 1.1

Silverlight Team — Thu, 08 Nov 2007 16:44:00 GMT

Silverlight is a Blast!

And instead of trying to convince you, we present you a well-known game in its silverlit clothes. The minesweeper! It adds to other games that in the past several weeks have shown the ease with which you can use Silverlight to create online interaction and games. It uses no fancy frameworks but underlines the simplicity and straightforwardness of Silverlight development.

The number of mines and the rows/columns are configurable. To mark a mine - instead to click with the right mouse button, click with the left mouse button while holding the CTRL or SHIFT key.

Try the game:

http://blogs.telerik.com/demos/minesweeper/

Get the code here:

The Minefield Project

Concepts presented:

- Controls in ver. 1.1: Control creation and reusing.

- Storyboards: Animations and reversing storyboards.

- Auto-Finding: Harness the power of reflection and forget about XAML to fields binding.

- Event Handling: Mouse and custom events galore!

- Function call delay: A simple call delay that fits in nicely wherever it is needed.

Enjoy!

Shortcut on Silverlight 1.1

Silverlight Team — Tue, 16 Oct 2007 19:30:00 GMT

Here at Telerik we are constantly working with the new cutting edge technologies. As Silverlight 1.1 alpha hit the road we were keen to research all the new things we can do with this new technology ...

But there was one little problem - the lack of help and documentation. Our experience with WPF help us a lot to get into the new technology, but Silverlight is a new platform and it has its differences from WPF.

So when we were contacted by the O'Reilly to write a book for Silverlight 1.1 we decided that this will be a very good opportunity for us, and we will be able to help a lot of people which want to get faster into this new Silverlight platform.

The result - this more than 70 pages shortcut, will help you to get started with Silvelight. It explains the main concepts behind Silverlight - working with XAML, animations, web services and ofcourse, there is a step by step example about how to create your own custom control. Here is the short table of contents:

Understanding Silverlight 1.1
What is Silverlight 1.1?
An overview of RIA
Working with Silverlight 1.1
Building applications and custom controls with Silverlight 1.1
Online resources

you can purchase and download the book from the O'Reilly online catalog.

Thanks to Adam Kinney and Jessy Liberty from Microsoft - they helped us a lot with polishing everything out.

I hope you will enjoy reading the book - let us know what do you think about it.

Silverlight Game for Q2 Release

Silverlight Team — Mon, 17 Sep 2007 19:38:00 GMT

While working on the second release for 2007, Telerik decided to surprise its clients by creating a Silverlight game.
The idea was simple. A registered user enters his or her weight and logs in. This weight contributes to the common goal which is to lift what is on the other side of the rope.

The game was developed using Silverlight 1.1 Alpha Refresh.
We had couple of concerns while developing it, though. First of all we did not know how many people have already installed the 1.1 plug-in. Also we were not sure if the current game was going to reach the popularity of the last. At the end, however, it proved that Silverlight has been adopted by quite few people.

One very important decision we needed to make was how to represent a single user from the database - using a XAML object or a .png image. After some tests and research we decided to stick with the .png image. The reason is because 3000+ XAML elements were taking over 260MB of RAM, while using .png images made the memory consumation to drop to the acceptable 37MB.

After finding solution to the above problem, the rest was quite easy. We developed few user controls(button, person, tooltip) which accelerated the development extremely. The main disadvantage which we found afterwards was a problem with the caching mechanism(same as flash/flex). When the user loads the game for the first time he or she downloads the .dll file locally and on the second visit, the caching mechanism of the browser reuses the local .dll. In order to get the new .dll you need to clear the cache of the browser(alternatively you can hold SHIFT key and press the Refresh button of the browser).

How to Change the Silverlight Installation Message

Silverlight Team — Sun, 09 Sep 2007 16:40:00 GMT

NOTE: From the very beginning I would like to state that this custom solution is temporary and will most probably change with the next release of Silverlight Plug-In.
There is no straightforward approach to changing the Silverlight Download logo.

However, a workaround exists.

1) Download the modified TelerikSilverlight.js and add it to your project

2) Within the Default.aspx of your project, reference TelerikSilverlight.js

<script type="text/javascript" src="TelerikSilverlight.js"></script>

3) Create a javascript function right bellow the previous line of code

<script type="text/javascript">
    function GetInstallHtml ()
    {
        var imgUrl = "http://www.telerik.com/images/editor/OverviewImages/SilverlightLogo.gif";
        var myInstallHtml = 'This is my custom text<br/>' +
                                        '<div style="width: 205px; height: 67px; background-color: #FFFFFF">' +
                                            '<img onclick="javascript:Silverlight.followFWLink({0});"' +
                                            'style="border:0; cursor:pointer" src="' + imgUrl + '"' +
                                            'alt="Get Microsoft Silverlight"/><br/>' +
                                        'This is my custom <a href="javascript:Silverlight.followFWLink({0});">link</a>.' +
                                    '</div>'
        return myInstallHtml;
    }
</script>

Resources:
Sample Default.aspx
TelerikSilverlight.zip