Training courseware for Telerik RadControls for Silverlight

image

This training material will help you quickly get up to speed with Silverlight and will discuss some of the issues in common with all RadControls such as binding or theming, working with RIA Services (also WCF and ADO.NET), working with Expression Blend, etc.  

The courseware is available to everyone for free download from our website:
PDF (47MB)

The sample C# projects can now be downloaded along with the book at: http://www.telerik.com/support/documentation-and-tutorials/step-by-step-tutorial-for-silverlight.aspx.

Simple Dialog Service in Silverlight – It is an Asynchronous Process!

I noticed on the forums there are a lot of users not comfortable with asynchronous programming who struggle a bit in Silverlight with getting their arms around the concept of a dialog box. In other environments, you can simply shoot out a dialog, wait for the response, and continue. In Silverlight, of course, the action is asynchronous. I would argue it should be this way most of the time.

The problem is that many people tend to take the approach of trying to force the process into a synchronous one, instead of changing the way they think and approach the application. There is a reason why processes are asynchronous in Silverlight. There is one main UI thread, and a blocking process would block the entire thread and effectively freeze the Silverlight application. Having the process asynchronous allows you to continue to render graphics elements, perform actions in the background, even display a soothing animation while you await the user’s response.

Note: the use of Action<bool> Response for callback & dialog.Show() is not a blocking call. This allow the Silverlight UI Thread to continue and Wait for the Response from the ChildWindow Dialog

Dialog is derived from ChildWindow
public class DialogService : IDialogService
{
    public void ShowDialog(string title, string message, bool allowCancel, Action<bool> response)
    {
        var dialog = new Dialog(allowCancel) {Title = title, Message = message, CloseAction = response};
        dialog.Closed += DialogClosed;
        dialog.Show();
    }

    static void DialogClosed(object sender, EventArgs e)
    {
        var dialog = sender as Dialog;
        if (dialog != null)
        {
            dialog.Closed -= DialogClosed; 
            dialog.CloseAction(dialog.DialogResult == true);
        }
    }
}
// Using the Dialog
public partial class MainPage : UserControl
{
    private bool _toggleState = true;
    private readonly IDialogService _dialog = new DialogService();

    public MainPage()
    {
        InitializeComponent();
    }
// Example 1
    private void ToggleEnabled_Click(object sender, RoutedEventArgs e)
    {
        _dialog.ShowDialog(
            _toggleState ? "Disable Button" : "Enable Button",
            _toggleState
                ? "Are you sure you want to disable the dialog button?"
                : "Are you sure you want to enable the dialog button?",
            true,
            r =>
                {
                    if (r)
                    {
                        _toggleState = !_toggleState;
                        DialogButton.IsEnabled = _toggleState;
                        ToggleEnabled.Content = _toggleState ? "Disable Dialog Button" : "Enable Dialog Button";
                    }
                });
    }
// Example 2
    private void DialogButton_Click(object sender, RoutedEventArgs e)
    {
        _dialog.ShowDialog(
            "Confirm This",
            "You have to either close the window or click OK to confirm this.",
            false,
            r => { TextDialog.Text = r ? "You clicked OK." : "You closed the dialog."; });
    }
}
For more goto: http://csharperimage.jeremylikness.com/2010/01/simple-dialog-service-in-silverlight.html

ICommand in Silverlight 4

In Silverlight 4, ButtonBase (and all its derived versions) and HyperlinkButton now support Command and CommandParameter to tie ICommand implementations.  For example, in XAML I can tie two different buttons to the SaveCommand that I have on some object i’ve bound to my UI:

<Border BorderBrush="LightGray"
        BorderThickness="1">
  <StackPanel Orientation="Horizontal">
    <TextBlock>Tools:</TextBlock>
    <Button Command="{Binding SaveCommand}"
            CommandParameter="{Binding Person}"
            Content="Save" />
  </StackPanel>
</Border>
<StackPanel Grid.Row="1">
  <TextBlock FontWeight="Bold"
             Text="Person" />
  <TextBlock Text="Name" />
  <TextBox Text="{Binding Person.Name, Mode=TwoWay}" />
  <TextBlock Text="Occupation" />
  <TextBox Text="{Binding Person.Occupation, Mode=TwoWay}" />
  <Button Command="{Binding SaveCommand}"
          CommandParameter="{Binding Person}"
          Width="100"
          HorizontalAlignment="Right"
          Content="Save" />
