DevelopingDevelopingSmart Client ApplicationsSmart Client Applications

.Henrik Lykke Nielsen.Henrik Lykke NielsenSoftware arkitekt, CaptatorSoftware arkitekt, CaptatorMicrosoft Regional Director for DenmarkMicrosoft Regional Director for Denmark

lykke@captator.dklykke@captator.dkwww.captator.dk/captator.aspx?blog=dowww.captator.dk/captator.aspx?blog=dothenrikthenrik

Today's AgendaToday's Agenda

Best practices for building well-designed, Best practices for building well-designed, secure, data-driven, smart client secure, data-driven, smart client applicationsapplications

Session 1: Session 1: DesigningDesigning and building smart and building smart clientsclients

Patterns and practices for smart clients, IssueVision

Session 2: Session 2: SecuringSecuring smart client smart client applicationsapplications

Tips for secure data, CAS, encryption, and more

Session 3: The ins and outs of secure Session 3: The ins and outs of secure data data accessaccess

Best practices for smart client data, offline data

Session 4: Session 4: DeployingDeploying and maintaining and maintaining smart clientssmart clients

Tips for deploying and easily updating apps

Session AgendaSession Agenda

Smart clients: a new breed of Smart clients: a new breed of Windows appWindows app

See it in action: IssueVisionSee it in action: IssueVision

Drill-down: Design choices for Drill-down: Design choices for desktop clientsdesktop clients

Smart clients in summarySmart clients in summary

“Smart-clients” er den næste naturlige

udvikling

Teknologi udviklingTeknologi udviklingShift happensShift happens

Mu

ligh

ed

er

og

eg

en

ska

ber

Mu

ligh

ed

er

og

eg

en

ska

ber

TidTid

MainframeMainframe““Dum” terminalDum” terminal

PC CUIPC CUI

PC GUIPC GUILANLAN

Client-serverClient-serverRADRADKomponenteKomponenterr

Web Web Applikations Applikations serverserver

XML web XML web servicesservicesEnterprise Enterprise integrationintegrationNæste Næste generation generation af klienteraf klienter

New Breed of Windows New Breed of Windows AppApp

Enables “occasionally connected” Enables “occasionally connected” workwork

Leverages the best of WindowsLeverages the best of WindowsSuperb usability for simple and complex Superb usability for simple and complex taskstasks

Power and performance of the local PCPower and performance of the local PC

Pixel-precise layout, consistent for every Pixel-precise layout, consistent for every useruser

AndAnd solves common problem of solves common problem of Windows appsWindows apps

Easy deployment and maintenanceEasy deployment and maintenance

Permissions not only based on user Permissions not only based on user identityidentity

Smart Client DefinedSmart Client Defined

1.1. Windows user interfaceWindows user interface2.2. Server-based application dataServer-based application data3.3. Local resourcesLocal resources

Additional Smart Client AttributesAdditional Smart Client AttributesSolve common Windows application Solve common Windows application problems: problems: data, security, and deployment data, security, and deployment

4.4. Disconnected dataDisconnected data5.5. Sophisticated security Sophisticated security 6.6. Easy to deploy and maintainEasy to deploy and maintain

Wait! That’s what we’re doing today!

Yes, but there’s more!

What a Smart Client What a Smart Client Isn’tIsn’t

User interface is not the browserUser interface is not the browser

Not a new application architecture Not a new application architecture N-tier architectures still applyN-tier architectures still apply

Client/server is still an optionClient/server is still an option

Smart Client or Not?Smart Client or Not?Automatic Updates?

Rich Windows Experience?

Seamless Offline Support?

Better Connected?

Smart Client?

Hotmail Yes No No Yes No

Notepad No Debatable Yes No No

Outlook XP No Yes Sort of Yes No

Outlook 2003 No Yes Yes Yes Close...

Microsoft Money

Yes Yes Yes Yes Yes

IssueVision Yes Yes Yes Yes Yes

Eksempel fra CaptatorEksempel fra Captator

Slutkunde med web-browser

IIS

SQL

Shop-administrator

MSDE database

Filer til data integration

ERP system

E-handelsportal

Data, applikation og komponenter

PC

Introducing IssueVisionIntroducing IssueVision

ScenarioScenario: Helpdesk : Helpdesk Issue TrackingIssue Tracking

FeaturesFeatures::Great usabilityGreat usability

