Atlanta Silverlight Fire Starter event yesterday was awesome!  There were over 100 people attending.  The vast majority stayed there for the entire length of the event that lasted from 8am until 6pm.  All presenters did a great job.  All attendees were great.  They actively participated in all discussions, asking many questions.  Many thanks to all the event sponsors who helped make Fire Starter possible,  The event was truly a communal effort pulled off by many people excited about the technology and willing to share their knowledge and experience.  Please see Silver light Atlanta site for more details about the event and its sponsors.

I posted my presentation about Deploying Silverlight Applications that I presented at the Fire Starter on the SkyDrive below.  Here is direct link: http://cid-2383900f69b808e0.skydrive.live.com/self.aspx/Atlanta%20Silverlight%20FireStarter%202009.  The zip file contains sample project, database backup and PowerPoint presentation.

I was also going to chat for a couple of minutes about reporting in Silverlight and localization in Silverlight, however we of ran out of time by the end of the day.  I pushed an example in localization into the zip file above.  Just look at how title is setup on the main screen.  If you are interested in reporting in Silverlight, just find the blog entries on this topic on this blog.  There is also a sample project on SkyDrive below on that showcases reporting in Silverlight.

I’d like to thank again to all involved in Fire Starter event, presenters, attendees and sponsors alike.

--Sergey

Recording of the webinar I presented is now up on Magenic web site.  Here is the address: http://www.magenic.com/Default.aspx?tabid=635

Since I am not sure if the sample project is available, I decided to post the zip file with the sample project on SkyDrive on this blog.  Here is the link to it (or you can just scroll down):http://cid-2383900f69b808e0.skydrive.live.com/browse.aspx/Reporting%20in%20Silverlight%20Webinar

Please let me know if you have any questions. 

--Sergey

I just installed Silverlight 3 last Friday.  One feature that I was hoping to see fixed was localization in Silverlight.  Ideally, I like to bind localized data, such as labels in XAML.  For example:

<UserControl.Resources>

<resources:ModuleResources x:Key="LanguageResource" />

then,

<TextBlock HorizontalAlignment="Center" Margin="7,0,7,0" VerticalAlignment="Center" Text="{Binding Source={StaticResource LanguageResource}, Path=SomePropertyName}"></TextBlock>

This works great, but there is one issue.  Even though I mark the resource as public, any time I add a new value or edit and existing value, ModuleResources .Designer.cs gets re-written, and its constructor is marked as internal, not public.  If I run the app, I get the dreaded unknown type exception.  At that point I have to manually edit designer file and mark constructor as public.  Not a major problem, but I would like not to have to do this.

--Sergey

I just uploaded and published new CodePlex project I have been working on.  It is an Isolated Storage based database for Silverlight.  It supports multiple strongly typed tables, basic Linq based operations, addition and deletion of ranges of items, deletion of items based on condition.  You can also directly bind data to UI in Silverlight because base table inherits from ObservableCollection.  I am planning to put encryption and compression support into it next along with lazy loading of table.  Currently all tables are loaded into memory when database is opened.

Please take a look at http://silverdb.codeplex.com/

I would very much appreciate comments and feature requests related to this project.

Thanks in advance for the feedback.

--Sergey

I am planning to write some posts on new features in Silverlight 3.0.

I decided to start with the easiest one – out of browser support.  Start by creating new Silverlight application in Visual Studio.  Once it is created, go to properties of the Silverlight application project.  You will see this window:

Check “Enable running application out of browser”, then click on Out-of-Browser Settings button.  You will see this screen.

Once you fill in all the settings, you are ready to go.  All settings from this screen are stored in XML file called OutOfBrowserSettings.xml.  The actual fact that a particular application is enabled for out-of-browser support is stored in .csproj file.

Once you run the application, if you right-click on the application, you will see context menu with additional option – install on desktop.  If application is already installed, the option changes to remove application.

The installed application can be now run from the computer from the shortcut.  When you run the app from the shortcut, it is not going run in the browser, instead it is run in sllauncher.exe, a special program designed to host Silverlight application.  At that point, you do not have access to browser based functionality.  So, before you reach to HtmlPage.Window, check to see if application is running in browser.  You can do this by checking App.Current.IsRunningOutOfBrowser property.

--Sergey

I am presenting a webinar on July 28th on reporting in Silverlight.  This webinar is hosted by my employer, Magenic Technologies.  If you would like to register and watch this event, please follow this link: http://guest.cvent.com/EVENTS/Info/Invitation.aspx?e=6ca01a01-e2bd-4a77-a057-a63ab2208e81

There should be some tome allocated for questions and answers as well.

Thank you.

--Sergey

I am very tired, but Silverlight application our team has been working on for 6+ months is now officially live!  We saw that someone used it over the weekend!

More reflections on the project are to come in the next few weeks.

--Sergey

