DEV-6: Introduction to the OpenEdge® Advanced GUI
Jim LundyPrincipal Product Manager
© 2008 Progress Software Corporation2 DEV-6: Introduction to the OpenEdge Advanced GUI
Agenda
What is the New UI Advanced GUI Overview Architectural Overview Visual Designer Demo Q & A
© 2008 Progress Software Corporation3 DEV-6: Introduction to the OpenEdge Advanced GUI
D I S C L A I M E R
Under Development
This talk includes information about potential future products and/or product enhancements.
What I am going to say reflects our current thinking, but the information contained herein is preliminary and subject to change. Any future products we ultimately deliver may be materially different from what is described here.
D I S C L A I M E R
© 2008 Progress Software Corporation4 DEV-6: Introduction to the OpenEdge Advanced GUI
A Microsoft® .NET™ based Windows graphical user
interface that can replace or be integrated into an existing
OpenEdge GUI Client
What is the New UI?
The New UI is…
© 2008 Progress Software Corporation5 DEV-6: Introduction to the OpenEdge Advanced GUI
Why an OpenEdge GUI for .NET?
Microsoft Windows is the market leader for desktop applications• De-facto standard• Competitive• Start-of-the-art user interfaces
Microsoft .NET Windows Forms is purposed for line of business applications• Model-View-Presenter (MVP) pattern • Data-centric UI controls• ADO.NET maps well to a ProDataSet™
© 2008 Progress Software Corporation6 DEV-6: Introduction to the OpenEdge Advanced GUI
.NET UI Components
Wealth of .NET controls• Microsoft and Infragistics®
• Other 3rd party controls
.NET Extender providers• Cross-control functionality
(Tooltips, Errors)
.NET User Controls• User-defined custom
controls
© 2008 Progress Software Corporation7 DEV-6: Introduction to the OpenEdge Advanced GUI
What is it Called?
New UI• Project name: “OpenEdge Advanced GUI”• Not a product…• A feature of OpenEdge • Develop using OpenEdge Architect or ABL development
products
New control set• Project name: “OpenEdge Advanced UI Controls”• Will be a product… optional add-on• Add-on to OpenEdge development products• Bundle of controls from Infragistics that extends the .NET UI
development capability
© 2008 Progress Software Corporation8 DEV-6: Introduction to the OpenEdge Advanced GUI
Who is the target audience?
ABL Developers using OpenEdge Architect…
Seeking to build extremely modern and appealing .NET graphical user interface…
Through the ease of ABL
© 2008 Progress Software Corporation9 DEV-6: Introduction to the OpenEdge Advanced GUI
Target audience characteristics
Customers using OpenEdge Architect…• For customers on OpenEdge
• Comfortable with Object Oriented concepts
Seeking to build extremely modern and appealing .NET graphical user interface…• Windows oriented for development and user client
Through the ease of ABL• Desires an OpenEdge-centric development environment
© 2008 Progress Software Corporation10 DEV-6: Introduction to the OpenEdge Advanced GUI
Development Methodology• Early POC and Usability input from customers• Structured “Technology Preview” approach; Beta; GA
Expected dates• Technology Previews released during 2007• Beta test target Q3 2008• General Availability target 2H 2008
Interested?• Beta signup will be open at Exchange!• www.progress.com/openedge/beta
When will it be available?
© 2008 Progress Software Corporation11 DEV-6: Introduction to the OpenEdge Advanced GUI
What reviewers are saying…
Tony Vertenten, Intris
“OpenEdge 10.2A offers a superior interface that not only streamlines developer productivity but also allows us to enhance the look-and-feel of our applications for our end-users”
© 2008 Progress Software Corporation12 DEV-6: Introduction to the OpenEdge Advanced GUI
Leverages the ABL• Single language; No need to learn C#, VB.NET• Data binding between ABL data sources and UI controls • Event binding between ABL methods and UI events
Single design center: OpenEdge Architect• No need to purchase, learn or use non-OpenEdge products
(Visual Studio®)
Benefits: Benefits: • Shorter ramp-upShorter ramp-up Higher productivity Higher productivity• Built-in data binding Built-in data binding Purposed for business Purposed for business
applicationsapplications• Built on OpenEdge: Deployment and data source flexibilityBuilt on OpenEdge: Deployment and data source flexibility
Primary Features and Benefits
© 2008 Progress Software Corporation13 DEV-6: Introduction to the OpenEdge Advanced GUI
Integrates with existing GUI (at container level)
Independent of deployment topology (C/S or n-tier)
Extensible with 3rd party controls and custom controls
Adaptable to future UI enhancements or other emerging UIs
BenefitsBenefits: : • Adopt at your own paceAdopt at your own pace• Contemporary Windows look and feel without compromiseContemporary Windows look and feel without compromise• Architected for investment protectionArchitected for investment protection
Primary Features and Benefits
© 2008 Progress Software Corporation14 DEV-6: Introduction to the OpenEdge Advanced GUI
How does it compare to other OpenEdge UI Technologies?
OpenEdge Advanced GUI
Build modern state-of- the-art .NET™ GUIs in ABL
OpenEdge Architect 10.2A or above
UI Technology Primary Use
Progress® GUI
WebClient™
OpenClient
WebSpeed®
Character
Build Windows 95 user interface look and feel
Build thick client GUI with thin client deployment characteristics
Provides the capability to add alternate UIs (.NET & Java™) to OpenEdge Apps
Build Web-browser based apps with zero client footprint
Build traditional green-screen user interfaces
Progress Dynamics®
OpenEdge StudioOpenEdge Architect
OpenEdge StudioOpenEdge Architect
OpenClient Toolkit
WebSpeed Workshop
OpenEdge Architect OpenEdge Studio4GL Development System
Tools to Use
© 2008 Progress Software Corporation15 DEV-6: Introduction to the OpenEdge Advanced GUI
Zero Client Footprint
Thin Client Footprint
2-Tier Computing
OpenEdge Advanced GUI
WebSpeed
Progress GUI
Progress Character
OpenClient.NET & Java™
n-Tier Distributed Computing
How does it compare to other OpenEdge UIs?
© 2008 Progress Software Corporation16 DEV-6: Introduction to the OpenEdge Advanced GUI
OpenEdge GUI Architecture (“Classic”)
OpenEdge GUI ( Windows, Frames )OpenEdge GUI ( Windows, Frames )
DataSets, Temp-tablesDataSets, Temp-tables
Data AccessData Access
Data SourcesData Sources
Co
mm
on
Infrastru
cture
Co
mm
on
Infrastru
ctureO
pe
nE
dg
e R
un
tim
eO
pe
nE
dg
e R
un
tim
e
© 2008 Progress Software Corporation17 DEV-6: Introduction to the OpenEdge Advanced GUI
Advanced GUI Architecture (“New”)
OpenEdge GUI ( Windows, Frames )OpenEdge GUI ( Windows, Frames )
DataSets, Temp-tablesDataSets, Temp-tables
Data AccessData Access
Data SourcesData Sources
Co
mm
on
Infrastru
cture
Co
mm
on
Infrastru
cture
Op
enE
dg
e R
un
tim
eO
pen
Ed
ge
Ru
nti
me
.NET GUI.NET GUIC
LR
CL
R
UI Logic ( events, data binding )UI Logic ( events, data binding ) BridgeBridge
BridgeBridge
• GUI components• Data access• I/O blocking• Event handlers
• GUI Visualization• User interaction and events
© 2008 Progress Software Corporation18 DEV-6: Introduction to the OpenEdge Advanced GUI
ABL Extensions
Progress.Windows.Form• ABL forms inherit from this class • InitializeComponent method (generated)
Progress.Data.BindingSource• New ABL object to access Progress data sources • Extends .NET BindingSource class• Binds .NET control to ABL data source (query)
Event Subscription• Subscribe method added to every .NET event• Takes an ABL method / procedure name
© 2008 Progress Software Corporation19 DEV-6: Introduction to the OpenEdge Advanced GUI
A Closer Look into the Advanced GUIPresentation Layer
.NET GUI.NET GUI
OpenEdge RuntimeOpenEdge Runtime
BridgeBridge
.NET CLR.NET CLR
BridgeBridge
frm = NEW Form( ).frm:Closing:Subscribe( EventHdlr1 ).WAIT-FOR Application.Run( frm ).
EventHdlr1( ) …
frm = NEW Form( ).frm:Closing:Subscribe( EventHdlr1 ).WAIT-FOR Application.Run( frm ).
EventHdlr1( ) …
One Process for OpenEdge Runtime and .NET CLR
ABL LogicABL Logic
© 2008 Progress Software Corporation20 DEV-6: Introduction to the OpenEdge Advanced GUI
A Closer Look into the Advanced GUI Presentation Layer
.NET GUI.NET GUI
OpenEdge RuntimeOpenEdge Runtime .NET CLR.NET CLR
3
DEF VAR frm AS Form.frm = NEW Form( ).
frm:Closing:Subscribe( FrmClose ).
WAIT-FOR Application.Run( frm ).
Method VOID FrmClose( ) MESSAGE “BYE” VIEW-AS ALERT-BOX.END.
ABL LogicABL Logic BridgeBridgeBridgeBridge
1
2
4
6
57
© 2008 Progress Software Corporation21 DEV-6: Introduction to the OpenEdge Advanced GUI
Advanced GUI ABL Language
Window
• Create form and controls• Event subscription & handler methods (default)• Binding to ABL data
Form.cls
Startup.p
• Entry point to run GUI• NEW’s Form.cls• Performs WAIT-FOR
Form / Data.p / .i’s
• Alternate location for event handlers• Data source definition and query
© 2008 Progress Software Corporation22 DEV-6: Introduction to the OpenEdge Advanced GUI
Advanced GUI Tools Architecture
OpenEdge Architect
ABL Editor
Visual Designer
OpenEdge Client
Eclipse, OpenEdge and .NET CLR work together
OpenEdge
AVM
Microsoft
CLR
Eclipse (foundation platform)
© 2008 Progress Software Corporation23 DEV-6: Introduction to the OpenEdge Advanced GUI
WYSIWYG Form creation and editing• Define Form• Add .NET controls• Set properties of controls and
components• Define data binding objects• Add event subscriptions
Class Browser• Displays class member information
about ABL and .NET classes
Visual Designer
Built as an Eclipse plug-in for OpenEdge Architect
© 2008 Progress Software Corporation24 DEV-6: Introduction to the OpenEdge Advanced GUI
Visual Designer Perspective
ToolboxProperties
view
Selectedproperty
Form
VisualDesigner
Control
© 2008 Progress Software Corporation25 DEV-6: Introduction to the OpenEdge Advanced GUI
Generated code for a form
© 2008 Progress Software Corporation26 DEV-6: Introduction to the OpenEdge Advanced GUI
Advanced GUI Demo
© 2008 Progress Software Corporation27 DEV-6: Introduction to the OpenEdge Advanced GUI
Visual Designer Perspective
ToolboxProperties
view
Selectedproperty
Form
VisualDesigner
Control
© 2008 Progress Software Corporation28 DEV-6: Introduction to the OpenEdge Advanced GUI
Advanced GUI Prerequisites
ABL Programming• Object-oriented ABL
• .NET Windows Form Framework Classes
• .NET Infragistics Windows Form Classes
OpenEdge Architect• WYSIWYG Visual Designer
– Properties view and Control Toolbox
• Object-oriented Class Browser
© 2008 Progress Software Corporation29 DEV-6: Introduction to the OpenEdge Advanced GUI
Preparing for Advanced GUI
Move to OpenEdge 10… Ideally 10.1C
Move UI logic to methods
Consider UI Design
Get familiar with OOABL constructs and syntax • Create and access UI objects
• Call methods, access properties
• Subscribe to UI events
Beta signup
Steps You Can Take Now…
…Catch the Wave!
© 2008 Progress Software Corporation30 DEV-6: Introduction to the OpenEdge Advanced GUI
Exchange Content OpenEdge Advanced GUI
DEV-16 Leveraging the Power of the Advanced GUI• Tony Vertenten, Intris • Erwin in ‘t Veld, CCS • Roland de Pijper, Eric Debeij, Progress
DEV-29 Deep Dive into Developing with Advanced GUI• Shelley Chase, Product Architect, Progress
DEV-32 Using the Advanced GUI, Structured Error Handling and SonicMQ to build a Semi-Disconnected Point of Sale• Brian Preece and Romin Sanai, BCP Software
DEV-40 Using SmartObjects with Advanced GUI• Mike Fechner, ConsultingWerk
DEV-43 OpenEdge Tools and User Interface Info Exchange• Jim Lundy, Principal Product Manager, Progress
© 2008 Progress Software Corporation31 DEV-6: Introduction to the OpenEdge Advanced GUI
Questions?
© 2008 Progress Software Corporation32 DEV-6: Introduction to the OpenEdge Advanced GUI
Thank You
© 2008 Progress Software Corporation33 DEV-6: Introduction to the OpenEdge Advanced GUI