Reached “Design – All Star” in design .toolbox

"All Star - Design" @ .toolbox

.toolbox is a really fun environment to learn basic design concepts as well as the fundamentals of creating Silverlight applications using Expression Studio. Today, I finished both the tracks (i.e. principles and scenarios) and achieved all 15 badges. The high quality tutorials and evaluations, and a very nice theme make it really enjoyable. Check it out at http://www.microsoft.com/design/toolbox/

Fundamentals of Designing

Microsoft has developed an amazing e-learning website called .toolbox for creating Silverlight applications using Expression Studio. The site focuses on design aspects rather than development. Being a developer, I am always intrigued by design tools like Flash, Blend and Photoshop and want to improve my design skills.  So I have started going through the tutorials on .toolbox, they are very high quality and fun to follow.

I finished the introductory lecture on design fundamentals by Robby Ingebretsen. Following are my notes in a mind map format.

Design Principles

Here is the mind map file for above image which can be opened in FreeMind. After downloading the file, you will have to change the extension to .mm for viewing it in FreeMind.

Microsoft Visual Studio LightSwitch

Visual Studio LightSwitch is a new tool from Microsoft for developing business applications. Currently available development technologies from Microsoft (like VS C#) are general purpose and can be used to develop a wide variety of applications. LightSwitch, on the other hand, is focused on simplifying development of business applications by handling the basic plumbing itself.

I downloaded the currently available Beta1 version of LightSwitch and started playing with it. It took about 5 minutes to get following application ready.


Employee Information Sample App

The above sample application supports addition, updation and deletion of employee records along with employee qualifications and skills. It is an impressive output considering the effort that was put in.

I performed the following steps to develop the sample app.

  1. Click on ‘create table’ in App Designer, name the table as Employee and define its attributes.
  2. Do the same as step 1, for Qualification and Skill.
  3. Create the relationship two relationships using designer i.e. employee-qualification and employee-skills.
  4. Click on  ‘new screen’ in App Designer and specify the table and desired layout.
  5. Hurrah! Application is ready.

 

LightSwitch Application Designer:

Following is the LightSwitch application designer for tables. Additional settings are available for each attribute from the properties window.

LightSwitch Table Designer
LightSwitch Table Designer

 

Below is the screen shot of application designer for screens. I didn’t make any changes here except changing the display names for qualification and skill tabs.

LightSwitch Screen Designer

 

LightSwitch also has a query designer. Queries can also be used as a basis of screen design apart from tables. Following screen shot shows the query designer.

LightSwitch Query Designer

 

Key Features:

  • We can extend the functionality of LightSwitch application by writing code in C#.Net or VB.Net. LightSwitch allows the developers to easily hook their business logic in application events. We can even write a custom control or fully custom screen.
     
    I believe this is the single most important feature of LightSwitch, this is where most of the LightSwitch precursors struggled.
Screen Shot shows partial list of methods which can be implemented for a table. Screen designer has a similar 'Write Code' functionality with method like loaded, closed etc.

 

  • Another important feature is the ability of LightSwitch to connect to various data sources, its not tied up to a particular back-end technology. It support Sql Server, Azure (Cloud), SharePoint, Entity Framework as data sources.
  • The application generated by LightSwitch is a Silverlight application. It runs in out-of-browser mode if application type is desktop. So multiple platforms are supported.
  • Support Master details screen (e.g. invoice and invoice lines)
  • Support searching, sorting and paging of records without writing any code.
  • Support user authentication and role based security using ASP.Net Membership Provider.
  • Handle image as one of the basic attributes of an object.

 

LightSwitch Links:

Save and Load RichTextBox content in WPF

The content of RichTextBox can be saved to a file (or any other stream) using TextRange class. It supports following four formats:

  1. System.Windows.DataFormats.Text : This saves the plain text in the content of RichTextBox excluding the formatting information and the images.
  2. System.Windows.DataFormats.Rtf : This saves the content in RTF format preserving formating information and images.
  3. System.Windows.DataFormats.Xaml : This saves the content in Xaml format which is the same format used in WPF designer for specifying content for a RichTextBox. It contains formating tags but doesn’t support image.
  4. System.Windows.DataFormats.XamlPackage : This is a binary file format which packages Xaml and any images into one file.

Following table is presenting key information about above formats:

Format Binary/Text Formating Supported Images Supported
Text Text No No
Rtf Binary Yes Yes
Xaml Text Yes No
XamlPackage Binary Yes Yes

The code for saving & loading is pretty simple once who know the relevant class. Following is the code for saving content to file.

TextRange t = new TextRange(richTextBox1.Document.ContentStart,
                                    richTextBox1.Document.ContentEnd);
FileStream file = new FileStream("Sample File.xaml", FileMode.Create);
t.Save(file, System.Windows.DataFormats.XamlPackage);
file.Close();

 

 

Following snippet is for loading the content of RichTextBox from a file.

TextRange t = new TextRange(richTextBox1.Document.ContentStart,
                                richTextBox1.Document.ContentEnd);
FileStream file = new FileStream("Good File.xaml", FileMode.Open);
t.Load(file, System.Windows.DataFormats.XamlPackage);
file.Close();