Here are the steps in achieving this task.

1. Setup WCF service. 

To do this you have to alter web.config file for the web site that hosts the service.  You have to add security setting to basisHTTP binding that is used by Silverlight application to connect to the WCF service.  Here is an example of the entire server side system.serviceModel section of web.config file

<system.serviceModel>
        <behaviors>
            <serviceBehaviors>
                <behavior name="WcfPortalBehavior">
                    <serviceMetadata httpGetEnabled="true"/>
                    <serviceDebug includeExceptionDetailInFaults="true"/>
                    <compression/>
                </behavior>
            </serviceBehaviors>
        </behaviors>
        <bindings>
            <basicHttpBinding>
                <binding name="basicHttpBinding_IWcfPortal_HTTPS"
                        maxReceivedMessageSize="2147483647"
                        receiveTimeout="00:30:00"
                        sendTimeout="00:30:00"
                        openTimeout="00:10:00"
                        closeTimeout="00:5:00">
                    <readerQuotas
                        maxBytesPerRead="2147483647"
                        maxArrayLength="2147483647"
                        maxStringContentLength="2147483647"
                        maxDepth="1024"/>
            <security mode="Transport">
                <transport clientCredentialType="None"/>
            </security>

                </binding>
            </basicHttpBinding>
        </bindings>
        <services>
            <service name="RootNamespace.Library.Wcf.Host"
                     >

                <endpoint binding="basicHttpBinding"
                          contract="RootNamespace.Library.Wcf.Silverlight.IWcfPortal"
                          bindingConfiguration="basicHttpBinding_IWcfPortal_HTTPS">

                </endpoint>
            </service>

        </services>

    </system.serviceModel>

2.  Configure Silverlight application to use HHTPS.

To do this you have to alter ServiceReference.ClientConfig and add security setting.  Here is an example of the entire file

<configuration>
    <system.serviceModel>
        <bindings>
            <basicHttpBinding>
                <binding    name="basicHttpBinding_IWcfPortal"
                            maxBufferSize="2147483647"
                            maxReceivedMessageSize="2147483647"
                            receiveTimeout="00:10:00"
                            sendTimeout="00:10:00"
                            openTimeout="00:2:00"
                            closeTimeout="00:2:00">
                     <security mode="Transport" />

                </binding>
            </basicHttpBinding>
        </bindings>
        <client>
            <endpoint    address="https://www.examplesite.com/WcfSilverlightPortal.svc"
                        binding="basicHttpBinding"
                        bindingConfiguration="basicHttpBinding_IWcfPortal"
                        contract="RootNamespace.Library.Wcf.Silverlight.IWcfPortal"
                        name="BasicHttpBinding_IWcfPortal" />
        </client>
    </system.serviceModel>
</configuration>

3.  Setup client access policy for the web site. 

This is done by editing file at the root of your domain.  For example, if you are hosting everything in a virtual directory called Portal, your clientaccesspolicy.xml still needs to reside at the root of the domain, not in that virtual directory.  You can locate the physical path to that in properties of the root web site in IIS.  Here is an example of the entire file that enables HTTP access

<?xml version="1.0" encoding="utf-8"?>
<access-policy>
    <cross-domain-access>
        <policy>
            <allow-from http-request-headers="*">
                <domain uri="http://*"/>
                <domain uri="https://*"/>
            </allow-from>
            <grant-to>
                <resource path="/" include-subpaths="true"/>
            </grant-to>
        </policy>
    </cross-domain-access>
</access-policy>

You can further restrict access by updating resource node or allow-from node.

You can verify the correctness of clientaccesspolicy.xml location in SilverlightSpy.  Go to Tools->Cross-domain access policy valuator an enter your domain there, for example http://www.examplesite.com

You can also hit your service directly.  If you follow the example in step 2, you can type in the following into your browser:https://www.examplesite.com/WcfSilverlightPortal.svc

--Sergey

I encountered an interesting problems today.  I was trying to setup a Silverlight application to run over https.  I was able to successfully run it over HTTP prior to this task.  However, when I switched URL to https://www.mysite.com, I got the error 2104 “Could not download the Silverlight application”.  The solution that I had to experiment with to discover (Google was not help) was setting expiration time to 1 minute.  It worked perfectly fine with expire immediately setting for http protocol, but not https.

--Sergey

During my Introduction to Silverlight presentation at the Atlanta .NET users group, someone suggested that I show how make a button with rounded corners in Silverlight.  I was a bit short on time, and it was getting late, so I decided to write a blog post on the subject matter instead.  So, here it goes.

Goal – make Silverlight button that has rounded corners using Blend

Step by step how to:

