Interaktive Computergraphik

1
Interaktive Computergraphik
Konzepte, Geräte, Realisierung in Open GL
2
Gliederung

• Eingabegeräte
• logische und physische Eingabegeräte
• Eingabemodi
• Verarbeitung von Eingaben
• Ereignisorientierte Verarbeitung
• Menüeingabe
• Graphische Interaktionstechniken
• Picking, Rubberbanding
• Display Listen
• Buffering
• Zusammenfassung

3
Einführung

• Szenario
• Graphische Darstellung (2D/3D)
• Benutzer selektiert oder überfährt Teile der
  Darstellung und löst Aktionen aus ? graphische
  Darstellung ändert sich entsprechend.
• Beispiele
• Zoomen in eine Darstellung geographischer Daten
• Einblenden von passendem Text zu aktuellem Teil
  der Graphik
• Standpunkt ändern in einem virtuellen Museum
• Verändern eines geometrischen Modells in einem
  CAD-System (Einfügen bzw. Anpassen einer Bohrung)

4
Einführung

• Verarbeitung von Benutzereingaben hängt stark von
  Fenster- und Betriebssystem ab.
• Betrachten nur elementare Möglichkeiten, die
  praktisch auf allen Plattformen verfügbar sind.
• Beispiele
• Verarbeitung von Maus- und Tastatureingaben
• Spezifikation und Nutzung von Popup-Menüs
• Diese sind Bestandteil der OpenGL Utilities.
• Bisher
• glutCreateWindow () //Erzeugen eines Fensters
• glutInitWindow (windowSize, windowPosition)
• glutMainLoop() // Ereignisschleife

5
Eingabegeräte

• Eingabegeräte sind sehr unterschiedlich in ihrer
  genauen Funktionsweise, in ihren physikalischen
  Parametern und den Werten, die sie liefern.
• Beispiele
• Tastaturen mit unterschiedlichen Layouts
• Optische Mäuse, elektrische Mäuse, Joystick,
  Trackball, Pen
• Problem Entwicklung von Software, die eine große
  Bandbreite physikalischer Eingabegeräte behandeln
  kann. Entstehender Code wäre sehr komplex und
  hardwareabhängig.
• Unterscheidung zwischen logischen und physischen
  Eingabegeräten.

6
Eingabegeräte

• Logische Eingabegeräte stellen eine
  Highlevel-Schnittstelle zur Verfügung.
• Keyboard liefert eine vom Benutzer spezifizierte
  Taste (ASCII-Code) sowie evtl. zusätzlich
  betätigte Tasten und den Zeitpunkt der
  Eingabe.
• Locator Eingabe einer Position auf dem
  Bildschirm sowie betätigte Maustaste und
  den Zeitpunkt
• Umsetzung der hardwarespezifischen Besonderheiten
  durch entsprechende Treiber. Diese wandeln
  physi-kalische Signale in die Parameter logischer
  Eingabegeräte um.

7
Eingabegeräte

• Funktion eines Locators Selektion von Positionen
  (Pixel) oder Selektion von Objekten (Umrechnung
  von Pixeln in Objekte.)
• Trigger Drücken oder Loslassen von Maustasten
• Physische Realisierung
• Maus, Trackball, Lightpen, Joystick, Touchscreen
• Keyboard Eingabe von Zeichenketten (Text,
  Passwort)
• Trigger Entertaste
• Physische Realisierung Physische Tastatur oder
  auf dem Bildschirm eingeblendete Tastatur für die
  Selektion mit einem Locator (PDAs)

8
Eingabegeräte

• Klassifikation von Locator-Eingaben
• Relative und absolute Positionierung.
• Absolut Position des Locators wird eindeutig
  auf eine Cursorposition abgebildet.
• Relativ Position und Bewegung des Locators wird
  flexibel auf eine Cursorposition abgebildet.
  Abbildung wird durch Control/Display-Ratio
  bestimmt (C/D-Wert).
• Variante C/D-Wert wird bei schneller Bewegung
  erhöht und bei langsamer Bewegung verringert
  (z.B. um eine genaue Platzierung zu
  unterstützen).
• Absolute Positionierung Datentablett,
  Konstruktionszeichnungen
• Relative Positionierung Maus, Trackball, etc.

9
Eingabegeräte

• Direkte und Indirekte Selektion
• Direkte Selektion durch Berührung der
  entsprechen-den Bildschirmbereiche. Bei direkter
  Selektion ist die Positionierung absolut.