Shift seamlessly to Shift seamlessly to working offlineworking offline

Shows best practices Shows best practices UI PatternsUI Patterns

Occasionally connected dataOccasionally connected data

SecuritySecurity

DeploymentDeployment

Access to full source codeAccess to full source code

IssueVision:IssueVision:Smart Client In ActionSmart Client In Action

IssueVision ReviewIssueVision Review

Leverages the best of WindowsLeverages the best of WindowsAttractive desktop client, great usabilityAttractive desktop client, great usability

Move seamlessly between online and Move seamlessly between online and offlineoffline

Secure access to server dataSecure access to server data

Secure access to local resourcesSecure access to local resources

Cost-effective to install and maintainCost-effective to install and maintain

Solves common problems of Windows Solves common problems of Windows appsapps

Automatic updatesAutomatic updates

No DLL HellNo DLL Hell

Drill Down:Drill Down:Design Choices for Design Choices for Desktop ClientsDesktop Clients

Design PatternsDesign PatternsCoordinating multiple views of Coordinating multiple views of the same datathe same data

Coordinating command stateCoordinating command state

Custom ControlsCustom Controls

Windows XP ThemesWindows XP Themes

Design PatternsDesign Patterns

Promote consistency and Promote consistency and maintainabilitymaintainability

Value increases with for app complexityValue increases with for app complexity

Microsoft Patterns and Practices site:Microsoft Patterns and Practices site:http://www.microsoft.com/resources/practicehttp://www.microsoft.com/resources/practices/s/

IssueVision desktop client patternsIssueVision desktop client patternsObserver PatternObserver Pattern

Coordinates multiple views of the same dataCoordinates multiple views of the same data

Command PatternCommand PatternCoordinates menu items and toolbar buttons Coordinates menu items and toolbar buttons that perform the same functionthat perform the same function

Coordinate Views of DataCoordinate Views of Data

Observer patternObserver patternEasier to keep a consistent and Easier to keep a consistent and maintainable view of the datamaintainable view of the data

Half as many connections between actions, Half as many connections between actions, viewsviews

Views are independent and unaware of each Views are independent and unaware of each otherother

Action

Action

Action

Action

Action

Action

Action

Action

Data

View view & Action viewMessages about the data

Data notifies observers via events when the state of the data changes

Implementing an ObserverImplementing an Observer

m_subject = new IssueSubject()m_subject = new IssueSubject()paneLeft.Subject = m_subjectpaneLeft.Subject = m_subject

1.1. Assign the subject to theAssign the subject to theobservers observers (MainForm_Load)(MainForm_Load)

4.4. Observers handle Observers handle subjectsubjectevents to rebind data, events to rebind data, if they careif they careHandles m_subject.DataChangedHandles m_subject.DataChanged‘ ‘ rebindrebind

2.2. Observers bind and saveObservers bind and savechanges to changes to Subject.DataSetSubject.DataSet

3.3. When data changes, When data changes, subjectsubjectraises DataChanged raises DataChanged eventevent

IssueSubject

aa

bbcc dd

Observer PatternObserver Pattern

Coordinate Command Coordinate Command StateState

Related menu and toolbar widgets Related menu and toolbar widgets are not automatically handled are not automatically handled togethertogether

Command PatternCommand PatternCommand objects unify the state and action for Command objects unify the state and action for related UI widgets related UI widgets

Example:Example:““Save” actionSave” action

Menu itemMenu item

Toolbar buttonToolbar button

Context menu Context menu

Implementing a CommandImplementing a Command

action = New Command.Action(AddressOf WorkOffline_Action)action = New Command.Action(AddressOf WorkOffline_Action)offlineCommand = New Command(action)offlineCommand = New Command(action)

1.1. Create a Command for each action in Create a Command for each action in MainForm_Load()MainForm_Load()

MenuItemCommander.Connect(menuWorkOffline, MenuItemCommander.Connect(menuWorkOffline, offlineCommand offlineCommand ))ToolBarButtonCommander.Connect(tlbOffline, ToolBarButtonCommander.Connect(tlbOffline, offlineCommand offlineCommand ))

2.2. Wire menu items and toolbar buttons to the Wire menu items and toolbar buttons to the Command using Commander objectsCommand using Commander objects

3.3. Control button and menu item state through the Control button and menu item state through the CommandCommand

' Disable all UI widgets connected to this command' Disable all UI widgets connected to this commandofflineCommand.IsEnabled = FalseofflineCommand.IsEnabled = False

