Winamp Tool kills Silverlight application

I have experienced something really strange. When I installed Winamp, a music player, my Silverlight application cant run in Debug mode any more.

Anyway, I am just posting about this, so if any one has their Silverlight app can’t run in Debug mode all of the sudden, you might check if you have installed Winamp tool or not?

Cheers,

Use Enum as ItemsSource

Imagine we have an Enum type and we want to use that Enum type to be an ItemsSource of ListBox or ComboBox. Bolow is an example of an Enum type called AirFareBookingStatus

   1: public enum AirFareBookingStatus

   2: {

   3:     AlreadyPaid,

   4:     Cancelled,

   5:     Delayed,

   6:     Deleted,

   7:     InProcessing,

   8:     New

   9: }

What we want to achieve is to populate all the statuses from the Enum to a ListBox or ComboBox.

There is already a solution for this from the Silverlight forum. The idea is to go through all the Field and put them into a IEnumerable of KeyValuepair

   1: IEnumerable<KeyValuePair<string, AirFareBookingStatus>> results; 

   2: var x = typeof(AirFareBookingStatus).GetFields().Where(info => info.FieldType.Equals(typeof(AirFareBookingStatus)));

   3: results = from field in x

   4:           select new KeyValuePair<string, AirFareBookingStatus>(field.Name, (AirFareBookingStatus) Enum.Parse(typeof(AirFareBookingStatus), field.Name, false)); 

Then all we have to do is assign the result to ListBox or ComboBox ItemsSource

   1: lstStatus.ItemsSource = results;

   2: cmbStatus.ItemsSource = results;

That would be good enough for it to work.

But we can even make it more generic by creating a helper function as below

   1: public static class Helper

   2: {

   3:     internal static IEnumerable<KeyValuePair<string, T>> GetEnumList<T>()

   4:     {

   5:         var x = typeof(T).GetFields().Where(info => info.FieldType.Equals(typeof(T)));

   6:         return from field in x

   7:                select new KeyValuePair<string, T>(field.Name, (T) Enum.Parse(typeof(T), field.Name, false)); 

   8:     }

   9: }

Then, we can call that function for every Enum type we have. For example

   1: lstStatus.ItemsSource = Helper.GetEnumList<AirFareBookingStatus>();

   2: cmbColors.ItemsSource = Helper.GetEnumList<ColorEnum>();

There is still one problem left we have. The item still displays the whole object, so make it display correctly, we need to create DataTemplate resource

   1: <DataTemplate x:Key="KeyValuePairDataTemplate">

   2:     <TextBlock Text="{Binding Key}" />

   3: </DataTemplate>

Then apply that DataTemplate to the ItemTemplate of ListBox or ComboBox as below

   1: <ListBox x:Name="lstStatus"

   2:     ItemTemplate="{StaticResource KeyValuePairDataTemplate}" />

   3:  

   4: <ComboBox x:Name="cmbColors"

   5:     ItemTemplate="{StaticResource KeyValuePairDataTemplate}" />

That’s it. Hope that helps.

Continue …

Now, I have run into another problem. Doing that way above is all good, except the name won’t be as flexible. So, I am going to Description attribute to display data instead of the normal name of the Enum. To do that, I’ve changed a bit of my Enum like below

   1: public enum AirFareBookingStatus

   2: {

   3:     [Description("Already Paid")]

   4:     AlreadyPaid,

   5:     [Description("i am cancelled")]

   6:     Cancelled,

   7:     [Description("I got delayed")]

   8:     Delayed,

   9:     [Description("oh man i am about to be deleted")]

  10:     Deleted,

  11:     [Description("who is processing me")]

  12:     InProcessing,

  13:     [Description("I am brand new babe")]

  14:     New

  15: }

Next, I changed a bit in my helper function as well. It’ll get the Description attribute and make it to be Key

   1: internal static IEnumerable<KeyValuePair<string, T>> GetEnumList<T>()

   2:        {

   3:            var x = typeof(T).GetFields().Where(info => info.FieldType.Equals(typeof(T)));

   4:            return from field in x

   5:                   select new KeyValuePair<string, T>(GetEnumDescription(field), (T)Enum.Parse(typeof(T), field.Name, false)); 

   6:        }

   7:  

   8: private static string GetEnumDescription(FieldInfo field)

   9:        {

  10:            DescriptionAttribute[] attributes = (DescriptionAttribute[])field.GetCustomAttributes(typeof(DescriptionAttribute), false);

  11:            if (attributes.Length > 0)

  12:            {

  13:                return attributes[0].Description;

  14:            }

  15:            else

  16:            {

  17:                return field.Name;

  18:            }

  19:        }

Finally, we will have something like this

That’s it. Let me know if you have any comments.

Default Focus Behavior

I would love to share with you guys about Default Focus Behavior which I just created an hour ago because I thought this behavior would be very handy.