• Beispiele Touchscreen, Pen
• Indirekte Selektion durch Bewegung eines Gerätes
  außerhalb des Bildschirmes. Positionierung kann
  absolut oder relativ sein.
• Zeigegeräte unterscheiden sich darin, wie
  intuitiv sie sind (direktes Zeigen ist intuitiv)
  und wie genau positioniert werden kann. ? Daraus
  ergeben sich Anwendungsgebiete (Touchscreen für
  Informations-systeme, Datentablett für
  Konstruktion).

10
Eingabegeräte
Verarbeitung von Eingaben mit einem
Zeigegerät Möglichkeiten, Koordinaten in
unterschiedlichen Dimen-sionen anzugeben (z.B.
metrische Einheiten und Pixel)
11
Eingabegeräte

• Beispiele für Zeigegeräte
• Maus Graphiktablett
• Trackball Joystick SpaceMouse

Quelle Angel (2000)
12
Eingabegeräte

• Joystick
• Vorbild reale Steuerungsgeräte
• Oft bei Spielen benutzt, z.B. zur
  Geschwindigkeitssteuerung in virtuellen Welten.
• Kann mit taktiler Rückkopplung kombiniert werden
  (Federn und Dämpfer), z.B. um größeren Widerstand
  oder Kollisionen zu signalisieren.

13
Eingabemodi

• Unterscheiden, wann das Maß, das ein logisches
  Eingabegerät registriert, an das
  Anwendungs-programm (AP) weitergeleitet wird.
• Nach Initialisierung wird jede Eingabe
  (Betätigung einer Taste bzw. Bewegung mit einem
  Eingabegerät) in einem Puffer registriert.
• Im sample-mode wird der Puffer kontinuierlich
  gelesen und an das AP weitergeleitet. Problem
  viel Zeit wird für die kontinuierliche Abfrage
  benötigt.
• Im request-mode wird der Puffer erst nach
  Betäti-gung eines Triggers an das AP
  weitergeleitet.
• In beiden Modi wird Eingabegerät über eine Id
  identifiziert und vom Programm angesteuert.

14
Eingabemodi

• Request und Sample-Mode sind für die zentrale
  Steuerung eines Programmes, bei dem die
  Inter-aktion systemgesteuert abläuft (System
  erwartet Eingaben in definierter Reihenfolge).
• Für die dezentrale Programmsteuerung, bei der die
  Interaktion vom Benutzer gesteuert wird, dient
  der event-mode.
• Sample-Mode
• Request-Mode
• Event-Mode

Quelle Angel (2000)
15
Eingabemodi

• Event-Mode Eingabegeräte werden getriggert und
  Eingaben in eine (Warte)schlange eingeordnet. AP
  enthält Eventhandler, die eine Reaktion auf das
  Ereignis spezifizieren. Wenn keine Reaktion
  spezi-fiziert ist ? Standardverhalten (z.B.
  Rückkopplung bei Texteingabe).
• Abarbeitung der Warteschlange entweder nach
  Ereigniszeit (First In First Out) oder
  modifiziert durch Prioritäten.

16
Ereignisorientierte Verarbeitung

• Häufigster und auch in Open GL unterstützter
  Modus
• Mouse events
• MoveEvent
• Ereignis wird bei jeder Bewegung generiert, z.B.
  für das Zeichnen.
• MouseEvent (oft auch Button-Down-Event)
• Wird beim Drücken (oder beim Drücken und
  schnellen Loslassen) eines Buttons generiert,
  z.B. zum Setzen von Punkten eines Polygons
• Window events
• Reshape Event (oft auch Resize-Event). Fenster
  wird skaliert.
• Expose-Event. Fenster wird sichtbar (z.B. bei
  Initialisierung, bei Vergrößerung eines
  iconifizierten Fensters).

17
Ereignisorientierte Verarbeitung

• Mouse events
• Angabe, welche Funktion auf Mouse events
  reagiert.
• glutMouseFunc (mouse_callback)
• Mouse_Callback hat die Form
• void mouse_callback (int button, int state, int
  x, int y)
• Beispiel
• void mouse (int btn, int state, int x, int y)
• if (btn GLUT_LEFT_BUTTON state
  GLUT_DOWN)
• setPoint (x,y)
• if (btn GLUT_MIDDLE_BUTTON state
  GLUT_DOWN)
