Sofia, Bulgaria | 9-10 October Developing An Advanced ASP.NET Server Control With Rich Design-Time...

Sofia, Bulgaria | 9-10 OctoberSofia, Bulgaria | 9-10 October

Developing An Advanced ASP.NET Server Control With

Rich Design-Time

Developing An Advanced ASP.NET Server Control With

Rich Design-Time

Goksin Bakir

Yage Ltd

Microsoft Regional Director, MEA

Goksin Bakir

Yage Ltd

Microsoft Regional Director, MEA

Sofia, Bulgaria | 9-10 October

Developing ASP.NET 2.0 Server ControlsAgendaDeveloping ASP.NET 2.0 Server ControlsAgenda● Rich UI

● Master Pages● Themes and Skins● Smart Clients

● Scenario● Real estate company web site requires rich controls to enable a

variety of custom scenarios● Solution

● PhotoViewer: Allows a user to navigate through a collection of photos for a given listing

● MultiList: Allows a user to view real estate listings in a geographical region

● We will cover● Runtime: Composition, state management, callbacks,

web resources, script handling, and data bound controls● Design-time: Region-editing, task-based editing, painting, host

services

● Rich UI● Master Pages● Themes and Skins● Smart Clients

● Scenario● Real estate company web site requires rich controls to enable a

variety of custom scenarios● Solution

● PhotoViewer: Allows a user to navigate through a collection of photos for a given listing

● MultiList: Allows a user to view real estate listings in a geographical region

● We will cover● Runtime: Composition, state management, callbacks,

web resources, script handling, and data bound controls● Design-time: Region-editing, task-based editing, painting, host

services


Master Page BasicsMaster Page Basics

● Masters define common content and placeholders (<asp:ContentPlaceHolder>)

● Content pages reference masters and fill placeholders with content (<asp:Content>)

● Masters define common content and placeholders (<asp:ContentPlaceHolder>)

● Content pages reference masters and fill placeholders with content (<asp:Content>)

<%@ Master %>

<asp:ContentPlaceHolder ID="Main" RunAt="server" />

<%@ Master %>

<asp:ContentPlaceHolder ID="Main" RunAt="server" />

<%@ Page MasterPage- File="Site.master" %>

<asp:Content ContentPlaceHolderID= "Main" RunAt="server" />

</asp:Content>

<%@ Page MasterPage- File="Site.master" %>

<asp:Content ContentPlaceHolderID= "Main" RunAt="server" />

</asp:Content>

Site.master default.aspx http://.../default.aspx


Themes and SkinsThemes and Skins

● Mechanism for theming controls, pages, and sites by group-initializing control properties

● Skin = Visual attributes for control(s)

● Physically stored in .skin files

● Default skins and named skins

● Theme = Collection of one or more skins

● Physically stored in Themes subfolders

● Global themes and local themes

● Mechanism for theming controls, pages, and sites by group-initializing control properties

● Skin = Visual attributes for control(s)

● Physically stored in .skin files

● Default skins and named skins

● Theme = Collection of one or more skins

● Physically stored in Themes subfolders

● Global themes and local themes


Applying a Theme to a PageApplying a Theme to a Page

<%@ Page Theme="BasicBlue">

Before After


Local ThemesLocal Themes

Themes

BasicBlue

Smoke-AndGlass

SKIN

SKIN

SKIN

SKIN

ASP.NET-ClientFil

es Theme name =Subdirectory name


Global ThemesGlobal Themes

Themes

Shocking-Pink

Autumn-Leaves

SKIN

SKIN

SKIN

SKIN

vroot

Theme name =Subdirectory name


Smart Client FeaturesSmart Client Features

● Offline capable

● Cache online data

● Update when connected

● Datasets in smart documents

● Intelligent deployment and update

● Easy non-administrator deployment

● Automatic updates

● Smart document deployment

● Rich / easy developer experience

● Offline capable

● Cache online data

● Update when connected

● Datasets in smart documents


● Easy non-administrator deployment

● Automatic updates

● Smart document deployment

● Rich / easy developer experience


Smart Client TechnologiesSmart Client Technologies

● Visual Studio 2005

● Rich visual designer support

● Integrated ClickOnce testing and deployment

● Visual Studio Tools for Office

● .NET Framework 2.0

● Windows Forms 2.0

● ClickOnce deployment

● Visual Studio 2005

● Rich visual designer support

● Integrated ClickOnce testing and deployment

● Visual Studio Tools for Office

● .NET Framework 2.0

● Windows Forms 2.0

● ClickOnce deployment


What is “smart”What is “smart”

● Local resources and user experience

● Offline capable


● Multithreaded

● Crash Proof

● Local resources and user experience

● Offline capable