With this behavior, we would be able to set focus to any controls when we trigger any control events.

For example, whenever we click the button, we want to textbox got focused, or when we select the Option 1 for the very first time, the textbox will get focused as below image



Click the icon below for the source code



Hopes this helpful :)Technorati Tags: Behaviors

FocusManager

I've read this article about FocusManager. I think it could come handy sometimes when you want to know what element has focus. FocusManager class which can be found in the System.Windows.Input namespace. Below is the sample of how to use it

The FocusManager class has only one static method:

<span class="kwrd">public</span> <span class="kwrd">static</span> Object GetFocusedElement();

Using the FocusManager is easy. Here’s a small example of a possible usage:

var focusedElement = FocusManager.GetFocusedElement() as Control;
if (focusedElement != null)
     Output.Text = focusedElement.Name;

One last note: The FocusManager class is also available in the “normal” .NET Framework 3.0 or later.

Binding for Converter Parameter

I have come across the situation where I need to do some Binding for ConverterParameter. Something like


I have done lots of research, and I found out that its impossible to do binding for ConverterParameter.
So I came up with the Solution. I created the Converter but inherited from FrameworkElement

public class ShowDeleteServiceConverter : FrameworkElement, IValueConverter

In the converter class, I created a dependency property



Now, I can do the Binding as usual

And



It might not be the best solution, but it works for me so far. If you have any idea, feel free to drop me comments.

Cheers,

How to Change the Startup Class

Another great tip from Mike Snow. Read the original article here 

When a Silverlight application is launched the entry point is a class that inherits from System.Windows.Application. By default, when you create a new Silverlight application project, this would be your App class which gets defined in App.xaml.cs. You can, however, change which startup class you want to use. In fact, if you do not plan to use XAML at all you can reduce the size of your application by deleting the Page and App classes including the XAML and code behind files. 

To accomplish this follow these steps: 

Step 1. Create a new Silverlight application project adding a new ASP.net web project to host the Silverlight app. 

Step 2. Delete App.xaml and Page.xaml (the CS files will be deleted also). 

Step 3. Create a new class and call it StartupTest.cs 

Step 4. Modify your new class to inherit from Application as seen here:

public class StartupTest : Application

{

    public StartupTest()

    {

    }

}

Step 5. Right click on your Silverlight application project in the Solution Explorer of VS. From the context menu choose Properties. This will bring up the Properties dialog. Click on the Silverlight tab at the top-left and change the Startup object to be your class as seen circled here:

Step 6. Go back to your StartupTest class. Add an event to monitor for when the application has started. You don’t want to do anything until after this event has started.

public class StartupTest : Application

{

    public StartupTest()

    {

        this.Startup += new StartupEventHandler(StartupTest_Startup);

    }

    void StartupTest_Startup(object sender, StartupEventArgs e)

    {

    }

}

Step 7. The Application.RootVisual is root pointer to the main application UI. You will need to create this object to point an object such as a Grid or Canvas control. Once created, you can add additional controls to the children as you see fit. In the example below, I have created a Canvas as the root and configured its background color to be black, its width to be 800 and height to be 600. Also, I have added a Textbox to the Canvas control.

void StartupTest_Startup(object sender, StartupEventArgs e)

{

    this.RootVisual = new Canvas();

    ((Canvas)this.RootVisual).Width = 800;

    ((Canvas)this.RootVisual).Height = 600;

    ((Canvas)this.RootVisual).Background = new SolidColorBrush(Colors.Black);

    TextBlock tb = new TextBlock();

    tb.Foreground = new SolidColorBrush(Colors.White);

    tb.FontSize = 20;

    tb.Text = "NO XAML NEEDED!!!";

    ((Canvas)this.RootVisual).Children.Add(tb);

}

Step 8. Run the application and you will see the following image rendered in your browser: Technorati Tags: Silverlight

Silverlight Toolkit: Label

Hi, I have found the awesome article from Justin-Josef
Angel about LABEL the new silverlight control.
I guess that I
could post it into my blog for my own reference and might as well any
one who has been reading my blogs by any chance.

Click here to see the
original post from Justin-Josef Angel.
Thanks Justin
for an awesome article :)

Setup

1. Create a new project.

2, Add a reference to the Silverlight Controls assembly (Microsoft.Windows.Controls.dll) which can be downloaded at http://codeplex.com/Silverlight.

3. Look under "Custom Controls" In the Blend Asset Library.

4. Add a Label to the Page.

And here's the XAML we got:

<UserControl

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

x:Class="SilverlightControlsNovember2008.Page"

Width="640" Height="480"

xmlns:slctls="clr-namespace:Microsoft.Windows.Controls;assembly=Microsoft.Windows.Controls">

<Grid x:Name="LayoutRoot" Background="White">

