Archive for the ‘Silverlight’ Category

Friday-Evening Fun with Silverlight’s Animation Easing Functions

Friday, April 30th, 2010

This weekend I’ve to finish the second edition of my WPF-book. Luckily it’s going to rain tomorrow. But I’ve almost done it. This evening I’ve just ported a small sample for Animation Easing Functions from WPF to Silverlight. It was easy, all I had to do was using a PathGeometry instead of the not existing StreamGeometry to draw the lines of the functions. Use the fun-sample below to play around with these easing functions. You’ll get the code of this version with my upcoming german Silverlight-Book in August. So have fun, Cheers Thomas.

Visual Studio has been released, Silverlight 4 has been released and the books are on their way…

Saturday, April 17th, 2010

After Visual Studio has been released on Monday this week, Silverlight 4 is also available since Thursday. I’ll have to speed up my book-writing. As many of you know, I’m writing on a second edition of my WPF-book to .NET 4.0 and Visual Studio 2010. I’m also writing on a Silverlight-book (about Silverlight 4.0). Below some details of the two books.

The WPF-Book:

I’ll finish the update of my WPF-book till end of April, so it’ll be released in June. There are many new things in it, like a section to the Model-View-ViewModel-Pattern, Multitouch, the new Controls DatePicker, Calendar and DataGrid, Animation Easing-Functions, VisualStateManager, Windows 7 Taskbarintegration, Pixel-Shaders and much more. Of course there’s also a new version of the FriendStorage-Application that is using new features and controls, like e.g. the DataGrid:

01_06

FriendStorage now also has integration into the Windows 7 Taskbar. So you can iterate through the friends via the Buttons shown in the Windows 7 Taskbar Thumbnail. Also recognize that the image of the current friend is also displayed as overlay-image on the Taskbar-Button

image 

You find the second edition of my WPF-book here on amazon.de

The Silverlight-book

I’ll write on the Silverlight-book till end of June, so it’ll be released in August. I hope you’re looking forward to it. I gave and will give my best that it’s a great resource to all professional Silverlight-Developers and those who want to become one of those. In May I’ll show the contents of the Silverlight-book on my homepage. I’ll also blog here. For now I can say that there’s a FriendStorageOnline-Application in the Samples with Login/Registration and CRUD-Operations via WCF Ria Services. A logged-in User can create Friendlists and insert data as usual. The app looks like this:

01_04

The Silverlight-book is also already on amazon here. But keep in mind that there could be a change in pages (some more up to 1000) and so maybe also in price. I’ll post more information about the targeted pagecount in May, then you’ll also see some details of the contents.

Ciao,
Thomas

Silverlight 4 Release Candidate is here

Monday, March 15th, 2010

The Mix has started some hours ago, and here it is, the Silverlight 4 Release Candidate. Now you can move your development-environment from Visual Studio 2010 Beta to RC. There are also updates to WCF RIA Services, a WCF RIA Services Toolkit etc. Find everything you need here:

http://www.silverlight.net/getstarted/silverlight-4/

There’s also a fantastic post from Tim Heuer about the changes in the Silverlight RC here:

http://timheuer.com/blog/archive/2010/03/15/whats-new-in-silverlight-4-rc-mix10.aspx

Another great thing is that Silverlight 4 is THE technology for Windows Phone 7. So I think I’ve to sell my iPhone and buy me a new Mobile with Windows Phone 7 on it. If you want to start developing Mobile-apps with Silverlight, also go to Tim Heuers blog: http://timheuer.com/blog/archive/2010/03/15/get-started-with-silverlight-for-windows-phone.aspx

So have fun with the new release. I’ll go downstairs in my dark room now and finish up my Silverlight 4.0 book. It’ll take a while. For now I can say if you like my WPF-book, you’ll love that Silverlight book for sure. :)

The DataGrid and the “Input string is not in a correct format” message in Silverlight

Sunday, December 20th, 2009

If you play around with the DataGrid in Silverlight and try some scenarios, maybe you come around the FormatException with the Message “Input String is not in a correct format”. You get this Exception if your Data-Object e.g. has a Property of type int and the user enters some characters in the DataGrid. The Exception doesn’t come up, instead the DataGrid shows it as a validation error. Let’s look at an example. Image you’ve a very simple Person-class containing a FirstName-Property of type string and an Age-Property of type int:

public class Person : INotifyPropertyChanged
{
  private int? _age;
  private string _firstName;
  public string FirstName
  {
    get { return _firstName; }
    set
    {
      _firstName = value;
      Changed("FirstName");
    }
  }

  public int? Age
  {
    get { return _age; }
    set
    {
      _age = value;
      Changed("Age");
    }
  }

