Welcome to besug the belgian silverlight user group
This presentation is the property of its rightful owner.
Sponsored Links
1 / 37

Welcome to BESUG The Belgian Silverlight User Group PowerPoint PPT Presentation


  • 49 Views
  • Uploaded on
  • Presentation posted in: General

Welcome to BESUG The Belgian Silverlight User Group. Gill Cleeren Microsoft Regional Director Benelux MVP ASP.NET Software architect Ordina Blog: www.snowball.be Mail: [email protected] Welcome to BESUG!. Silverlight… What is it? XAML With a Visual Studio/Blend demo

Download Presentation

Welcome to BESUG The Belgian Silverlight User Group

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Welcome to besug the belgian silverlight user group

Welcome to BESUGThe Belgian Silverlight User Group

Gill CleerenMicrosoft Regional Director BeneluxMVP ASP.NETSoftware architect Ordina

Blog: www.snowball.be

Mail: [email protected]


Welcome to besug

Welcome to BESUG!

  • Silverlight… What is it?

  • XAML

    • With a Visual Studio/Blend demo

  • Silverlight 2 features

    • Controls demo

  • Showcasing

  • Q&A


Silverlight what is it

Silverlight… What is it?


Welcome to besug the belgian silverlight user group

Microsoft Silverlight is a cross-browser, cross-platform implementation of .NET for building and delivering the next generation of media experiences & rich interactive applications for the Web.


3 ps of silverlight

3 Ps of Silverlight

Productivity

Performance

Portability


Silverlight gives you productivty

Silverlight givesyouproductivty


Silverlight gives you performance

Silverlight givesyou performance


Silverlight gives you portability

Silverlight givesyouportability


Why can t we be friends

Whycan’t we befriends?

Designer

Developer


Again why can t we be friends

Again… Whycan’t we befriends?

Request

Designer

Developer

Logic

User interface

Data sources

User interface

Logic

Response


Let s be friends

Let’sbefriends…

XAML

XAML

Designer

Developer


A word on the developer experience

A word on the developerexperience

  • Full CLR

  • Trimmed-downversion of .NET classlibrary

  • Full support from Visual Studio 2008 usingtemplates


A word on the designer experience

A word on the designer experience

  • ExpressionBlend is the tool for designers (sometimesdevelopers as well!)

  • Gradients, blurs, animations… all the stuff designers like!

  • Automaticallycreates XAML

  • Project schema is samefrom Visual Studio


Some other important talking points

Someother important talkingpoints

  • Remember: it’s a client-sidetechnology

    • Requires plug-in to beinstalled (Lessthan 5MB)

  • Buildfor web and desktop (WPF)

  • Richcontrol set, best forLOBs

    • Seefurther

  • Supports HD playback


Silverlight roadmap

Silverlight Roadmap

  • Silverlight V1 Shipped Q307

  • Silverlight V2 Shipped a few weeks back

  • Silverlight control toolkit shipped last week

    • More being added constantly

    • Goal is at least 50 controls

  • Silverlight for mobile is coming

    • Same code running on mobile devices


Welcome to besug the belgian silverlight user group

XAML

  • XAML = eXtensible Application Markup Language, pronounced as “Zammel”


Fastest ever xaml course

Fastest-ever XAML course

<Grid>

<TextBlockFontSize="32" Text="Hello world" />

</Grid>

  • =

TextBlock t = new TextBlock();

t.FontSize = 32;

t.Text = "Hello world";


Fastest ever xaml course1

Fastest-ever XAML course

<Rectangle Canvas.Top=”25” Canvas.Left=”25” Width=”200” Height=”150”>

<Rectangle.Fill>

<SolidColorBrush Color=”Black” />

</Rectangle.Fill>

</Rectangle>

<Rectangle Width=”200” Height=”150” >

<Rectangle.Fill>

<LinearGradientBrush StartPoint=”0,0” EndPoint=”1,1”> <LinearGradientBrush.GradientStops>

<GradientStop Color=”Red” Offset=”0” />

<GradientStop Color=”Black” Offset=”1” /> </LinearGradientBrush.GradientStops>

</LinearGradientBrush>

</Rectangle.Fill>

</Rectangle>


Attached property syntax

Attached Property Syntax

<Canvas>

<RectangleCanvas.Top="25"/>

</Canvas>

  • Top property only make sense inside a Canvas

  • When we add new container panels, do we have to add new properties to Rectangle?

  • Solution: Use attached properties to add flexible, container specific customization


Code behind

Code-behind

  • Name your controls so you can use it in code

    • Visual Studio automatically declares field for all x:name elements