<slctls:Label HorizontalAlignment="Left" Margin="98,179,0,220" Width="148" Content="Label"/>

</Grid>

</UserControl>

Setting the content for Label

One way of editing a Label's content is double clicking on it.

And here's the XAML we just got:

<slctls:Label HorizontalAlignment="Left" Margin="98,179,0,220" Width="148" Content="Hello World!"/>

Another way is editing the Content property directly through the Blend Data pane:

Changing the Label’s Border

We can set the BorderBrush & BorderThinckness properties for Label in order to change it’s border.

Let’s start by changing the BorderBrush to a SoliderColorBrush with a light grey color. Click on BorderBrush and select SolidColorBrush.

-->

Than we’ll select a light gray color.

Next, we’ll change the BorderThickness to 1 on all sides.

And we can see our Label has a nice subtle light grey border around itself:

Here’s the XAML we just generated:

<slctls:Label HorizontalAlignment="Left" Margin="98,179,0,0" Width="79" Content="I am a Label!" VerticalAlignment="Top" Height="20" BorderBrush="#FFC6C4C4" BorderThickness="1,1,1,1"/>

Changing Label’s Background and Foreground

Let’s do what the title says!

In
case you’re wondering TextBlock does not have a Background. So
it’s a bit different than what we would have normally done with
TextBlock.

We’ll select Background and set it to SolidColorBrush with the color Black.

-->

Next we’ll select the Foreground property and set it to SolidColorBrush with the color white.

-->

here’s our Label:

And the xaml we generated:

<slctls:Label HorizontalAlignment="Left" Margin="98,179,0,0" Width="79" Content="I am a Label!" VerticalAlignment="Top" Height="20" BorderBrush="#FFC6C4C4" BorderThickness="1,1,1,1" Background="#FF000000" Foreground="#FFF5F3F3"/>

Changing the Label’s Template

Let’s
say we're unhappy with the default border for out Text inside the
Label. Through the power of templating we can change it.
So let’s create a RadialLabelTemplate.

We’ll start of by adding a new label to form.

Than Right Click on it, select “Edit Control Parts(Template) –> Create Empty…”.

We’ll change the Resource name to RadialPanelTemplate.

And here’s the drawing area of the new template:

Let’s add the Ellipse for the radial background.

Now
we want to add a TextBlock to display the content of the Label. Before
we can do that, we’ll need to add a container that will contain
both our Ellipse and our TextBlock. We’ll Group our Ellipse into
a Canvas.

Finally we can add our TextBlock that has the Label Content.

We’ll
use TemplateBinding to connect this TextBlock.Text to the Label.Content
property. Click the “Advanced Options” next to the Text
property.

Select “Custom Expression”.

And put in the correct TemplateBinding.

To preview our form we can go back to our form.

And here it is:

Now we can we add 3 more label to our page and just apply this new template to them.

We’ll
select each of our new Labels, Right click, select “Edit Control
Parts (Template) –> Apply Resource –> Radial Label
Template”.

-

And here’s our new form:

Here’s the XAML we just generated for the RadialLabelTemplate:

<UserControl.Resources>

<ControlTemplate x:Key="RadialLabelTemplate" TargetType="slctls:Label">

<Canvas Height="Auto" Width="Auto">

<Ellipse Height="35" Width="125" Fill="#FFFFFFFF" Stroke="#FF000000"/>

<TextBlock Height="20" Width="82.667" Canvas.Left="22.667" Canvas.Top="7.333" Text="{TemplateBinding Content}" TextWrapping="Wrap"/>

</Canvas>

</ControlTemplate>

</UserControl.Resources>

And the Xaml for our labels:

<slctls:Label Template="{StaticResource RadialLabelTemplate}" Content="Radial Label!" Width="124" Height="34"/>

<slctls:Label Template="{StaticResource RadialLabelTemplate}" Height="19.333" Content="Radial == good" FontSize="10"/>

<slctls:Label Template="{StaticResource RadialLabelTemplate}" Height="29.333" Width="144" Content="I R Radial" />

<slctls:Label Template="{StaticResource RadialLabelTemplate}" Height="28.667" Width="130.334" Content="U R Radial"/>

Editing a Label’s ContentTemplate

Templates
are used with TemplateBindings that emanate for general Control
properties. But we might do bind our Label to CLR property from any
Data Source. like, Cows.

We’ll create (in Visual studio) our Cow class that has Age and Name.

public class Cow

{

public Cow(string Name, int Age)

{

Name = Name;

Age = Age;

}

public string Name { get; set; }

public int Age { get; set; }

}

A very basic CLR class that has 2 properties: a numeric age and a string that represents the age of the cow.

Now let’s use this class and create a cow we’ll DataBind our label to.

public partial class Page : UserControl