● Multithreaded

● Crash Proof



PhotoviewerRuntime: Callbacks And Web ResourcesPhotoviewerRuntime: Callbacks And Web Resources

● Scenario● Child control will handle rendering● Manage state in parent control● Eliminate page flicker, update only relevant markup● Deploy control as single assembly

● Solution● StateManagedCollection simplifies state management for collection

items● Callbacks transfer data between client and server using XMLHTTP

and JavaScript

● Embedded WebResources used to ease deployment and versioning

● Scenario● Child control will handle rendering● Manage state in parent control● Eliminate page flicker, update only relevant markup● Deploy control as single assembly

● Solution● StateManagedCollection simplifies state management for collection

items● Callbacks transfer data between client and server using XMLHTTP

and JavaScript

● Embedded WebResources used to ease deployment and versioning

RaiseCallbackEventRaiseCallbackEvent

GetCallbackResultGetCallbackResult Web ServerWeb ServerClientClient


Photoviewer RuntimePhotoviewer Runtime


Photoviewer Controldesigner: Regions And Smart TagsPhotoviewer Controldesigner: Regions And Smart Tags

● Scenario● Enhanced design-time interactivity

● Promote important editing operations

● Solution● CompositeControlDesigner handles interaction with

runtime control

● Web resources are handled by the designer host

● DesignerRegions describe clickable, selectable,and editable areas

● Mouse click responds to user input

● Smart Tags expose important and complex tasks

● Scenario● Enhanced design-time interactivity

● Promote important editing operations

● Solution● CompositeControlDesigner handles interaction with

runtime control

● Web resources are handled by the designer host

● DesignerRegions describe clickable, selectable,and editable areas

● Mouse click responds to user input

● Smart Tags expose important and complex tasks


Photoviewer Design-TimePhotoviewer Design-Time


MultiListRuntimeMultiListRuntime

● Scenario● Data and templates define composition

● Control must function when ViewState is disabled

● Solution● Extend CompositeDataBoundControl to handle

creation of child controls based on data

● Use templates to allow user to customize rendering

● Store critical state in ControlState rather than ViewState

● Scenario● Data and templates define composition

● Control must function when ViewState is disabled

● Solution● Extend CompositeDataBoundControl to handle

creation of child controls based on data

● Use templates to allow user to customize rendering

● Store critical state in ControlState rather than ViewState


MultiList RuntimeMultiList Runtime


MultiListDesign-timeMultiListDesign-time

● Scenario

● WYSIWYG template editing

● Use standard interfaces for wiring up to a data source

● Solution

● Extend DataBoundControlDesigner to offer data source picker and expose schema

● DesignerRegions provide custom inline editing of template content

● Paint graphics to go beyond HTML

● Scenario

● WYSIWYG template editing

● Use standard interfaces for wiring up to a data source

● Solution

● Extend DataBoundControlDesigner to offer data source picker and expose schema

● DesignerRegions provide custom inline editing of template content

● Paint graphics to go beyond HTML


MultiList Design-TimeMultiList Design-Time


SummarySummary

● Runtime● Composite controls and templates for scenario controls

● DataBoundControl class for data-driven content

● WebResources for embedded content

● ControlState for critical state

● Design-time● DesignerActionLists for contextual tasks

● DesignerRegions for contextual editing

● Clicking and painting for interactive page design

● Auto format for common control styles










Call To ActionCall To Action● ASP.net 2.0 adds many new features for

the control developer● ASP.net 2.0 adds many new features for

the control developer

ControlControl

WebControlWebControl

CompositeControlCompositeControlDataBoundControlDataBoundControl

CompositeDataBoundControlCompositeDataBoundControl

MultiListMultiList MultiListViewSwitcherMultiListViewSwitcher PhotoViewerPhotoViewerYour Control Here!

Your Control Here!


Community ResourcesCommunity Resources

● INETA MEA ! ● www.ineta.org

● mea.ineta.org

Presenter as a resource

● [email protected]

● ASP.NET Web Site - http://www.asp.net

● MSDN dev center - http://msdn.microsoft.com/asp.net/

● ASP.NT Forums - http://forums.asp.net/145/ShowForum.aspx

● Channel 9 tag - http://channel9.msdn.com/tags/ASP.NET


SummarySummary


















Please fill out the survey forms!

They are the key to amazing prizes that you can get at the end of each day

Please fill out the survey forms!

They are the key to amazing prizes that you can get at the end of each day

Thank you!Thank you!


Date post:	26-Mar-2015
Category:	Documents
Upload:	ian-daniels
View:	212 times
Download:	0 times

Sofia, Bulgaria | 9-10 October Developing An Advanced ASP.NET Server Control With Rich Design-Time...

Documents