Download - CS360/CS580H
CS360/CS580H
GUI & Windows ProgrammingIntroduction
Basic Course Outline
• Visual Studio 2013• Win32/Windows API & SDK• MS Foundation Classes (MFC) & C++• HTML, XAML• C# vs. C++ concepts/differences• Common Gateway Interface (CGI) programming• The .Net Framework• Windows Forms• WPF - Windows Presentation Foundation
Using DirectX + XAML & RTL (post-Vista)• Android
Paradigms
• 4 different ways to build a GUI program:• Each has advantages/disadvantages– WIN32API – lower-level control, works on older systems – Microsoft Foundation Classes – many pre-built objects– Windows Forms – presentation separated from processing– Windows Presentation Foundation
• Can build common browser-based and desktop apps• Easier handling of media types
Comparison of Paradigms
Win32API MFC Windows
FormsWindows
Forms+API Codepack
WPF
GUI forms and controls X X X X
On-screen documents X X X
Fixed-format documents (PDF) ext X X
Images BMP X
Video/audioUse
Media Player
X X
2D graphics " X X
3D graphics " X X
Note: WPF – see WindowsFormsHost control
Basic Concepts for all GUI's
• "Control" – MS term for mechanisms that manage what appears on the screen– Sliders, pointers, windows, data entry boxes, etc.
• Messages – system code indicating user action• Message loop – Mechanism to pass execution between system app– Uses messages to determine processing
• Multi-threading O/S
Fonts & Pixels• Dots per inch (DPI)• Device-independent pixel (DIPs) (1/96 of a logical inch)• 1 pt = 1/72 inch (ALWAYS!!!)
– 12pt font takes 12/72 inch in HEIGHT– Some characters need more or less space (e.g.; letters L and I)– A 72-point font is defined to be one logical inch tall = 96px– 1 logical inch=96 pixels– A 12pt font needs 12 points/(72 points per inch)=1/6 of an inch– 12 points = 1/6 logical inch = 96/6 = 16 pixels– BUT if display is set to 144 DPI, then 72pt font=144 px NOT 96
• Because that inch now has to hold 144 pixels, not 72 or 96
MS naming conventions
prefix data type---------------------------------by BYTE (unsigned char)b BOOL (int, TRUE=1 FALSE=0)c chardw DWORD (4-byte unsigned long)fn functionh handlel long (4 bytes)n short (int) near pointerp pointersz null-terminated char stringw word (two bytes)lpsz long ptr to null-terminated str
Processing window messages
• Message codes for event triggering• A "callback" mechanism (next slide)– O/S calls your function– Reverse of a "system call"
• Message processing loop in program– Tests for message types– Calls your handler functions
• Program is idle until an event
Callback Functions
A thread-like mechanism:1. Program issues a service call to O/S
a. Tells O/S address of callback fnb. Tells O/S when to call it (msg filter)
2. Program loop waits for an "event" message 3. Program reads message from queue, tells O/S to
signal the callback function, loops for more msgs, NO WAIT for msg processing
4. O/S starts callback fn to process the message5. Callback returns to O/S
Model-View-Controller (MVC) Architecture
• 3 parts of an application:– Data, interface, operations
• MVC separates pgm data types from presentation• Reduces complexities/dependencies• Model– application data specs
• View – what the user sees (may also be controller)• Controller - code to process the data– Accepts input– Rules for processing– Converts to pgm-usable data (codes, msgs, etc)
Win32API Architecture
• Core set of system interfaces– Kernel32.dll
• Mem mgmt., I/O, process, thread
– User32.dll• implements abstractions for Windows apps
– HWND– MSG– Message loop– Build, obscure, size, move, dialogs, etc
– GDI32.dll• Drawing lines & curves• Manage palettes• Rendering fonts• Predecessor of DirectX/OpenGL• No "frames", no rasterization, SLOW
Win32 = Windows API
• Uses basic windows functions• Usable with C/C++, Java• Programmer must do almost everything• Used with the Windows SDK (NOT MFC)
MICROSOFT FOUNDATION CLASSES
MFC architecture
• Based on Document/View concept– Separation of data from the user's view of data– Data is what user sees with "open a file"
• Operations – Design the window(s) - these are the "views"– Process the data based on user input– Switch/modify windows as needed to show results– E.g.; represent a collection of numbers as
• Table• Graph
MS Foundation Classes (MFC)
• A C++ class library• Builds on portions of the Win32API• Pre-defined classes contain pre-written code:– Independent of user settings
• Create/Open/Close a window• Open a dialog box
– Adjustable (size, content, etc.) via the program
WINDOWS FORMS (WF)
Windows Forms (WF) Architecture
• Use C# or Visual Basic• GUI part of .NET Framework• Does not offer a paradigm comparable to
Model–View–Controller paradigm of MFC• Event driven• Feature of .NET Framework• Usage:– Design a form (e.g.; built-in wizard in MS Access, Visual
Basic)– Specify parts of program that process each part– Function names to call are embedded in the form
WINDOWS PRESENTATION FOUNDATION
WPF Architecture
• Provides many h/w-related advances– Hardware acceleration (graphic adapter card)
also called Graphics Processing Unit (GPU)– Enables modern UI features
• transparency, gradients and transforms
• Deployable on desktop or web browser• Subset of .Net Framework types – Mostly in System.Windows – WPF provides additions for properties & routed events
• Uses markup & code-behind concepts– XAML – Managed languages (C#)
WPF (4.5 – Aug 2012 – might be the last version)
• 1st release in 2005• Implements SOAP & non-MS web svc's tech's.• DirectX vs. older GDI interface• C#, .Net, XAML (based on XML)• Standalone apps• Embedded objects on a website• RTL included in all Windows post-XP• Unifies– Rendering, typography, vector graphics, animation, fixed,
adaptive & pre-rendered docs, events, bindings
• Poor response-time, not for low-power devices
WPF vs. WinForms
• WPF– Does not rely on "standard" windows controls– A "window" is just a border around "content"– e.g.; Can make a button with image & text in it– BUT may take more work for "simple" things
• WF– ONLY uses standard "windows"
• Dialog/text boxes, etc.
– Button w/image would require you to create your own button control type
WPF example – part 1
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation " xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Class="SDKSample.AWindow" Title="Window with Button"
Width="250" Height="100"> <!-- Add button to window --> <Button Name="button" Click="button_Click">Click Me!</Button>
</Window>
• x:Class associates – XAML def'n of window (above)– code-behind class (Awindow) on next slide
• This example (parts 1 & 2) is from: http://msdn.microsoft.com/en-us/library/aa970268(v=vs.110).aspx
WPF example –part 2
using System.Windows; // Window, RoutedEventArgs, MessageBox namespace SDKSample { public partial class AWindow : Window
{ public AWindow() { // Set properties and register event handlers
InitializeComponent(); // Required to merge this class & XAML
} void button_Click(object sender, RoutedEventArgs e)
{ // Show message box when button is clicked MessageBox.Show("Hello, from WPF app!");
} }
}
.NET (3.0) stack
.NET Apps .NET Tools
CLR, Base Class Libraries, ASP.NET, ASO.NET, WinForms
WPF CardSpace(InfoCard)Canceled!
WF(Workflow)
Windows
Deploying .NET Framework Apps
• Distinguish between the app and the Framework• http://msdn.microsoft.com/en-us/library/6hbb4k3e(
v=vs.110).aspx• http://support.microsoft.com/kb/818016