{

public Page()

{

// Required to initialize variables

InitializeComponent();

this.Loaded += new RoutedEventHandler(Page_Loaded);

}

void Page_Loaded(object sender, RoutedEventArgs e)

{

myLabel.DataContext = new Cow("Betsy", 3);

}

}

Eventually I’d like for us to see a Label that looks like this:

We’d like to change the thickness of the head line based on Cow.Age and change the text based on Cow.Name.

Let’s start by adding a new Label to the page and changing it’s name to myLabel.

We’d like to edit the ContentTemplate
of this label, so we’ll Right Click on the label select
“Edit Other Templates –> Edit Generated Content
(ContentTemplate) –> Create Empty…”

We’ll call our new ContentTemplate – CowContentTemplate.

As always we start off with an empty ContentTemplate.

I’ll spare you my third grade drawing skills and we’ll magiclly add some lines that are our cow.

Truly a masterpiece.

If you squint really hard, they look alike

Next we’d like to add the appropriate bindings.

We’ll select the TextBlock in the middle of the cow.

Click “Advanced Options –> Custom Expression”.

And add a Binding to the Cow Name.

Next, we’ll select the Cow’s head.

And set a StrokeThickness to a Custom expression that’s bound to the Cow’s age.

One last thing we have to do before we can run the sample is set the Cow’s Content to it’s DataContext.

We’ll ad a Custom expression to the Content property of the label.

Finally we can run the sample.

Let’s add a few more Labels with that ContentTemplate and with more Cows.

public partial class Page : UserControl

{

public Page()

{

// Required to initialize variables

InitializeComponent();

this.Loaded += new RoutedEventHandler(Page_Loaded);

}

void Page_Loaded(object sender, RoutedEventArgs e)

{

myLabel.DataContext = new Cow("Betsy", 3);

myCowLabel1.DataContext = new Cow("Martha", 1);

myCowLabel2.DataContext = new Cow("Flossy", 5);

myCowLabel3.DataContext = new Cow("Hoss", 2);

}

}

We’ll make sure to add those label to our page and re-run this sample.

And our Cow Herd is now complete.

Here’s our DataTemplate XML.

<UserControl.Resources>

<DataTemplate x:Key="CowContentTemplate">

<Grid>

<TextBlock Margin="21.75,9.833,27.25,9.167" TextWrapping="Wrap" FontSize="8" Text="{Binding Path=Name}"/>

<Ellipse HorizontalAlignment="Right" Margin="0,2.167,4.583,13.833" Width="15.084" Fill="#FFFFFFFF" Stroke="#FF000000" StrokeThickness="{Binding Path=Age}"/>

<Rectangle Margin="18.75,8,25.25,8" Fill="#FFFFFFFF" Stroke="#FF000000" RadiusX="1" RadiusY="1"/>

<Path Height="2.334" HorizontalAlignment="Right" Margin="0,12.25,19.417,0" VerticalAlignment="Top" Width="6.667" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" Data="M65.166664,9.833333 L59.5,11.166667"/>

<Path Height="6" HorizontalAlignment="Right" Margin="0,0,23.75,2.667" VerticalAlignment="Bottom" Width="3.667" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" Data="M58.833332,19.666666 L61.5,24.666666" d:LayoutOverrides="Width"/>

<Path Height="4.5" HorizontalAlignment="Left" Margin="27.585,0,0,3.833" VerticalAlignment="Bottom" Width="2.166" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" Data="M35.333332,19.666666 L34.166668,23.166666"/>

<Path Height="4.834" HorizontalAlignment="Right" Margin="0,0,33.751,4.333" VerticalAlignment="Bottom" Width="1.833" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" Data="M51.833332,22.666666 L51,18.833334" d:LayoutOverrides="Width"/>

<Path Height="5" HorizontalAlignment="Left" Margin="18.917,0,0,4.333" VerticalAlignment="Bottom" Width="4" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" Data="M27.333334,19.35417 L24.833334,23.187502"/>

</Grid>

</DataTemplate>

</UserControl.Resources>

And our Cow labels:

<slctls:Label Height="32.5" Margin="311.5,56.75,235.5,0" VerticalAlignment="Top" x:Name="myLabel" ContentTemplate="{StaticResource CowContentTemplate}" Content="{Binding}" />

<slctls:Label Height="32.5" Margin="311,129.5,236,0" VerticalAlignment="Top" x:Name="myCowLabel1" ContentTemplate="{StaticResource CowContentTemplate}" Content="{Binding}" />

<slctls:Label Height="32.5" Margin="311,198.75,236,0" VerticalAlignment="Top" x:Name="myCowLabel2" ContentTemplate="{StaticResource CowContentTemplate}" Content="{Binding}" />

<slctls:Label Height="32.5" Margin="311.5,0,235.5,184.5" x:Name="myCowLabel3" ContentTemplate="{StaticResource CowContentTemplate}" Content="{Binding}" />