  private void Changed(string propertyName)
  {
    if (PropertyChanged != null)
      PropertyChanged(this,
        new PropertyChangedEventArgs(propertyName));
  }

  public event PropertyChangedEventHandler PropertyChanged;
}

Now let’s fill up a List with some Test-Persons and add that list to the DataContext of your page:

public MainPage()
{
  InitializeComponent();
  this.DataContext = new List<Person> {
    new Person{ FirstName="Thomas",Age=29},
    new Person{ FirstName="Julia",Age=27},
    new Person{ FirstName="Ben",Age=1},
  };
}

No in the XAML-File of your MainPage a DataGrid could be defined like below. Notice the ItemsSource-Property that is bound to the DataContext:

<my:DataGrid ItemsSource="{Binding}"
             AutoGenerateColumns="False">
  <my:DataGrid.Columns>
    <my:DataGridTextColumn Header="FirstName"
                           Binding="{Binding FirstName}"/>
    <my:DataGridTextColumn Header="Age"
                           Binding="{Binding Age}"/>
  </my:DataGrid.Columns>
</my:DataGrid>

When the User now enters a string as Age, the FormatException is raised before the Property is updated and the Message of the FormatException is displayed in the DataGrid:

image

Now the question is, where to change this string. The DataGrid has a BindingValidationError-Event, but there you have only read access to the FormatException and the Errormessage. In the Property itself you can’t do anything, because the Exception is thrown before the Age-Property is set.

The solution is to define a Property special for Display in the Person-class. Normally you would create a ViewModel that encapsulates the Person-class and contains the additional property. In my case I implement the Property directly in the Person-class. I call it AgeDisplay-Property. Inside that property you can then throw your own FormatException with your special text. My Person-class now looks like this:

public class Person : INotifyPropertyChanged
{
  private int? _age;
  private string _firstName;
  public string FirstName
  {
    get { return _firstName; }
    set
    {
      _firstName = value;
      Changed("FirstName");
    }
  }

  public int? Age
  {
    get { return _age; }
    set
    {
      _age = value;
      Changed("Age");
      Changed("AgeDisplay");
    }
  }

  public string AgeDisplay
  {
    get { return Age.ToString(); ; }
    set
    {
      if (value == null)
      {
        Age = null;
        return;
      }
      int result;
      if (int.TryParse(value, out result))
      {
        Age = result;
      }
      else
      {
        throw new FormatException("Age must be a number. "
                        + " Characters are not allowed.");
      }
    }
  }

  private void Changed(string propertyName)
  {
    if (PropertyChanged != null)
      PropertyChanged(this,
        new PropertyChangedEventArgs(propertyName));
  }

  public event PropertyChangedEventHandler PropertyChanged;
}

No you simple bind the DataGrid’s Column to AgeDisplay instead of Age:

<my:DataGrid ItemsSource="{Binding}"
             AutoGenerateColumns="False">
  <my:DataGrid.Columns>
    <my:DataGridTextColumn Header="FirstName"
                           Binding="{Binding FirstName}"/>
    <my:DataGridTextColumn Header="Age"
                           Binding="{Binding AgeDisplay}"/>
  </my:DataGrid.Columns>
</my:DataGrid>

When the user now enters a string into the Age-Column, the text of the FormatException thrown in the AgeDisplay-Property is displayed:

image

Great news for Silverlight on Linux

Saturday, December 19th, 2009

The Silverlight-Plugin runs per default on Windows and MacOs. For Linux-Machines there’s an opensource implementation driven by Microsoft and Novell called Moonlight.

While Silverlight is currently in Version 3 available and Version 4 (already in beta) is expected for spring next year, the Moonlight implementation was only availabe in Version 1. And Version 1 means no C#, no CLR, just hacking JavaScript and XAML. But two days ago the big step for Silverlight on Linux was done and Moonlight reached version 2. It’s available for download: http://www.mono-project.com/Moonlight

I think with reaching that level from “only-JavaScript” to the managed C#-API, the future releases of Moonlight will be more closely to the Silverlight-releases for Windows.

Silverlight 4 – How to focus a TextBox that is contained in your Custom Control on Startup

Thursday, December 17th, 2009

Focusing a TextBox that’s inside a Custom Control isn’t so easy at startup of your application. Let me explain the problem that is also discussed on http://forums.silverlight.net/forums/t/151235.aspx. Imagine you’ve created a custom control that has a TextBox as Part-element. The Style that sets the Template would look like this:

<Style TargetType="local:SimpleControl">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate  TargetType="local:SimpleControl">
        <Border Background="{TemplateBinding Background}"
          BorderBrush="{TemplateBinding BorderBrush}"
          BorderThickness="{TemplateBinding BorderThickness}">
          <TextBox x:Name="PART_Text" Margin="10"></TextBox>
        </Border>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