</StackPanel>

By binding a SaveCommand to both of these buttons, whenever either of the buttons is pressed, the command will be executed.  But perhaps even more important is that as the command isn’t valid (perhaps when the Person doesn’t have changes), the buttons will be disabled.

For more on how to implement the command in C# goto http://wildermuth.com/2010/01/21/New_SL4_Feature_Commanding

WriteableBitmapEx from codeplex

The WriteableBitmapEx library is a collection of extension methods for Silverlight’s WriteableBitmap. The WriteableBitmap class that was added in Silverlight 3, allows the direct manipulation of a bitmap and could be used to generate fast procedural images by drawing directly to a bitmap. The WriteableBitmap API is very minimalistic and there’s only the raw Pixels array for such operations. The WriteableBitmapEx library tries to compensate that with extensions methods that are easy to use like built in methods. The library extends the WriteableBitmap class with elementary and fast (2D drawing) functionality, conversion methods and functions to combine (blit) WriteableBitmaps.
The extension methods are grouped into different CS files with a partial class. It is possible to include just a few methods by using the specific source CS files directly or all extension methods through the built library assembly.
wbx_announcement.png

Features

  • Base
    • Support for the Color structure
    • SetPixel method with various overloads
    • Fast Clear methods
    • ForEach method to apply a given function to all pixels of the bitmap
  • Shapes
    • Fast line drawing algorithms
    • Ellipse, polyline, quad, rectangle and triangle
  • Blitting
    • Different blend modes including alpha, additive, subtractive, multiply, mask and none
    • Optimized fast path for non blended blitting
  • Conversion
    • Convert a WriteableBitmap to a byte array
    • Create a WriteableBitmap from a byte array

Sample Code

// Initialize the WriteableBitmap with size 512x512 and set it as source of an Image control
WriteableBitmap writeableBmp = new WriteableBitmap(512, 512);
ImageControl.Source = writeableBmp;

// Clear the WriteableBitmap with white color
writeableBmp.Clear(Colors.White);

// Green line from P1(1, 2) to P2(30, 40)
writeableBmp.DrawLine(1, 2, 30, 40, Colors.Green);

// Black triangle with the points P1(10, 5), P2(20, 40) and P3(30, 10)
writeableBmp.DrawTriangle(10, 5, 20, 40, 30, 10, Colors.Black);

// Red rectangle from the point P1(2, 4) that is 10px wide and 6px high
writeableBmp.DrawRectangle(2, 4, 12, 10, Colors.Red);

// Blue ellipse with the center point P1(2, 2) that is 8px wide and 5px high
writeableBmp.DrawEllipseCentered(2, 2, 8, 5, Colors.Blue);

// Closed green polyline with P1(10, 5), P2(20, 40), P3(30, 30) and P4(7, 8)
int[] p = new int[] { 10, 5, 20, 40, 30, 30, 7, 8, 10, 5 };
writeableBmp.DrawPolyline(p, Colors.Green);

// Present the WriteableBitmap!
writeableBmp.Invalidate();

For more visit: http://writeablebitmapex.codeplex.com/

Teach your kids games programing using Kodu

What is Kodu?

Kodu is a visual programming language made specifically for creating games. It is designed to be accessible for children and enjoyable for anyone. Kodu provides an end-to-end creative environment for designing, building, and playing your own new games.

Programming as a Creative Medium

The core of the Kodu project is the programming user interface. The language is simple and entirely

icon-based. Programs are composed of pages, which are broken down into rules, which are further divided into conditions and actions. Conditions are evaluated simultaneously.

The Kodu language is designed specifically for game development and provides specialized primitives derived from gaming scenarios. Programs are expressed in physical terms, using concepts like vision, hearing, and time to control character behavior. While not as general-purpose as classical programming languages, Kodu can express advanced game design concepts in a simple, direct, and intuitive manner.

Screen
The Game Load / Community Screen.

Screen
Yes, we have a turtle.

Screen
"Physical" sensors are used as rule input.

Screen
Stick can’t walk but he packs a wallop.

Download Kodu for PC Technical Preview Now

The programming environment also runs on the Xbox, allowing rapid design iteration using only a game controller for input. Kodu Game Lab can be found in the Xbox Marketplace in the Indie Games channel.

Click here to find out more