1. Create new Silverlight application
2. Save it
3. Now you should have Page.xaml open in Visual Studio
4. Open the same application in Blend
5. Open Page.xaml
6. Add a button to it.  If Button control is not visible, click on Assets(>>) button, select button
7. Now double-click on button in toolbar to add it to Page.xaml
8. Right-click on the button, select Edit Control Parts (Template), then Edit a Copy.  This way we will retain preloaded template, but will only change small parts of it
9. Type is key for newly create style, such as RoundedButtonStyle
10. Select application for Define In option.  This way you can use this style for any button in application
11. Now, you should have app.xaml open with button control visible
12. Expand everything in Template tree in Objects and Timeline window
13. Click on element called Background, set CornerRadius in Properties window to 10,10,10,10
14. Click on element called BackgroundAnimation, set CornerRadius in Properties window to 10,10,10,10
15. Click on element called BackgroundGradient , set RadiusX and RadiusY in Properties window to 10
16. Click on element called DisabledVisualElement, set RadiusX and RadiusY in Properties window to 10
17. Click on element called FocusVisualElement, set RadiusX and RadiusY in Properties window to 10
18. Save all
19. Flip back to Visual Studio and run the application
20. You can now see your rounded button in action

Your XAML for the button should look something like this:

<Button Content="Button" Margin="5,10,5,0" Style="{StaticResource RoundedButtonStyle}"/>

If you have template set instead, just change the XAML to use the style

All done and easy as pie!

In this little excersize we did not change the look drastically.  To do that instead of choosing edit a copy in step 8, choose Create Empty.  Now you will need to add visual elements yourself.  For a quick and dirty rounded button from scratch, add a rectangle and set Radius X and Y to the values of your liking.  This of course will not give you mouse over effects, disabled and focus effect etc…  You will still need to code those using visual states.  You can see those in Interaction window if you click on a button.  If you do not see the states, you may need to click on little drop down on top of the screen and choose Edit Control Parts –> Edit Template

Please feel free to ask questions if you cannot find a particular option.

--Sergey

I just posted the sample project I used for “Intro to Silverlight” presentation at the Atlanta .NET Users group meeting yesterday on SkyDrive.  Please follow this link to get the sample project:

http://cid-2383900f69b808e0.skydrive.live.com/browse.aspx/.res/2383900F69B808E0!280

I would like to thank everyone who attended the meeting.

--Sergey

I downloaded the CTP of RIA Services for Silverlight along with accompanying documentation this morning.  I have read the documentation and wanted to share a few thoughts on this product.

The product looks very promising to me.  Here is an overview of the key features.  You can configure RIA Services to use ether Linq to SQL or Entity framework as data access layer, which gives you flexibility along with possibility to use services over non-SQL Server databases.  You can quickly generate service class directly off your EF or LTS data model.  This means direct support for RAD application development.  There is no difference in accessing the service from Silverlight client in comparison to plain WCF service.  The RIA Services also support validation via custom attributes.  It has built-in attributes such as required field or minimum / maximum string length attribute.  These attributes are setup on  metadata class that corresponds to the entity class it is designed to validate and enhance.  In addition to pre-built attributes you can create custom validation via custom validation attribute.  You can also share classes between client and server side via shared class (decorated with Shared attribute).  You can also define custom queries on your data context.  You can use the following Linq clauses for querying: where, orderby and skip or take.  You also have support to delete, insert and update operations.  All CRUD operations are supported either via attributes or naming conventions for access methods.  There is also built-in change tracking and ability to revert changes via interfaces: IEditableObject, IChangeTracking, IRevertibleChangeTracking,  IEditableCollection.  There is also support for authorization via custom attributes as well.

One interesting thing to notice is that the code for client side is entirely generated by RIA Services framework.  So, on the client side you do not see any code – it is in hidden classes under the project.  Very nifty trick.

One last note – RIA Services framework seem to implement a lot of the features that CSLA for Silverlight has.  Almost feels like the authors of RIA Services were quite familiar with CSLA for Silverlight :-)

--Sergey

I read a few notes from Mix 09 about Silverlight 3.0.  It has a lot of great new features.  Read for yourself if you would like.  Here is a link to a free short eBook that covers parts of new functionality.

http://download.microsoft.com/download/3/0/5/3055A230-B06F-4A58-AC93-B7CFD2184A70/FirstLookSL3Moroney.pdf

--Sergey

Localizing a Silverlight application is a pretty trivial task if you use resources.  Once you create a resource file you are working with, you can use the code-behind class in XAML and bind to properties from that class that contain localized strings.  First, import the namespace that is used for resx file, typically Application\Resources

xmlns:Localized="clr-namespace:MyApplication.Resources"

Then add an instance of a specific resx code-behind class to resources in your user control

<UserControl.Resources>
    <Localized:SpecificFile x:Name="LocalizedStrings"/>

In this case SpecificFile corresponds to SpecificFile.resx.  Now that this is done, you can bind labels to it

<TextBlock Text="{Binding Path=MyPropertyFromResourceFile}/>