You get the TextBox from the Template in the OnApplyTemplate-Method

public override void OnApplyTemplate()
{
  base.OnApplyTemplate();
  _partTextBox = this.GetTemplateChild("PART_Text") as TextBox;
}

Now imaginge you want to focus your SimpleControl in the constructor of your MainPage like below:

public MainPage()
{
  InitializeComponent();
  HtmlPage.Plugin.Focus();
  yourControl.Focus();
}

The Problem that occurs is that the OnApplyTemplate-Method is called after the Focus-Method. So you don’t have the TextBox defined in your Template. The Solution is very easy. Just hide the Focus-Method from the base-class and set a flag. But keep in mind that this won’t work if you store your SimpleControl in a variable of type Control, cause then no polymorphic call is made to the Focus-Method defined in SimpleControl. Here a sample implementation:

public class SimpleControl : Control
{
  private bool _applyFocusToPartTextBox;
  private TextBox _partTextBox;
  public SimpleControl()
  {
    this.DefaultStyleKey = typeof(SimpleControl);
  }
  public override void OnApplyTemplate()
  {
    base.OnApplyTemplate();
    _partTextBox = this.GetTemplateChild("PART_Text") as TextBox;
    if (_partTextBox != null)
    {
      if (_applyFocusToPartTextBox)
        _partTextBox.Focus();
    }
    _applyFocusToPartTextBox = false;
  }
  public new bool Focus()
  {
    if (_partTextBox == null)
    {
      _applyFocusToPartTextBox = true;
      return true;
    }
    return base.Focus();
  }
}

How to supress the Alt-Key in Silverlight’s TextBox

Tuesday, December 1st, 2009

You can restrict the input-values in Silverlight’s TextBox by handling the KeyDown-Event. But the KeyDown-Event isn’t fired if the user enters a key by pressing e.g. ALT + 123.

Corresponding to the problem mentioned in http://forums.silverlight.net/forums/t/147718.aspx, I’ll show here a short workaround by using the TextChanged and KeyUp-Event of the TextBox. Just use the following snippet, that removes a character that was added by pressing the ALT- and another Key or Key-Combination:

private void TextBox_TextChanged(object sender, TextCh… e)
{
  if (_altWasPressed)
  {
    // remove the added character
    var textBox = ((TextBox)sender);
    var caretPos = textBox.SelectionStart;
    var text = textBox.Text;
    var textStart = text.Substring(0, caretPos - 1);
    var textEnd = "";
    if (caretPos < text.Length)
      textEnd = text.Substring(caretPos, text.Length-caretPos);
    textBox.Text = textStart + textEnd;
    textBox.SelectionStart = caretPos - 1;

    _altWasPressed = false;
  }
}
private bool _altWasPressed;
private void TextBox_KeyUp(object sender, KeyEventArgs e)
{
  _altWasPressed = e.Key == Key.Alt;
}

How to print dynamically created Images in Silverlight 4 Beta

Wednesday, November 25th, 2009

Silverlight 4 supports printing scenarios. It’s quite easy. Just create a PrintDocument instance, handle the PrintPage-Event and call the Print-Method. In the PrintPage-Event set the PageVisual-Property of the PrintPageEventArgs to a UIElement of your choice. If there are more pages, set the HasMorePages-Property of the PrintPageEventArgs to true and the PrintPage-Eventhandler would be called again for the next page.

Below a simple example using a lambda expression. When the Print-Method is called a PrintDialog is displayed to the User, where he can select the printer of his choice. When the PrintDialog was accepted, the PrintPage-Event gets fired and the lambda expression below get’s called. The PageVisual-Property is set to a TextBlock. So that TextBlock with the text “Thoams says…” is printed out.

var pd = new PrintDocument();
pd.PrintPage += (s, e) =>
  {
    e.PageVisual = new TextBlock {Text="Thomas says Hello"};
  };
pd.Print();

Ok, so far so good. As I was working on an example for my upcoming Silverlight 4 book I needed to create an Image-Element on the fly and print this out. And then I noticed that the Image doesn’t appear on the output.

While searching for a solution I found somebody having the same problem in this thread in Microsoft’s Silverlight forums:

http://forums.silverlight.net/forums/t/145680.aspx

So, it seemed it was not my cause, it was a Beta-cause. So let’s look at a workaround. But first look at the bug.

I made a smaller example to reproduce it. View the following code. What do you think is printed on the page?

