Embed Size (px)
Citation preview
16 3.2014 www.dotnetpro.de
SCHWERPUNKT
Die Architektur von Windows 8 erlaubt
das Entwickeln von zwei Arten von
Anwendungen: klassische Anwendun-
gen für den Desktop sowie Windows Store Apps.
Letztere basieren auf dem neuen API Windows
Runtime, kurz WinRT genannt. Eine Windows
Store App läuft auf der Kacheloberfläche von
Windows 8, dem Modern UI, und lässt sich über
den Windows Store von Microsoft vertreiben.
Derlei Apps folgen ganz anderen Richtlinien
und Konzepten als die klassischen Desktop-An-
wendungen. Microsoft hat dazu eine Reihe von
Design- und Guidelines definiert, die berück-
sichtigt werden sollten. Deutliche Unterschie-
de zu klassischen Desktop-Anwendungen sind
beispielsweise die Live Tiles, die App Bar oder
das Snapping, also das Andocken der App am
Bildschirmrand.
Der größte Vorteil von Store Apps besteht
darin, dass diese sowohl auf Tablet PC und auf
Windows-8-Desktop-Systemen als auch auf
Windows Phones ausgeführt werden können.
Somit unterstützen Store Apps praktisch alle
Eingabemedien in der WinRT-Welt, dazu zählen
auch Stift- und Touch-Eingaben.
Windows Store Apps entwickeln
Zum Entwickeln von Windows Store Apps ha-
ben Sie unter Visual Studio verschiedene Mög-
lichkeiten:
◼ XAML mit C# oder Visual Basic: Sie entwickeln
wie gewohnt .NET Managed Code und rufen
darin die APIs der Windows Runtime auf.
◼ XAML mit C++: Sie schreiben nativen Code
in C++ und für die Darstellung kommt XAML
zum Einsatz.
◼ HTML/CSS mit JavaScript: Sie implementie-
ren die Logik in JavaScript und nutzen zur
Darstellung HTML/CSS. Mit der WinJS-Libra-
ry werden die Aufrufe der APIs von WinRT
möglich.
◼ DirectX mit C++: Sie erstellen nativen Code in
C++ und verwenden zum Zeichnen DirectX.
Möchten Sie bei der Entwicklung von Store
Apps die Kapazität der Grafik-Hardware für
Multimedia-Apps voll ausschöpfen, so sind Di-
rectX und C++ die erste Wahl. Mit dem Open-
Source-Projekt Cinder C++ entsteht gerade eine
echte Alternative zu DirectX für die Entwicklung
von Windows 8 Store Apps. Das Framework er-
möglicht es, die App als Cross-Plattform-Lö-
sung zu implementieren und somit für mehrere
Betriebssysteme denselben Code zu nutzen.
Cinder
Cinder ist ein plattformübergreifendes Frame-
work, das in Form von C++-Bibliotheken imple-
mentiert ist und jetzt auch – dank tatkräftiger
Mithilfe von Microsoft Open Technologies – Vi-
sualisierungsfunktionen in C++ für Windows
Store Apps zur Verfügung stellt. Microsoft nutzt
bei Store Apps üblicherweise DirectX zum
Rendern grafischer Bildschirminhalte. Cinder
unterstützt dagegen OpenGL als Rendering-
Engine und wird damit auf WinRT zu einer ech-
ten Alternative zu DirectX. Neben WinRT unter-
stützt Cinder Android, iOS und Mac OS X. Der
mit Cinder entwickelte Quellcode kann folglich
mit geringen Änderungen auf all diesen Platt-
formen genutzt werden.
Das Einsatzgebiet von Cinder sind vor allem
moderne Multimedia -Anwendungen, wobei al-
le Arten von Eingabemöglichkeiten unterstützt
werden. Eindrucksvolle Beispiele dazu sind
auf der Cinder-Website [1] zu sehen. Im Zu-
sammenhang mit Windows 8 beziehungsweise
WinRT können vor allem grafisch anspruchsvol-
le Apps, wie beispielsweise Spiele, von Cinder
profitieren.
Das Framework steht derzeit in der Version
0.8.6 für Visual Studio 2012 zur Verfügung. Es
macht einen stabilen Eindruck, hat Entwick-
lungspotenzial und kann für erste Evaluierungs-
schritte benutzt werden. Um Cinder zusammen
mit WinRT nutzen zu können, ist der genannte
aktuelle Entwicklungsstand erforderlich, der
allerdings bei Redaktionsschluss noch nicht
als Binär-Release zur Verfügung stand, sondern
lediglich in Form eines Developer-Release als
Quellcode über GitHub zu beziehen war [2].
Kenntnisse
Da es beim Entwickeln von Store-Apps mit Cin-
der (wie auch bei DirectX und C++) einige Hür-
den zu überwinden gibt, sollten Sie sich zuvor
mit der Windows-Programmierung sowie C++
vertraut machen. Sie werden hier mit vielen
Features des Betriebssystems konfrontiert, wie
zum Beispiel der Speicher- und Ressourcenver-
Das Open-Source-Framework Cinder
OpenGL statt DirectXDas Open-Source-Projekt Cinder ist eine quelloffene Alternative, wenn es um die Entwicklung von Windows 8 Store Apps
geht. Die C++-Bibliothek nutzt OpenGL anstelle von DirectX zum Generieren von 2-D- und 3-D-Grafik.
Auf einen Blick
Daniel Basler ist Senior Con-
sultant für Microsoft-Technologi-
en und beschäftigt sich darüber
hinaus auch mit Datenbanken
und Compiler-Bau.
Inhalt
▸ Das Open-Source-Framework
Cinder.
▸ Windows 8 Store Apps mit
Cinder entwickeln.
▸ Beispielcode einer Cinder-App.
dnpCode A1403Cinder
SCHWERPUNKT
www.dotnetpro.de 3.2014 17
[Abb. 1] Das GitHub-
Repository von
Cinder.
[Abb. 2] Die Ord-
nerstruktur der
Sourcen.
[Abb. 3] Die Projektstruktur des Frameworks.
waltung und der Schnittstelle zur Grafik-
Infrastruktur.
Weiterhin ist es von Vorteil, wenn Sie
Zeiger und Verweise, Ereignisse und
Rückrufe in C++ gut beherrschen. Auch
Kenntnisse in der Verwaltung von System-
ressourcen und allgemeine Grafikbegriffe
und -konzepte sind auf jeden Fall hilf-
reich. Dafür werden Sie mit leistungsstar-
ken, performanceorientierten und hard-
warebeschleunigten Bibliotheken für das
Rendern von 3-D-Grafiken belohnt.
Systemvoraussetzungen schaffen
Um das hier vorgestellte Beispiel umzuset-
zen, benötigen Sie Windows 8 und Visual
Studio 2012 (die kostenlose Express-Ver-
sion genügt). Weiterhin die aktuelle Ent-
wicklungsversion von Cinder C++, die bei
GitHub unter [2] geladen werden kann.
Da sich das Projekt noch in einem frü-
hen Stadium befindet und regelmäßig
weiterentwickelt wird, lohnt es sich, ein
GitHub-Repository (Abbildung 1) anzu-
legen. Damit bleiben Sie immer auf dem
aktuellen Stand des Projekts. Zum Testen
genügt aber der Download des Developer-
Branches im Zip-Format.
Das richtige Installationspaket von Git
für Ihr Betriebssystem finden Sie auf der
Webseite [3]. Wer Visual Studio ab der
Professional-Version einsetzt, kann auch
die dort vorhandene Git-Integration da-
für nutzen. Alternativ lässt sich auch der
Stand-alone-Git-Client für Windows ein-
setzen, den Download finden Sie unter [4].
Arbeiten mit Cinder
Nachdem Sie das benötigte Repository
eingerichtet beziehungsweise die Zip-Da-
tei entpackt haben, können Sie sich einen
Überblick über die Projektstruktur von
Cinder verschaffen.
Abbildung 2 zeigt die Bibliotheken des
Projekts.
Sie finden dort sowohl Lösungen für
Xcode als auch einen Ordner namens VC
2012. Dieser bietet Unterstützung für Vi-
sual Studio 2012 und OpenGL und ist so-
mit auf den Desktop-Modus beschränkt.
Der Ordner VC2012_winrt enthält da-
gegen die Dateien für das Entwickeln von
Windows Store Apps und wird hier ver-
wendet.
Cinder-Library erstellen
Das Cinder-Projekt lässt sich über die So-
lution ...\vc2012_winrt\cinder.sln in Visual
Studio 2012 aufrufen.
In dem daraufhin von Visual Studio ge-
zeigten Projektordner befinden sich vier
zentrale Verzeichnisse (siehe dazu Abbil-
dung 3):
◼ Der Ordner Externe Abhängigkeiten ent-
hält Header und Programmdateien der
externen Referenzen.
◼ Im Ordner Header Files befinden sich
alle Header-Dateien des aktuellen Pro-
jekts. Also in diesem Fall das Cinder
Framework.
18 3.2014 www.dotnetpro.de
SCHWERPUNKT Das Open-Source-Framework Cinder
Listing 1
Beispiel einer Cinder-App.
#include "cinder/app/AppBasic.h"
#include "cinder/app/RendererDx.h"
#include "cinder/ImageIo.h"
#include "cinder/Font.h"
#include "cinder/dx/dx.h"
#include "cinder/dx/DxTexture.h"
using namespace ci;
using namespace ci::app;
using namespace std;
class BasicApp : public AppBasic {
public:
void setup();
void mouseMove(MouseEvent event);
void update();
void draw();
dx::TextureRef mTexture;
Font mFont;
Vec2f mMousePosition;
Vec2f mFollowerPosition;
};
void BasicApp::setup() {
mFont = Font("Arial", 18);
mTexture = dx::Texture::create(loadImage(loadAsset("bkg.jpg")));
mMousePosition = getWindowCenter();
mFollowerPosition = getWindowCenter();
}
void BasicApp::mouseMove(MouseEvent event) {
mMousePosition = event.getPos();
}
void BasicApp::update() {
Vec2f animationStep = (mMousePosition - mFollowerPosition)*.2f;
mFollowerPosition += animationStep;
}
void BasicApp::draw() {
// This clears the screen and sets it to a background color
dx::clear(Color(0.0f, 0.0f, 0.0f), true);
dx::color(Color::white());
dx::enableAlphaBlending();
if(mTexture)
dx::draw(mTexture, Rectf(getWindowBounds()));
Vec2f radius(8.0f, 8.0f);
Vec2f smallerRadius(6.0f, 6.0f);
dx::color(ColorA(1.0f, 1.0f, 1.0f, 0.3f) );
dx::drawLine(Vec2f(0, mMousePosition.y), Vec2f(getWindowWidth(),
mMousePosition.y));
dx::drawLine(Vec2f(mMousePosition.x, 0), Vec2f(mMousePosition.x,
getWindowHeight()));
dx::color(Color::white());
dx::drawSolidRect(Rectf(mMousePosition - radius,
mMousePosition + radius));
dx::color(Color(1.0f, 0.4f, 0.8f));
dx::drawSolidRect(Rectf(mFollowerPosition - smallerRadius,
mFollowerPosition + smallerRadius));
dx::color(ColorA(0.0f, 1.0f, 1.0f, 0.5));
dx::drawStrokedCircle(Vec2f(40.0f, 90.0f), 30.0f, 7);
dx::drawSolidCircle(Vec2f(40.0f, 90.0f), 20.0f, 7);
dx::drawSolidTriangle(Vec2f(40.0f, 144.0f),
Vec2f(14.0f, 196.0f), Vec2f(66.0f, 196.0f));
dx::drawStrokedRect(Rectf(10.0f, 140.0f, 70.0f, 200.0f));
std::stringstream s;
s << "Framerate:" << getAverageFps();
dx::drawString(s.str(), Vec2f(10.0f,10.0f),
Color(1.0f, 1.0f, 1.0f), mFont);
}
CINDER_APP_BASIC(BasicApp, RendererDx)
◼ Im Ordner Resource Files werden alle
für das Projekt erforderlichen Ressour-
cen-Dateien abgelegt. Der Ordner ist im
Cinder-Projekt zunächst leer.
◼ Der Ordner Source Files enthält alle
Source-Code-Dateien, die für das Pro-
jekt benötigt werden.
Nach dem Build-Vorgang ist die Cin-
der-Bibliothek für Ihre eigenen Windows-
Store-Projekte einsatzbereit. Sie muss
dann nur noch in das Projekt eingebun-
den werden.
Beachten Sie dabei bitte die gesetzten
Visual-Studio-Einstellungen des Projekts
und verwenden Sie die Cinder-Bibliothek
in Ihren Projekten nur in der (noch nicht
verfügbaren) offiziellen Release-Version.
Die erste App mit CinderAls Beispiel steht Ihnen unter ...\Cinder-
dev\samples\_directx\winrtBasic das
Projekt winrtBasic zur Verfügung. Öffnen
Sie die Solution mit Visual Studio. Sie
finden in diesem Beispiel die allgemei-
ne Struktur von mit Cinder entwickelten
Windows 8 Store Apps.
Um den Umgang damit zu testen, kön-
nen Sie die Beispiel-App direkt starten.
Sie enthält bereits einige vorgefertigte
Möglichkeiten für den direkten Zugriff auf
Funktionen des Frameworks.
Der Aufbau der App ist sehr einfach ge-
halten. Nach dem Einbinden der Include-
Dateien und dem benötigten Namespace
folgen schon die erforderlichen Methoden
Setup, mouseMove, update und draw. Der
C++-Code des Cinder-Beispiels ist in Lis-
ting 1 zu sehen.
Der Code zeigt den grundlegenden Auf-
bau des Frameworks sehr gut, etwa das La-
den eines Bildes und dessen Verwendung
als Textur. Er zeigt ebenso den Umgang
mit Maus-Events und die Umsetzung des
Update-Aufrufs.
Mit dieser Grundausstattung sind Sie
als Entwickler in der Lage, Windows 8
Store Apps mit Cinder zu erstellen.
Die weiteren Beispiele führen tiefer
in die Funktionalitäten von Cinder ein,
beispielsweise die Solution winrt Shader.
Shader sind kleine Programme, welche
die Graphics Processing Unit (GPU) aus-
führt. Hiermit wird zum Beispiel die Syn-
tax-Hervorhebung in Apps realisiert.
SCHWERPUNKT
www.dotnetpro.de 3.2014 19
[Abb. 4] Build-Konfiguration unter Visual Studio 2012.
Debuggen unter Windows 8 RTVisual Studio 2012 kann unter WinRT
nicht ausgeführt werden. Sie benötigen
deshalb für das Debugging spezielle Re-
mote Tools für Visual Studio 2012 ARM,
die unter [5] zum Download angebo-
ten werden. Außerdem muss die Build-
Konfiguration des Projekts entsprechend
angepasst werden (Abbildung 4). Legen
Sie daher die Plattform sowie die all-
gemeinen Angaben für Ihr Projekt fest.
Weiterhin müssen Sie im Konfigurations-
Unterpunkt Debugging den zu startenden
Debugger eintragen.
Fazit
Die C++-Bibliothek Cinder kann bei der
Entwicklung von Windows Store Apps ei-
ne gute Unterstützung leisten, vor allem
wenn die Apps für mehrere Plattformen
entwickelt werden sollen. Das Projekt hat
allerdings noch ein paar Kinderkrankhei-
ten. Somit gibt es für die Entwickler von
Cinder noch ein wenig Arbeit, bisher fehlt
auch noch der Support für XAML. Trotz-
dem bietet Cinder eine gute Möglichkeit,
Multimedia-Anwendungen und komplexe
Spiele für die unterstützten Plattformen zu
erstellen. Man sollte das Projekt auf jeden
Fall im Auge behalten. [bl]
[1] Cinder, http://libcinder.org/
[2] Aktueller Entwicklungsstand von Cinder,
www.dotnetpro.de/SL1403Cinder1
[3] Installationspaket GitHub, www.git-scm.com
[4] Git for Windows Client,
www.dotnetpro.de/SL1403Cinder2
[5] Remotetools für Visual Studio 2012,
www.dotnetpro.de/SL1403Cinder3
DOTNETPRO ONLINEdotnetpro.de
facebook.de/dotnetpro
twitter.com/dotnetpro_mag
gplus.to/dotnetpro
Top-Informationen für den .NET-Entwickler. Klicken. Lesen. Mitreden.
