CS411 Highlighted Handouts by VUBWN

Chapter 1

Lecture 1

This course is about graphical user interfaces and the event-driven model as applied to desktop, web, and mobile applications. It uses a ground up approach from what you already know. The pre-requisites are C++ programming and data structures. I will introduce any new languages and concepts we are going to use. This is a hands-on course. We will use in-class examples and you should focus on completing programming assignments to understand the material. We will primarily use 2 books in this course. “Event processing in action” and “Windows presentation foundation unleashed”. The first one is authored by Opher Etzion and Peter Niblett and is one of the very few books on event processing. Event processing is often taught as a side-concept, but we will focus on it in this course. The other book is by Adam Nathan. It is about Windows presentation foundation or WPF in short. We use it as our gui example with C#. We will introduce C# concepts and WPF concepts. They are not a pre-requisite for this course. Later in the course, we will touch event-driven programming in the browser, in particular made possible by techniques called AJAX. Again not a pre-requisite. I will introduce all the concepts in class. Towards the very end, we will discuss event driven programming on mobiles. Again no pre-requisite. I will introduce all the tools involved. So what is Visual Programming and what you will learn in this course. Its primarily event driven concepts and application of these concepts on GUI programs on desktop, web, and mobile. Here is our first example:

int main ()

char a; do { a = std::cin.get (); std:: cout << a; } while (a!=’x’); return 0;

Lets compile and run using the commands

g++ -o example1 example1.cc ./example1

Our second example

int main ()

char a = ’-’; do { std:: ifstream f(" test.txt", std:: ifstream ::in); if (f.good () && a != f.peek ()) { a = f.get (); std:: cout << a << std:: endl;

f.close (); } while (a!=’x’); return 0;

Lets compile and run it. There are a few issues like busy wait etc. but we’ll leave them on a side for now. So why we saw these two very basic examples. Well, they were both very easy to write. Can we combine them with an OR. i.e. we react to either of the two actions. Here is how we can do it.

int main ()

char a = ’-’, b; do { if ( IsKeyboardPressed ()) { b = std::cin.get (); std:: cout << b << std:: endl;

std:: ifstream f(" test.txt", std:: ifstream ::in); if (f.good () && a != f.peek ()) { a = f.get (); std:: cout << a << std:: endl;

f.close (); } while (a!=’x’ && b!=’x’); return 0;

or we could re-factor it into a cleaner version.

int on KeyPress ()

char b = std::cin.get (); std:: cout << b << std:: endl; return b == ’x’;

int on FileChanged ()

char a = f.get (); std:: cout << a << std:: endl; return a == ’x’;

int main ()

char a = ’-’, b; do { if ( IsKeyboardPressed ()) { if (on KeyPress ()) return 0;

std:: ifstream f(" test.txt", std:: ifstream ::in); if (f.good () && a != f.peek ()) { if ( on FileChanged ()) return 0;

f.close (); } while (true ); return 0;

So what are the pros and cons of the re-factored approach. We do one thing at a time (more focused approach). Blocking is a huge issue. Nothing is parallel. The key idea is that once you understand the approach, it scales really well to a large number of things you want to respond to. Next time we’ll define events, event loops, and di↵erent terms in the event driven model.