• exit()

18
Ereignisorientierte Verarbeitung

• Window Events
• Angabe, welche Funktion auf eine Skalierung
  reagiert.
• glutReshapeFunc (reshape_callback)
• Reshape_Callback hat die Form
• void reshape_callback (GLsizei w, GLsizei h)
• Reshape Event, Überlegungen
• Neuzeichnen aller zuvor sichtbaren Objekte?
• Verhalten bei ungleichmäßiger Skalierung?
• Werden Attribute für neue Primitive verändert?

19
Ereignisorientierte Verarbeitung

• Beispiel für eine Reaktion auf eine Skalierung
• void reshapeFct (GLsizei w, GLsizei h)
• // Clipping Box anpassen
• glMatrixMode (GL_Projection) glLoadIdentity()
• gluOrtho2D ( 0.0, (GLdouble) w, 0.0, (GLdouble)
  h )
• glMatrixMode (GL_ModelVIEW) glLoadIdentity()
• // Viewport anpassen
• glViewport (0,0, w, h)
• glClearColor (0.0, 0.0, 0.0, 0.0)
• glClear (GL_COLOR_BUFFER_BIT)
• glFlush ()

20
Ereignisorientierte Verarbeitung

• Tastaturereignisse
• Spezifikation der Callbackfunktion
• glutKeyboardFunc (keyboard)
• void keyboard (unsigned char key, int x, int y)
• if (key q key Q)
• exit ()

21
Menüeingabe

• Menüs ermöglichen hierarchisch sortierte
  Präsentation von Kommandos.
• Vorteile gegenüber Kommandosprachen
• keine Schreibfehler, geringer Lernaufwand.
• In OpenGL Popup-Menüs, die an aktueller
  Cursorposition erscheinen. Diese können
  kontextabhängig sein (Inhalt wird angepasst an
  selektierten Bereich/selektiertes Objekt)
• Was muss man tun?
• Menü erzeugen,
• Menüeinträge festlegen,
• Untermenüs festlegen,
• Festlegen, wann das Menü aktiviert wird
• Festlegen, welche Funktionen auf Betätigung der
  Menüeinträge reagieren

22
Menüeingabe

• Was muss man tun?
• Menü erzeugen glutCreateMenu (testMenu)
• Menüeinträge festlegen glutAddMenuEntry
  (Ende, 1)
• Untermenüs festlegen glutAddSubmenu
  (Skalieren, submenu)
• Festlegen, wann das Menü aktiviert wird
• glutAttachMenu (GLUT_RIGHT_BUTTON)
• Funktionen erstellen, die auf Betätigung der
  Menüeinträge reagieren
• void testMenu (int id)
• switch (id)
• case 1 exit () break
• case 2

23
Graphische Interaktionstechniken Picking

• Interaktionsaufgabe Selektion von Objekten
  (Graphikprimitiv, z.B. Polygon)
• Zuordnung einer Position p zu einem Objekt o.
• Probleme
• Selektion von sehr dünnen Objekten (Linien, Text)
• Lösungsansatz Definition größerer
  maussensitiver Bereiche
• Mehrdeutigkeiten bei Überlappung von Objekten
• Lösungsansatz Selektiere das kleinste Objekt,
  das p enthält.
• 3. Effizienz
• Lösungsansatz Nutzung hierarchischer Hüllkörper
  h(o) ,z.B. Kreise/Kugeln bzw. Rechtecke/Quader.
  Wenn p nicht zu h(o) gehört, gehört p (erst recht
  nicht) zu o.
• h(o) so wählen, dass h(o) und Zugehörigkeit von
  p zu h(o) schnell bestimmt werden können.

24
Graphische Interaktionstechniken Picking

• Definition eines maussensitiven Bereiches um eine
  Linie

Hierarchisches Picking
25
Graphische Interaktionstechniken Picking

• Anwendung in einem Malprogramm
• Selektion von Linien bzw. Objekträndern, um
  Linienstile zu ändern
• Selektion von flächenhaften Polygonen, um Muster
  und Füllstile zuzuordnen
• Selektion von Objekten, die zu einer Gruppe
  zusam-mengefasst und einheitlich behandelt werden
  sollen.
• Selektion eines Objektes, das kopiert/gelöscht/
  skaliert/rotiert werden soll.

26
Graphische Interaktionstechniken Picking