Command PatternCommand Pattern

Custom ControlsCustom ControlsEncapsulate a set of user interactionsEncapsulate a set of user interactions

Or, present information in a new wayOr, present information in a new way

Try before you buyTry before you buyVisual Basic .NET Resource KitVisual Basic .NET Resource Kit

Lots of other downloads …Lots of other downloads …

Create your own reusable controlCreate your own reusable control

IssueVision’s Custom ControlsIssueVision’s Custom ControlsExpandableListExpandableList

ChartChart

PanePane

IssueList ControlIssueList Control

Tips For Custom ControlsTips For Custom ControlsApplication-specific controlsApplication-specific controls

Reusable controlsReusable controlsBind to a generic data type where possibleBind to a generic data type where possible

Put generic behavior in a base class, and Put generic behavior in a base class, and application-specific behavior in a derived classapplication-specific behavior in a derived class

Leverage VS.NET designer supportLeverage VS.NET designer support.NET framework property types use built-in .NET framework property types use built-in designer supportdesigner supportPublic Property ActiveGradientLowColor() As ColorPublic Property ActiveGradientLowColor() As Color

Add designer attributes to public membersAdd designer attributes to public membersDescription("Low color of the active gradient."), _Description("Low color of the active gradient."), _Category("Appearance"), _Category("Appearance"), _DefaultValue(GetType(Color), "255, 165, 78")> _DefaultValue(GetType(Color), "255, 165, 78")> _Public Property ActiveGradientLowColor() As ColorPublic Property ActiveGradientLowColor() As Color

Windows XP ThemesWindows XP Themes

Give your app a fresh lookGive your app a fresh look

Gives your client UI flat-look input Gives your client UI flat-look input controls and rounded buttonscontrols and rounded buttons

Works on Windows XP onlyWorks on Windows XP only

Application.EnableVisualStyles()Application.EnableVisualStyles()Set FlatStyle property to Set FlatStyle property to FlatStyle.System on controlsFlatStyle.System on controls

Call prior to creating forms or controls Call prior to creating forms or controls In main form’s constructionIn main form’s construction

EnableVisualStyles()EnableVisualStyles()

Best Practices: Desktop Best Practices: Desktop ClientClient

Make your UI fit the dataMake your UI fit the dataFind the best way for users navigate to Find the best way for users navigate to and visualize your dataand visualize your data

Use design patterns to improve Use design patterns to improve consistency and maintainabilityconsistency and maintainability

Use custom controls for great Use custom controls for great usabilityusability

Improves consistency and code reuse Improves consistency and code reuse tootoo

Add a fresh look with Windows XP Add a fresh look with Windows XP themesthemes

Smart Clients in SummarySmart Clients in Summary

Smart clients—a new breed of Windows Smart clients—a new breed of Windows appapp

Awesome usability of Windows, easy Awesome usability of Windows, easy maintenancemaintenance

Extends the Windows client to new Extends the Windows client to new solutions: solutions:

““Occasionally connected” offline dataOccasionally connected” offline data

Deploy from WebDeploy from Web

Auto-updatesAuto-updates

Many more best practices and demos Many more best practices and demos coming up!coming up!

Data Access in Smart ClientsData Access in Smart Clients

Securing Smart ClientsSecuring Smart Clients

Deploying and Maintaining Smart ClientsDeploying and Maintaining Smart Clients

ResourcesResourcesPatterns and PracticesPatterns and Practiceswww.microsoft.com/resources/practiceswww.microsoft.com/resources/practices

Visual Basic .NET Resource KitVisual Basic .NET Resource Kitmsdn.microsoft.com/vbasic/vbrkitmsdn.microsoft.com/vbasic/vbrkit

Windows Forms ProgrammingWindows Forms Programmingwww.windowsforms.netwww.windowsforms.net

Visual Basic .NET Language Visual Basic .NET Language EssentialsEssentialsmsdn.microsoft.com/vbasic/using/understamsdn.microsoft.com/vbasic/using/understandingnding

Shows and webcastsShows and webcastsmsdn.microsoft.com/showsandwebcastsmsdn.microsoft.com/showsandwebcasts

Nyheder, artikler, information, …Nyheder, artikler, information, …www.captator.dkwww.captator.dk

© 2003-2004 Microsoft Corporation. All rights reserved.This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.