LP Pinsonneault blog's

Windows 8, Windows Phone, ...

NAVIGATION - SEARCH

Montreal .NET Community : Developing Silverlight/WPF for Blendability: Smooth Developer/Designer Workflow

This thursday Barry Garvin will present an interesting session at the Montreal .NET Community.

Here is his presentation description:

Microsoft has continued to make investments in both Expression Blend and Visual Studio to facilitate the workflow between the designer and developer roles. This is even more important if you as an individual fulfill both of these roles. However, having version control support in Blend and a design surface in Visual Studio 2010 isn't enough to ensure this back and forth workflow is smooth. In this session we'll examine techniques and patterns to ensure that your projects remain "Blendable" and "Testable" from start to finish. We'll review patterns such as model-view-view-model and attached behaviours to provide not only clean separation of concerns and testability, but also that elusive "Blendability" allowing you to take advantage of Blend's power throughout your project.

For more information : http://www.dotnetmontreal.com/.../Default.aspx?selecteddate=05/10/2010

See you there.

Regards,
LP

Windows Phone Developer tools now in Beta

Today is the release of the latest developer tools for Windows Phone 7. And with this release, another step have climb, because the tools are now in Beta. When you look at the release note you will see that there is a lot of braking change. They work a lot in refactoring stuff like merging multiple DLL in a single assembly. The application bar now required a value on the new “Text” property.

It seems that we will now be able to use Expression Blend 4 RTM. In fact, with the tools now provide a new version of Expression Blend 4 that will run side by side with the RTM version. This version is specific to the Phone, so you will not allowed to create other project.

So i suggest that you read the following post about those changes:
http://blogs.msdn.com/b/jaimer/.../migrating-apps-from-windows-phone-ctps-to-the-beta-build.aspx

You can download the latest version of the Developer tools here: http://www.microsoft.com/.../details.aspx?FamilyID=c8496c2a-54d9-4b11-9491-a1bfaf32f2e3

Official blog post from the team:
http://windowsteamblog.com/windows_phone/.../windows-phone-developer-tools-beta-released.aspx

And a great blog post from the Expression Blend team on the new feature:
http://blogs.msdn.com/b/expression/.../windows-phone-developer-tools-beta-released.aspx

Regards,
LP

Expression Studio 4 now available

Microsoft just launch the latest version of Expression Studio (Blend, Web, Desing, Encoder). If you have an MSDN Subscription, you can now download the latest release.

Important Note
If you are developing with Windows Phone, Tim Heuer indicate that we must still use Expression Blend 4 Beta until they finalize the development tools for Windows Phone.

Expression Blend 4 New Features include:

  • VS2010 compatibility
  • Windows Phone support
  • Deeper Adobe Photoshop import (layer effects)
  • New behaviors & conditional behaviors
  • Enhanced sample data support
  • Listbox path layout for designing with data
  • Pixel Shader effects (including animations)
  • Easier styling and customization
  • Model View View-Model support
  • Mockup controls for SketchFlow

Expression Web 4 New Features include

  • SEO Reporting from inside of the application
  • New extensibility model enables creating add-ins with HTML, JS, and CSS
  • New SuperPreview online service beta for browser compatibility testing now supports Macintosh Safari

Expression Encoder 4 Pro New features include

  • Live Smooth Streaming (VC-1 & H.264)
  • New H.264 encoder from MainConcept
  • Enhanced Screen Capture
  • DRM (PlayReady) for Live Content

For further, information read the blog post of Tim Heuer or go on the Expression Website:

Regards,
LP

Expression Blend for Developers at TechDays 2009 Montreal – Part 2 – Creating Glass Effect

For the second part i will show you how to create some glass effect. Just as a reminder i’m not a graphic artist, i’m .NET Developer. As you can see Expression Blend allow any developer to improve the design without the help of a graphic artist or images (keep in mind Silverlight and WPF are vector graphic base).

Starting with the background I've created in the previous post we will add some stuff to have parts of the application looking like glass.

Now we will add an header that will look more fancy and glassy. First we will add a rectangle.

image

Again we will use the gradient properties to add the required effect. So we will change the background to use the gradient.

image

Now we will change the start anchor and set the Alpha to 20. After we will add a new anchor in the middle and set the Alpha to 50. We will add another anchor to the right of the last one just added, and we will set the Alpha to 15. Finally we will set the Alpha of the last anchor to 0.

image

To polish this title bar we can add a drop shadow. To do so, in the Properties under Appearance, there is a property called Effect. We now click on the New button. In Expression Blend there is some predefined effect available. You can now select DropShadowEffect.

 

 

 

image

image

Now we have an header that look a lot better. As you can see if we resize the window, the the opacity effect is visible in the header.

 

image

Now you can add some text in the header. You can also apply the DropShadowEffect on the text to make it more readable. And again you can play with the Gradient. Here is an example:

image

Now we will add glass effect over an image. So add an image in your application. Over this image we will add a new rectangle. This will be the object that will create the glass effect.

image image

Now we will set the gradient to a really soft blue #CEDDEC. Now we will need 4 anchor in our gradient slider. And the only thing that will change is the Alpha on each anchor.
(From left to right)
- 1rst : Alpha = 80
- 2nd : Alpha = 25
- 3rd : Alpha = 50
- 4th : Alpha = 30

Also I've changed the gradient arrow to make the illusion of the direction of the light.
 image

 

The final result:

image

 

Next part: Working with Template and data binding to a sample data source.

Regards,
Louis-Philippe