There is one issue though, if you edit resource file again in resources editor, and save it, the constructor scope in code behind is set to internal.  This in turn will cause an exception (AG_E_PARSER_UNKNOWN_TYPE  ) when you try to load this user control.  All you have to do to fix it is edit code behind file for you resource file and change its constructor to public.  Unfortunately, you have to do it every time you edit the file in resources editor.

--Sergey

Blend has a small issue when it comes to editing of column templates for DataGrid.  If you define the template in-line as part of column definition, there is no way to edit that in Blend.  There is an easy workaround however.  You need to define DataTemplate as part of user control’s resources.  Once you open the user control in Blend, you can flip to resources tab and click on that template in order to edit it. 

--Sergey.

Here are a few steps that need to be taken in the process

• Update XAP file for Silverlight application in order to set deployment time IP address/name
• Make sure to install .NET framework version 3.5 SP1 on the application server that hosts WCF service
• Check and create if missing MIME types for virtual directory that hosts Silverlight web application:
  • Extension: .xap MIME type:application/octet-stream
  • Extension: .xaml MIME type: application/xaml+xml
• Set execute permissions on virtual directory to scripts only
• Set content expiration to desired setting – I set mine to expire immediately
• Update SQL server (or other database) connection string WCF host web.config file.  If you are using IP protocol, then here is an example: Data Source=127.0.0.1\SQL2008;Initial Catalog=MyDBName;User ID=myUser;Network Library=dbmssocn

--Sergey.

I had recently investigated the use of WrapPanel for Silverlight.  You can download it along with other controls as part of Silverlight Toolkit.  Example on the web site does not demonstrate the binding to it, so here is how you would do it.

You cannot bind to WrapPanel directly because it does not have property to bind a list of items to.  So, you have to use it as part or a control that inherits from ItemsControl.  In the following example we are setting up ItemsPanel for ItemsControl to be WrapPanel.  Then we also define a template for each individual items contained within the list.  I am binding to SelectedItems property of a an object that ItemsControl’s DataContext property is pointing to.  This property contains a list of items as List<T>.  Each item has properties MyImage1, MyImage2, MyImage3, Name.  So each item within the wrap panel has a title (Name) and three pictures.  Here is the XAML for it:

<ItemsControl ItemsSource="{Binding SelectedItems}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <toolkit:WrapPanel>
                        </toolkit:WrapPanel>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Grid Margin="5,5,5,5" >
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <PersonalysisSilverlightApplication:SLBackBoxUserControl />
                            <TextBlock FontSize="12" Foreground="#FFFFFFFF" Text="{Binding Path=Name}" TextWrapping="NoWrap" FontFamily="Arial" VerticalAlignment="Top" Grid.Row="0" Margin="5,5,5,0" HorizontalAlignment="Left" />

                            <Image Source="{Binding Path=MyImage1, Converter={StaticResource ConvertImage}}" Grid.Row="1" Margin="5,0,5,2" VerticalAlignment="Top" HorizontalAlignment="Left" />

                            <Image Source="{Binding Path=MyImage2, Converter={StaticResource ConvertImage}}" Grid.Row="2" Margin="5,0,5,2" VerticalAlignment="Top" HorizontalAlignment="Left" /> 
                            <Image Source="{Binding Path=MyImage3, Converter={StaticResource ConvertImage}}" Grid.Row="3" Margin="5,0,5,2" VerticalAlignment="Top" HorizontalAlignment="Left" />

                        </Grid>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>

You can show images in Silverlight using Image control.  You can furthermore bind Source property of the image to byte[] type property of a business object.  You would think this is sufficient, but it is not.  You will need a converter to convert byte array into image source.

Here is the class for converter

public class ImageSourceConverter : IValueConverter
{

    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        BitmapImage bitmap = new BitmapImage();
        bitmap.SetSource(new MemoryStream((Byte[])value));
        return bitmap;
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Here is how this class is used in a control:

<UserControl.Resources>
       <helpers:ImageConverter x:Key="ConvertImage"/>
   </UserControl.Resources>

<Image Source="{Binding Path=MyByteArrayPropertyName, Converter={StaticResource ConvertImage}}" />

--Sergey

If you are working on a resizable user control in Silverlight, you usually do not specify height and width of any elements in order to ensure that all controls resize properly when application size changes.  For example if you use Grid as your layout base, you can specify relative sizes for columns and rows in format of Width=”1*” or Height=”1*”.  Runtime will interpret  the numbers next to * and will use them as ratios.  As a result, you cannot see this control in Blend because the default size is zero.  So, how do you deal with this?  You have to specify design size (width and height).

Here is area from header of such control:

<UserControl x:Class="MyNamespace.MyControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"

    d:DesignWidth="581" d:DesignHeight="355">

Once this is done, you can easily estimate final layout in Blend.

--Sergey