<Button x:Name=“MyButton”/>

public void Page_Loaded(sender, MouseEventArgs e)

{

MyButton.Content = “Push Me!”;

}


More code behind

More code-behind

  • Event handlers can be wired up declaratively in XAML:

  • Or explictly within the code-behind file

    • VB – using the "Handles" keyword

    • C# -- programmatically within the Page_Loaded event handler

<Button x:Name=“MyButton” Content=“Push Me” Click=“MyButton_Click“/>

public void MyButton_Click(object sender, RoutedEventArgs e) {

// todo: add code

}


A final note

A finalnote…

UseXAML wherepossible!Otherwise, you’llget a team

of sad designers

and developers…


Blending it all together a demo

Blending it all together: A demo!

Using Visual Studio 2008 and Blend 2


Silverlight 2 runtime features

Silverlight 2 Runtime Features

  • 2D, Graphics

  • Audio, Video

  • Animations

  • Text, Text Input

  • Controls

  • Layout

  • Styles/Templates

  • Data Binding

  • Networking

    • HTTP/S and Sockets

  • .NET Support

    • C# and VB.NET

  • LINQ

  • XML APIs

  • Generics

  • HTML Integration

  • Local storage

  • Crypto APIs (AES)

  • Threading


Controls and the controls toolkit

Controls and the controls toolkit

  • A control: Re-usable UI elements that encapsulate UI and behavior and enable re-use and composition

    • Vitalfor building business applications

    • Notavailable in Silverlight 1.0!

  • Controls toolkit: Out-of-band release (open-source) of extra controls via www.codeplex.com/silverlight


Some built in controls in silverlight 2

Some Built-in Controls in Silverlight 2

  • Core Controls:

    • Border

    • Image

    • MediaElement

    • MultiScaleImage

    • ToolTip

    • ScrollViewer

    • Dropdown list

  • Navigation Controls:

    • HyperlinkButton

    • Popup

  • Form Controls:

    • TextBox

    • Button

    • Toggle/Repeat Button

    • CheckBox

    • RadioButton

    • ListBox

  • Layout Controls:

    • StackPanel

    • Grid / GridSplitter

    • Canvas

  • Large Controls:

    • Calendar

    • DataGrid

    • Slider

    • DateTimePicker

  • Shapes:

    • Ellipse

    • Rectangle

    • Line

    • TextBlock

    • Path


Sample control usage

Sample control usage

<Button x:Name=“MyButton” Content=“Push Me” Width=“150” Height=“50” />

Button b = new Button();

b.Width = 150;

b.Height = 50;

b.Content = “Push Me";


Controls toolkit

Controls toolkit

  • Collection of Silverlight controls, components and utilities made available outside the normal Silverlight release cycle

  • Community driven: source is available, you can submit bugs and feature requests

  • First release contains:

    • Source

    • Unit tests

    • Samples

    • Documentation

    • 12 new controls for charting, styling…

    • Theming


Controls toolkit example

Controls toolkit example

  • AutoCompleteBox

  • NumericUpDown

  • Viewbox

  • Expander

  • ImplicitStyleManager

  • Charting

  • TreeView

  • DockPanel

  • WrapPanel

  • Label

  • HeaderedContentControl

  • HeaderedItemsControl


Theming support

Theming support

Shiny Blue

Shiny Red

RainierPurple

Rainier Orange

ExpressionDark

ExpressionLight


Silverlight 2 controls

Silverlight 2 controls

Standard controls and the control toolkit


Silverlight in action

Silverlight In Action

Showcasing


Summary

Summary

  • Silverlight is a platform for building RichInteractiveapplications

  • Strong tooling support, bothfordevelopers and designers withworkflowbetween the 2

  • Extendedcontrol toolset thatwill keep ongrowing


Resources

Resources

  • General

    • www.silverlight.net

    • weblogs.asp.net/scottgu

    • blogs.msdn.com/tims

    • silverlight.net/blogs/jesseliberty

  • Personal

    • www.snowball.be

    • [email protected]


Welcome to besug the belgian silverlight user group

Q&A

Gill CleerenMicrosoft Regional Director BeneluxMVP ASP.NETSoftware architect Ordina

www.snowball.be

[email protected]


Thank you the belgian silverlight user group

Thank youThe Belgian Silverlight User Group

Gill CleerenMicrosoft Regional Director BeneluxMVP ASP.NETSoftware architect Ordina

www.snowball.be

[email protected]


If you are interested

Ifyou are interested…

  • Want to help us?

  • Want to join?

    Register @ www.besug.be

    orsend mail to [email protected]


  • Login