void PrintButton_Click(object sender, RoutedEventArgs e)
{
  var streamResourceInfo =
    Application.GetResourceStream(
      new Uri("thomas.png", UriKind.Relative));

  var bitmapImage = new BitmapImage();
  bitmapImage.SetSource(streamResourceInfo.Stream);

  var image = new Image
  {
    Width = bitmapImage.PixelWidth,
    Height = bitmapImage.PixelHeight,
    Source = bitmapImage
  };

  var pd = new PrintDocument();
  pd.PrintPage += (s, args) =>
    {
      args.PageVisual = image;
    };
  pd.Print();
}

Right, an Image should be printed on the page. But it isn’t. The page is empty. Well, the next thing I tried was to call Measure, Arrange and UpdateLayout on the Image to force a layout-pass. But anyway, it didn’t work, the printed page is always empty.

When the Image isn’t created on the fly, it works. Define the Image in XAML like this

<Image Source="thomas.png" x:Name="image"/>

and a Print-Method in the Codebehind-File would work like that:

void PrintButton_Click(object sender, RoutedEventArgs e)
{
  var pd = new PrintDocument();
  pd.PrintPage += (s, args) =>
    {
      args.PageVisual = image;
    };
  pd.Print();
}

But we want to print an Image on the fly. So how to do that? One way I found out was to create an ImageBrush and set its ImageSource-Property to the BitmapImage. Use the ImageBrush for a Rectangle’s Fill-Property and print out that Rectangle. So here is some code to dynamically print an image by using an ImageBrush in combination with a Rectangle:

void PrintButton_Click(object sender, RoutedEventArgs e)
{
  var streamResourceInfo =
    Application.GetResourceStream(
      new Uri("thomas.png", UriKind.Relative));

  var bitmapImage = new BitmapImage();
  bitmapImage.SetSource(streamResourceInfo.Stream);

  var imageBrush = new ImageBrush();
  imageBrush.ImageSource = bitmapImage;

  var rectangle = new Rectangle
  {
    Width = bitmapImage.PixelWidth,
    Height = bitmapImage.PixelHeight,
    Fill = imageBrush
  };

  var pd = new PrintDocument();
  pd.PrintPage += (s, args) =>
    {
      args.PageVisual = rectangle;
    };
  pd.Print();
}

And voilà, the output looks like this when printed to my PDFCreator-Printer:

image

[Download the Source]

Cheers Thomas

Silverlight 4 – the first Beta is here

Wednesday, November 18th, 2009

… my expectations about a Major 4.0 release next year may come true: Silverlight 4.0, WPF 4.0, .NET 4.0, Expression Blend 4.0 etc.

Today Microsoft announced Silverlight 4.0 Beta 1 available for download. There are impressing features for business applications like print support, clipboard, Drag’n’Drop or local fileaccess through full trusted Silverlight-Applications. I’m glad the Galileo-Computing team and I decided to publish my upcoming Silverlight-book to version 4.0. More infos about the book soon here: www.thomasclaudiushuber.com/silverlight.

Find all interesting links about the Beta 1 of Silverlight 4.0 on the site below:

http://www.silverlight.net/getstarted/silverlight-4-beta/

Cheers
Thomas

Hey Thomas, what’s coming up next?

Saturday, October 31st, 2009

I’ll give you just a short information of what is coming up next and what I did the last months. Let’s start with the things coming up…

… what’s coming up next:

  • WebTech-Conference – 16th November, Karlsruhe/Germany
    Another talk about datadriven Silverlight-Applications. Meet me at this conference for discussions about WPF, Silverlight, .NET in general, my books and other topics. Find more about the WebTech-conference on webtech
  • Update of the WPF-book to .NET 4.0 and Visual Studio 2010
    The WPF-book was written about .NET 3.5. Next year .NET 4.0 will be released. There are many new things introduced in WPF. The DataGrid- and DatePicker-Control, VisualStateManager, Animation Easing Functions, Layout Rounding and so on. I’m working on an update of the book that will be released next year shortly after the German Visual Studio Release.
  • Writing a german book about Silverlight 4
    Currently I’m working hard on my book about Silverlight 4. I’ve already written about 300 pages. The book will be released next year shortly after the Silverlight 4 release. There are no comments on the Silverlight 4 release, but at PDC in mid-November there’s a session about the Silverlight-Roadmap. Then we’ll know more. So stay tuned. Find more about the upcoming Silverlight-Book on the new silverlight-category on my homepage

… what I did the last months:

  • Silverlight-Articles
    I’ve written six articles about Silverlight for the German dotnet-magazine. Download the articles beside others on www.thomasclaudiushuber.com/articles.php.
  • PrioConference – 28th October, Munich/Germany
    I had a session about datadriven Silverlight-Applications. Find the Details on the new talks-category on my homepage.

So stay tuned. If you’ve any questions, leave a comment or write me an email via the contact-form on my homepage.

Thomas