Task B: Pong als Beispiel für ein MVC Pattern
Contents
Task B: Pong als Beispiel für ein MVC Pattern#
In dieser Aufgabe soll ein einfaches Computerspiel umgesetzt beziehungsweise erweitert werden. Grundlage ist ein Pong Spiel. Dies ist in dem Design-Pattern [Gamma et al., 1994] Model-View-Controller umgesetzt. Zuerst sollen in diesem Task diese drei einzelnen Bestandteile in dem Beispiel nachvollzogen werden und dann entsprechend erweitert werden. Dazu wird die Funktionalität und Darstellung des Spiels ausgebaut.
Model-View-Controller Design-Pattern#
Das Model-View-Controller (MVC) Design-Pattern wird zur klaren Trennung in unterschiedliche Funktionalitäten genutzt, mit dem Ziel der Wiederverwendbarkeit der so sich ergebenden einzelnen Bausteine [Deacon, 2009]. Es hilft, den Code in verschiedene Komponenten aufzuteilen, um eine saubere Trennung von Verantwortlichkeiten und eine bessere Wartbarkeit der Anwendung zu ermöglichen.
Die drei Hauptkomponenten des MVC-Modells sind das Modell, die Ansicht und der Controller.
Modell: repräsentiert die Daten und die Logik der Anwendung. Es enthält Daten und Methoden, die verwendet werden, um diese Daten zu verwalten und zu aktualisieren. Das Modell wird normalerweise von einer Datenbank abstrahiert und kann aus mehreren Klassen bestehen. Es ist unabhängig von Ansichten und der Ablaufsteuerung.
Ansicht / View: repräsentiert die Benutzeroberfläche der Anwendung. Es zeigt dem Benutzer die Daten aus dem Modell an und ermöglicht ihm die Interaktion mit der Anwendung. Änderungen am Modell werden meist über ein Observer-Pattern auf dem Modell wahrgenommen und dann in der Ansicht entsprechend aktualisiert und angepasst dargestellt.
Controller: übernimmt die Programmsteuerung. Es empfängt Eingaben von dem/der Benutzer:in (heute ist dies häufig an spezielle Views gekoppelt) und verwendet diese Eingaben, um das Modell zu aktualisieren. Dient häufig so als Schnittstelle zwischen dem Modell und der Ansicht.
Durch die Verwendung des MVC-Ansatzes können Entwickler:innen die Komponenten der Anwendung isoliert voneinander testen und wiederverwendbare Komponenten erstellen. Der MVC-Ansatz ermöglicht es den Code zu modularisieren und so die Wartbarkeit der Anwendung zu verbessern. MVC ist beliebt in der Umsetzung von Computerspielen [Olsson, 2015].
Model-View-Adapter Design-Pattern#
Heutzutage werden vielfach Frameworks zur Darstellung in Computerprogrammen genutzt, die eigenen Interaktionskonzepten unterliegen und diese direkt realisieren. Daher ist die Verbindung der Ansicht/ View mit der Kontrolle – und dadurch der Art der Interaktion – sehr eng und diese sind direkt miteinander verwoben. Deshalb werden heute häufig Abwandlungen des MVC Patterns genutzt [Graca, 2017]. Eine Abwandlung des MVC Designmusters ist das Model-View-Adapter Design-Pattern [Lopez et al., 2012]. In diesem Konzept ist einer Ansicht/ View jeweils ein Adapter als Interface zum Modell direkt zugeordnet. So bleibt die Darstellung, in zum Beispiel einer Benutzeroberfläche, und die sich daraus ergebende Art der Interaktion austauschbar und ist unabhängig vom Modell. Gleichzeitig können aber so die besonderen Funktionalitäten genutzt werden, die eine spezielle Ansicht zur Interaktion anbietet.
Kompilieren und Ausführen der C++ Programme#
Sie können weiterhin auf dem JupyterHub arbeiten (Wählen sie dabei das “Software Development” Image (3.3.0)!). Hierbei wird direkt das entsprechende gitlab in ihren Arbeitsbereich geupdated. Auf dem Hub können sie eine IDE im Browser nutzen (siehe Beschreibung hier), wobei wir an diesem Termin mit einem einfachen Terminal auskommen.
Kompilieren und ausführen auf dem Hub:
Terminal auf dem Hub öffnen (im rechten Fenster oben einen neuen Tab öffnen, dort im Launcher ganz unten (unter “Other”) “Terminal” auswählen).
In das directory Task_B wechseln:
cd Task_BKompilieren über
make(bzw. für das funktionierende Spiel in Unterverzeichnisworking_gameeinmakeaufrufen)Starten über
./pong
Der Code als Grundlage für die Task ist in diesem gitlab zu finden.
Eine sehr gute Referenz bietet https://cppreference.com/ und die C++ Übersicht an der Uni.
Ziele der Aufgaben#
Kennenlernen des Model-View-Controll Pattern
Anwenden einer einfachen graphischen Darstellungs-Library
Struktur von Programmen verstehen
Wiederholen von grundlegenden Elementen zum Prozessfluss
Grundlegende Struktur#
Die einzelnen Teilaufgaben beschäftigen sich jeweils mit den unterschiedlichen Komponenten des MVC Patterns angewendet im Computerspiel Pong. Vorweg gestellt das aufrufende main Programm und zugehörige Makefile.
Dazu wird im MVC häufig ein observer genutzt. Hierfür wird ebenfalls der Header unten angegeben.
#include <ncurses.h>
#include <stdlib.h>
#include <iostream>
#include "model_simulator_pong.h"
#include "view_console.h"
#include "controller_console.h"
int main() {
PongModel* pong = new PongModel();
ConsoleView* view = new ConsoleView(pong);
ConsoleController* controller = new ConsoleController(pong);
//std::cout << pong->getBallPosition() << std::endl;
wchar_t ch = '\0';
while(ch != 'q') {
ch = controller->getInput();
pong->simulate_game_step();
}
delete pong;
delete view;
return 0;
}
#ifndef OBSERVER_H_ // header guard to prevent multiple inclusions of the header file
#define OBSERVER_H_
#include <vector> // include the vector standard library, which will be used to store pointers to observers
class Observer // define the Observer class
{
public:
virtual void update() = 0; // declare a pure virtual function called update(), which will be implemented by derived classes
};
class Observable // define the Observable class
{
std::vector<Observer*> observers; // private vector to store pointers to registered observers
public:
void addObserver(Observer* observer); // public function to add an observer to the vector of registered observers
void notifyUpdate(); // public function to notify all registered observers that an update has occurred
};
#endif // end of header guard and file
CXX := c++
CXXFLAGS := -Wall -std=c++20
# Contain path for any includes (headers)
# Depending on your platform: Include a path to boost, on linux should be
# /usr/local/include, on mac could be /opt/homebrew/include
INCLUDES := -I./include
# Contains libraries we need to (-L is directory search path, -l is lib)
LDFLAGS = -L/usr/local/lib
LDLIBS = -lncurses
SRCDIR := ./src
PONG_OBJECTS := controller_console.o model_simulator_pong.o observer.o view_console.o main.o
pong: $(PONG_OBJECTS)
$(CXX) $^ -o $@ $(LDLIBS)
%.o: $(SRCDIR)/%.cpp
$(CXX) $(INCLUDES) $(CXXFLAGS) -c $^ -o $@
clean:
rm *.o pong
make
./pong
Anweisungen
Machen sie sich einmal mit dem main-Programm vertraut und
mit der Schnittstelle des Observer.
Danach gehen sie die Teilaufgaben einzeln durch.
Pong#
Pong ist ein frühes klassisches Videospiel, das in den 1970er Jahren von Atari entwickelt wurde. Es ist ein einfaches Spiel angelehnt an Tischtennis, bei dem zwei Spielende virtuelle Schläger steuern, um einen Ball hin und her zu schlagen und so Punkte zu erzielen. Der Spielende mit den meisten Punkten am Ende des Spiels gewinnt.
Das Spiel wird auf einem zweidimensionalen Spielfeld mit einer horizontalen Mittellinie und einem Ball in gespielt. Jeder Spielende steuert einen Schläger, der auf der linken oder rechten Seite des Spielfelds vertikal bewegt werden kann. Das Ziel des Spiels ist es, den Ball so zu schlagen, dass dieser vom Gegenspieler nicht mehr erreicht wird.
Ein Spielender erhält einen Punkt, wenn der Gegenspieler den Ball nicht zurück spielen kann. Das Spiel endet, wenn eine bestimmte Anzahl von Punkten erreicht wurde.
Obwohl Pong ein einfaches Spiel ist, war es revolutionär für seine Zeit und hat den Grundstein für viele andere Videospiele gelegt. Es wird auch heute noch von vielen Menschen gespielt und hat in verschiedenen Versionen und Modifikationen über die Jahre hinweg eine große Fangemeinde entwickelt.
Referenzen#
- 1
John Deacon. Model-view-controller (mvc) architecture. Online][Citado em: 10 de março de 2006.] http://www. jdl. co. uk/briefings/MVC. pdf, 2009.
- 2
Erich Gamma, Richard Helm, Ralph Johnson, and John M. Vlissides. Design Patterns: Elements of Reusable Object-Oriented Software. Addison-Wesley Professional, 1 edition, 1994. ISBN 0201633612. URL: http://www.amazon.com/Design-Patterns-Elements-Reusable-Object-Oriented/dp/0201633612/ref=ntt_at_ep_dpi_1.
- 3
H. Graca. MVC and its alternatives. Blogpost on https://herbertograca.com/2017/08/17/mvc-and-its-variants/, 2017. URL: https://herbertograca.com/2017/08/17/mvc-and-its-variants/ (visited on 2023).
- 4
Sheydi Anel Zamudio Lopez, Rene Santaolaya Salgado, and Olivia Graciela Fragoso Diaz. Restructuring object-oriented frameworks to model-view-adapter architecture. IEEE Latin America Transactions, 10(4):2010–2016, 2012.
- 5
Tobias Olsson. Evolution and evaluation of the model-view-controller architecture in games. In Proceedings of ICSE, 4th International Workshop on Games and Software EngineeringAt: Florence, Italy. 05 2015. doi:10.1109/GAS.2015.10.