Samantha Durante Program Manager, WPF Microsoft Corporation Mark Wilson-Thomas Program Manager, WPF...
-
Upload
donald-wilkinson -
Category
Documents
-
view
219 -
download
0
Transcript of Samantha Durante Program Manager, WPF Microsoft Corporation Mark Wilson-Thomas Program Manager, WPF...
Building A Data-Centric Application In WPF Using The New DataGrid And Ribbon Controls
Samantha DuranteProgram Manager, WPFMicrosoft Corporation
Mark Wilson-ThomasProgram Manager, WPF DesignerMicrosoft Corporation
PC45
Samantha Durante Program Manager on the WPF framework team Responsible for the Ribbon
and DataGrid controls Feedback to
[email protected] Mark Wilson-Thomas
Program Manager on the “Cider” WPF and Silverlight Designer team on Visual Studio
Responsible for Layout features in the designer Feedback to
About Us…
Learn how we’re enabling you to build Data-centric Line of Business applications in WPF much more easily
See the new Ribbon and DataGrid controls and understand how to use them right now
See how wiring up data to your application will be easier in Visual Studio 2010
All of this mostly in demo, not slides! Slides will recap so you can find stuff later…
What To Expect From This Session…
Great features out-of-the-box Autogenerate columns in one line Resizing, reordering, sorting,
selection, editing, keyboard navigation Use stock columns or define your own
Where to get DataGrid & DatePicker Download V1 today in the WPF Toolkit www.codeplex.com/wpf
Later, also available in .NET 4.0
Recap – DataGrid Basics
Getting started with Ribbon RibbonCommands are the heart of the Ribbon Use RibbonWindow for title bar integration Customize resizing without writing layout code
Where to get Ribbon Download CTP today at Office UI Licensing Site http://msdn.microsoft.com/officeui Sign the Office License to access the download Use Office UI Licensing Guidelines in to improve
the quality of your application V1 available in 2009
Recap – Ribbon Control Basics
Row Details Show additional fields within the grid
Row-Level Validation Cross-field validation for end-user input
DataGrid Customization Extensive styling to create a branded, unique UI
Recap – Advanced DataGrid Concepts
Built-in skins for Win7 & Office 2007
“Smart UI” generates appropriate visuals Application Menu Items Quick Access Toolbar Contextual Tabs
Full control over resizing layout Replace RibbonWrapPanel to
override default behavior
Recap – Advanced RibbonConcepts
Visual Studio 2010 Databinding – RAD Data Support For WPF
Initial setup: Familiar Windows Forms RAD Data Sources Window experience
Editing: Powerful data binding picker lets you customize and create data bindings without understanding data binding syntax
XAML: Will provide data binding intellisense support, for those who prefer to work in XAML
WPF is well on its way to being a great platform for LOB developers
Our new controls will help make LOB developers more productive
You can try out the new controls today at DataGrid, DatePicker: www.codeplex.com/wpf Ribbon: http://msdn.microsoft.com/officeui
Our next generation Visual Studio tooling will include many new features to help you be more productive, especially with data binding
Takeaways…
PC07 WPF: Extensible BitmapEffects, Pixel Shaders, and WPF Graphics Futures - David TeitlebaumThurs 10/30 1:45PM - 3:00PM - 403AB
Catch these on Video after PDC: PC27 Microsoft Silverlight, WPF and the
Microsoft .NET Framework: Sharing Skills and Code - Ian Ellison-Taylor
PC46 WPF Roadmap-Kevin Gjerstad PC03 Windows 7: Developing Multi-touch
Applications - Reed Townsend, Anson Tsao TL36 Microsoft .NET Framework: Declarative
Programming Using XAML - Rob Relyea, Daniel Roth
Related Sessions You Shouldn't Miss…
Evals & Recordings
Please fill
out your
evaluation for
this session at:
This session will be available as a recording at:
www.microsoftpdc.com
© 2008 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market
conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.
Microsoft’s Ribbon Strategy
MFC
The Ribbon LandscapeSoftware vendors have diverse needs
Goal: Enable a range of apps to use Ribbons
Future Plans Markup for
MFC Ribbon Designer tools
Target: MFC Native
Win2k or newer
Office 2007 Visual Style
Available now in Visual Studio 2008 SP1
Scenic
Target: Native
Vista or newer
Windows Visual Style
Coming Soon… Ships with Windows 7
WPF
Target: Managed
Needs .NET 3.5
Office 2007 & Windows Styles
Coming Soon.. Official Release in 2009
DataGrid Performance
Scroll Test WPF DataGrid• Recycling• Row &
Column Virtualization
WPF ListView• Recycling• Row
Virtualization
WinForms DataGrid
Page down 50 pages 5.5 sec 6.5 sec 3.8 sec
Line down 500 lines 12.1 sec 11.9 sec 3.9 sec
Sort Test WPF DataGrid with Custom Sort*
WinForms DataGrid
Sort 6,000 rows 59 msec 35 msec
Sort 300,000 rows 1.8 sec 1.4 sec
*Custom sort implementation instructions can be found on Jossef Goldberg’s blog:http://blogs.msdn.com/jgoldb/archive/2008/08/28/improving-microsoft-datagrid-ctp-sorting-performance-part-2.aspx
Create a DataGrid
Out of the box, you get Auto-generated columns End-user Row and Column Resizing End-user Drag/Drop Column Reordering Sorting Editing Variety of Selection Units/Modes
Recap – DataGrid Basics
<dg:DataGrid ItemsSource="…">
Edit the Columns Collection On design surface, right-click DataGrid and
choose DataGridAdd/Edit Columns
In XAML
Recap – DataGrid Basics
<dg:DataGrid AutoGenerateColumns="False"><dg:DataGrid.Columns>
<dg:DataGridTextColumn Header="Title" Binding="{Binding Title}“Width=“SizeToCells”/>
</dg:DataGrid.Columns></dg:DataGrid>
Create a Custom Column
Recap – DataGrid Basics
<dg:DataGridTemplateColumn Header="Appointment">
<dg:DataGridTemplateColumn.CellTemplate> <DataTemplate> <dg:DatePicker SelectedDate="{Binding
ApptDate}"/> </DataTemplate> </dg:DataGridTemplateColumn.CellTemplate></dg:DataGridTemplateColumn>
Define RibbonCommand Ribbon development is view-model centric RibbonCommands are the heart
of Ribbon’s intent-driven paradigm Define a RibbonCommand for each control and group
Recap – Ribbon Control Basics
<r:RibbonCommand x:Key="OpenCommand"
CanExecute="RibbonCommand_CanExecute"Executed="RibbonCommand_Executed"LabelTitle="Open Profile"ToolTipTitle="Open Profile"SmallImageSource="OpenIcon.png"/>
Add Ribbon with Tabs, Groups, & Controls
Recap – Ribbon Control Basics
<r:Ribbon> <r:RibbonTab Label="Home"> <r:RibbonGroup Name="Price" Command="{…}"> <r:RibbonButton Command="{…}"/> <r:RibbonButton Command="{…}"/> <r:RibbonButton Command="{…}"/> </r:RibbonGroup> </r:RibbonTab></Ribbon>
Change Window to RibbonWindow In XAML
In code behind
Recap – Ribbon Control Basics
<Window> <r:RibbonWindow>
public partial class Window1 : Window
public partial class Window1 : RibbonWindow
Determine Resizing Behavior Default RibbonWrapPanel collapses groups
cyclically from right to left as width decreases
Set GroupSizeDefinitions on the group to specify layout templates
Set GroupSizeReductionOrder on the tab to specify the collapse order of the groups
Recap – Ribbon Control Basics
Row Details Set the RowDetailsTemplate
Choose a Visibility Mode
Recap – Advanced DataGrid concepts
<dg:DataGrid.RowDetailsTemplate> <DataTemplate> <TextBlock Text="{Binding Description}"/> </DataTemplate></dg:DataGrid.RowDetailsTemplate>
<dg:DataGrid RowDetailsVisibilityMode="VisibleWhenSelected">
Row Level Validation Define the Validation rule and
apply it to the DataGrid
Define the Validation Error Template
Recap – Advanced DataGrid concepts
<dg:DataGrid.RowValidationRules><d:DateValidationRule/>
</dg:DataGrid.RowValidationRules>
<dg:DataGrid.RowValidationErrorTemplate><ControlTemplate> …
</ControlTemplate><dg:DataGrid.RowValidationErrorTemplate>
DataGrid Styling Properties Background & AlternatingRowBackground GridLinesVisibility Horizontal/VerticalGridLinesBrush HeadersVisibility RowHeaderWidth & ColumnHeaderHeight ColumnHeaderStyle & ColumnHeaderTemplate RowHeaderStyle & RowHeaderTemplate CellStyle, RowStyle
Recap – Advanced DataGrid Concepts
Apply Office 2007 Skin to Ribbon
Recap – Advanced Ribbon Concepts
<Window.Resources> <ResourceDictionary> <ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="/RibbonControlsLibrary;component/Themes/Office2007Blue.xaml" /> </ResourceDictionary.MergedDictionaries> </ResourceDictionary></Window.Resources>
Application Menu RibbonApplication[Split]MenuItems appear
as [Split]MenuItems only if they have children, otherwise they are buttons
Recap – Advanced Ribbon Concepts
<r:Ribbon.ApplicationMenu> <r:RibbonApplicationMenu Command="…"> <r:RibbonApplicationMenuItem Command="…"> <r:RibbonApplicationMenuItem
Command="…/> <r:RibbonApplicationMenuItem
Command="…/> </r:RibbonApplicationMenuItem>
Quick Access Toolbar Use the Placement attached property to
add controls to the QAT’s Customize Menu
Recap – Advanced Ribbon Concepts
<r:Ribbon.QuickAccessToolBar> <r:RibbonQuickAccessToolBar> <r:RibbonButton Command="…" r:RibbonQuickAccessToolBar.Placement="InCustomizeMenu"/> <r:RibbonToggleButton Command="…" r:RibbonQuickAccessToolBar.Placement="InToolBar"/>
Advanced Ribbon Resizing If complex resizing templates are needed
(e.g., Word 2007 Font group), replace the RibbonWrapPanel with a custom panel
Recap – Advanced Ribbon Concepts
<RibbonGroup Name="Font"><RibbonGroup.ItemsPanel>
<ItemsPanelTemplate><MyRibbonFontWrapPanel/>
</ItemsPanelTemplate></RibbonGroup.ItemsPanel>