• Picking Mehrfachselektion in einer
  hierarchischen Struktur (hier ein Gefäßbaum, sog.
  Lassoselektion)

27
Graphische Interaktionstechniken Rubbberbanding

• Interaktionstechnik zur Erstellung einfacher
  Graphikprimitive, z.B. Linien, Rechtecke,
  Ellipsen
• Idee
• Benutzer spezifiziert Objekttyp und einen ersten
  Punkt (Anfangspunkt der Linie, untere linke Ecke
  eines Rechteckes)
• Mit gedrückter Maustaste wird die Maus bewegt,
  wobei veranschaulicht wird, wie das
  Graphikprimitiv beim Loslassen der Maustaste
  aussehen würde.
• Beim Loslassen wird das Primitiv erstellt.
• Wirkt wie ein an einer Stelle fixiertes
  elastisches Gummiband.
• Motivation Form und Größe der auf diese Weise
  erstellten Polygone müssen seltener geändert
  werden.

28
Graphische Interaktionstechniken Rubberbanding

• Probleme/Aufgaben
• Graphik muss in jedem Schritt neugezeichnet
  werden.
• Zuletzt gezeichnete Graphik muss gelöscht werden.
• Flackern vermeiden.

Quelle Angel (2000)
29
Display-Listen

• Modi der Graphikdarstellung
• Immediate-Mode Jedes Kommando, das die Graphik
  betrifft (z.B. Hinzufügen eines Polygons,
  Spezifikation einer Transformationsmatrix) wird
  sofort ausgeführt.
• Problem Keine Informationen über die Szene sind
  gespeichert.
• Retained-Mode Die spezifizierte Szene wird in
  einer Display-Liste gespeichert. Beim Neuzeichnen
  der Szene (z.B. nach einem Resize-Event) wird
  einfach die Display-Liste aufgerufen. Besonders
  nützlich für vordefinierte, mehrfach verwendete
  Teile einer Graphik (Font, Icon)
• Nachteile zusätzlicher Overhead und
  Speicherbedarf.

30
Display-Listen

• Display-Listen
• werden erzeugt (Beginn und Ende) glNewList,
  glEndList
• haben eine eindeutige Nummer
• werden aktiviert glCallList
• Können in Feldern angeordnet werden glGenLists
  (number)
• Beispiel
• define Rechteck 1
• // Liste wird definiert, aber nicht ausgeführt
• // Alternative GL_COMPILE_AND_EXCEUTE
  (sofortiges Ausführen)
• glNewList (Rechteck, GL_COMPILE) glBegin
  (GL_POLYGON)
• glVertex2f(-1.0, -1.0) glVertex2f(1.0, -1.0)
• glVertex2f(1.0, 1.0) glVertex2f(-1.0, 1.0)
• glEnd()
• glEndList ()

31
Display-Listen

• Problem
• Aufruf der Display-Liste kann nachfolgende
  Zeichenoperationen/Transformationen (unerwartet)
  beeinflussen.
• Daher ist folgendes üblich und empfehlenswert
• Anfang Speichern der Attribute und
  Transformation auf dem Stack
• glPushAttrib (GL_ALL_ATTRIB_BITS)
  glPushMatrix()
• Ende Wiederherstellen der Attribute und
  Transformation
• glPopAttrib() glPopMatrix()

32
Buffer

• Inhalt des Bildschirms wird im Framebuffer
  gespeichert.
• Bei interaktiven Programmen ist häufig ein
  erneutes Darstellen des Bildschirminhaltes nötig
  (z.B. beim Rubberbanding).
• Daher Zeichnen erfolgt in einen zweiten Buffer
  (Double-buffering). Erst wenn das Zeichnen im
  Back-Buffer abgeschlossen ist, wird der Buffer
  komplett in den Front-Buffer kopiert und damit
  gezeichnet.
• Doublebuffering einschalten
• glutInitDisplayMode (GLUT_RGB GLUT_DOUBLE)
• Zweiten Buffer in den ersten kopieren
  glutSwapBuffers()

33
Zusammenfassung

• Eingabegeräte mit Fokus auf Zeigegeräten
• Logische Eingabegeräte abstrahieren von
  physikalischen Details.
• Eingabemodi mit Fokus auf ereignisorientierter
  Verarbeitung
• Menüeingabe Erstellung und Nutzung von
  Popup-Menüs
• Display-Listen und Buffer