Excel Ticker

Excel Ticker

by Mourad Louha (Inhaber) & Andreas Entenmann

Microsoft Visual Studio LightSwitch Beta – Tutorial für Einsteiger

| 4 Kommentare

Seit dem 23. August 2010 ist die englische Beta-Version zu „Microsoft Visual Studio LightSwitch“ verfügbar, ein Produkt, auf das ich mit Spannung gewartet hatte. Dieser Artikel dreht sich somit weniger um Office & Co. – obwohl doch nicht so ganz, denn in späteren Versionen von LightSwitch ist eine Anbindung an Access Datenbanken vorgesehen. Ausserdem kann LightSwitch bereits jetzt schon Daten nach Excel exportieren und einen SharePoint Server als Datenquelle ansprechen.

Microsoft Visual Studio LightSwitch

Die Frage, die sich nun stellt, wofür und für wen ist denn LightSwitch gedacht? Hier möchte ich gerne aus Tom Wendel’s deutschen Artikel „What is Visual Studio LightSwitch“ zitieren, der übrigens auch an der Entwicklung des Produktes mitgewirkt hat:

„LightSwitch soll dem Entwickler (Zielgruppe hier vorwiegend die armen Jungs, die in Firmen oft die Doppelrolle des IT-Pros/Devs/Lageristen/Hausmeister haben) das Leben etwas einfacher machen, wenn es darum geht Standard-Software zu erstellen. Ich denke da zurück an meine Freelancer-Zeit und kann sagen, dass ich knapp 90% meine Applikationen, die ich da entwickelt habe, mit LightSwitch erschlagen hätte. Also auch interessant für die Selbständigen, die sich mit diesen Alltagstools in internen Netzwerken auseinander setzen. Halten wir mal fest, dass man mit LightSwitch Software erstellt, für die praktisch kein Budget / Zeitfenster da ist und deren Funktionalität im Vordergrund steht. Und das ist auch schon die einzige Gemeinsamkeit zu Access.“

Um LightSwitch zu installieren, kann ein entweder ein DVD ISO Abbild oder ein Web-Installer verwendet werden, der während der Installation die benötigten Dateien aus dem Internet herunterlädt. Ich habe mich für letzteres entschieden, da dieser aus meiner Sicht die einfachere Variante darstellt. Da LightSwitch ja nun ein Addon zu Visual Studio 2010 darstellt, sollte dieses logischerweise auf dem Zielrechner bereits installiert sein.

Microsoft Visual Studio LightSwitch

Nach dem Download des Installers und dessen Aufruf, sind zunächst die Lizenzbestimmungen zu akzeptieren. Anschließend kann zwischen einer direkten oder benutzerdefinierten Installation gewählt werden, wobei letztere automatisch den Installationsordner von Visual Studio 2010 herausgesucht hatte und dieser auch nicht geändert werden konnte.

Microsoft Visual Studio LightSwitch

Das Installationsprogramm lädt anschließend alle erforderlichen Dateien herunter und installiert die erforderlichen Komponenten. Das ging bei mir relativ schnell und problemlos von statten. Zum Abschluss bietet der Installer optional an, das Programm direkt zu starten, worauf ich jedoch verzichtet hatte.

Neues LightSwitch Projekt anlegen

In Visual Studio 2010 ist nach der Installation die neue Projektvorlage „LightSwitch“ verfügbar, wobei zudem zwischen einem Visual Basic oder einem Visual C# Projekt gewählt werden kann. Das Anlegen des Projektes ist somit ganz einfach: einen Namen für das Projekt vergeben, Ok anklicken, fertig.

Microsoft Visual Studio LightSwitch

Visual Studio legt dann das Projekt an und bietet Ihnen eine Einstiegsseite mit den zwei Schaltflächen „Create new table“ und „Attach to external database“ an. Erstere erlaubt eine neue Tabelle im Entwurfsmodus zu erstellen und die zweite Möglichkeit, eine Verbindung zu einem Server (z.B. SQL Server oder SharePoint Server) herzustellen.

Microsoft Visual Studio LightSwitch

Tabellen in LightSwitch entwerfen

Zur Demonstration einiger Features von LightSwitch habe mir ein einfaches Beispiel überlegt. Nehmen wir an, wir hätten die drei Datenbanktabellen „Artikel“, „Umsatz“ und „Verkäufer“ in unserer Datenbank. Erste Tabelle enthält eine Liste von Verkaufsartikeln; als Felder sind die Artikelnummer, die Artikelbezeichnung, ein Datum zur Erstanlage des Artikels und der Nettopreis definiert. Die Tabelle zu den Verkäufern enthält Felder für den Namen der Person, ein eindeutiges Kürzel sowie optionale Kontaktdaten. In der Tabelle zum Umsatz soll die Möglichkeit bestehen, den Artikel und den Verkäufer auszuwählen, ein Verkaufsdatum anzugeben und nach Eingabe einer Mengenangabe den Umsatz inklusive der Umsatzsteuer zu errechnen.

Microsoft Visual Studio LightSwitch

Sobald auf die Schaltfläche „Create new table“ geklickt wurde, legt LightSwitch eine neue Tabelle an und ordnet diese dem Eintrag „ApplicationData“ unter „Data Sources“ zu. Um die Tabelle umzubenennen kann auf den Titeltext in der blauen Titelzeile geklickt werden. Alternativ kann der Name aber auch rechts in der Palette zu den Eigenschaften eingegeben werden. Und LightSwitch legt auch automatisch einen Namen für den Plural der Tabelle an, den ich hier aber in „Artikelliste“ statt „ArtikelSet“ umbenannt habe. Das Anlegen neuer Felder ist intuitiv; einfach in die Zeilen der Tabelle klicken, Name und Datentyp vergeben, fertig. Die Reihenfolge der Felder kann auch nachträglich durch Ziehen und Ablegen mit der Maus festgelegt werden.

Wenn nötig, können pro Datentyp weitere Eigenschaften des Feldes im Eigenschaftsfenster (rechts) festgelegt werden. Beispielsweise für das Feld „Anlagedatum“, wo in den Eigenschaften unter „Validation“ ein Gültigkeitsbereich für das Datum angegeben werden kann. Diese habe ich für dieses Feld statt von „01.01.1753 – 31.12.9999“ auf „01.01.2010 – 31.12.2099“ gesetzt.

In derselben Art und Weise, wie zuvor beschrieben, können die Tabelle zu den Verkäufern und dessen Felder angelegt werden.

Die Tabelle zum Umsatz sieht ein Feld zur Auswahl eines Artikels vor, somit sollte eine Beziehung zwischen den beiden Tabellen erstellt werden. Diese lässt sich über die, in folgender Abbildung im oberen Bereich rot umrahmte, Schaltfläche „Relationship“ sehr komfortabel bewerkstelligen.

Microsoft Visual Studio LightSwitch

Es öffnet sich ein neues Fenster, in welchem die Tabelle „Artikel“ und der Typ der Beziehung unter „Multiplicity“ ausgewählt werden können. Pfiffig finde ich die Hinweise im unteren Bereich des Fensters, die über die Bedeutung und die Auswirkungen des gewählten Beziehungstyps auf die Datenbank informieren. In ähnlicher Weise kann dann das Feld zur Auswahl des Verkäufers erstellt werden. Anschließend sind noch die Felder zur Angabe der Menge, zur Auswahl Umsatzsteuer und zur Berechnung des Gesamtpreises anzulegen.

Sobald eine Beziehung von einem Feld zu einer anderen Tabelle angelegt wurde, wird dies in der Entwurfsansicht durch eine vereinfachte Darstellung der verknüpften Tabelle visualisiert. Ein Doppelklick auf dieses Symbol öffnet diese dann wiederum in der Entwurfsansicht.

Microsoft Visual Studio LightSwitch

Für die Umsatzsteuer habe ich drei vordefinierte Auswahlmöglichkeiten vorgesehen, die über einen Klick auf den Eintrag „Choice List“ im Eigenschaftsfenster in einem extra Dialog erstellt werden können.

Ansichten in LightSwitch erstellen

Nachdem die Tabellen und Beziehungen erstellt wurden, ist es nun sinnvoll, eine Benutzeroberfläche zur Eingabe von Daten zu entwerfen. Zunächst brauchen wir Ansichten, um die Artikel und Verkäufer einzupflegen. Wenn auf die Schaltfläche „Screen“ geklickt wird, öffnet sich ein neues Fenster, in welchem 5 Auswahlmöglichkeiten für eine Darstellung der Eingabemasken angeboten werden. Ich hatte, bevor ich den Artikel an dieser Stelle fortgesetzt hatte, zunächst von jeder dieser Varianten eine Ansicht erstellt und im Debug-Modus ausprobiert. Zu Demonstrationszwecken schien mir dann der Dialog „List and Details Screen“ am besten geeignet.

Microsoft Visual Studio LightSwitch

Der Ansicht sollte ein sinnvoller Name zugewiesen werden, der übrigens eindeutig sein muss. LightSwitch macht auch hier einen Vorschlag, da aber dieser in Englisch ist, habe ich diesen umbenannt. Ausserdem sollte der Ansicht die Tabelle zugewiesen werden, dessen Daten man editieren möchte. Schauen wir uns mal an, wie der Dialog in der Anwendung dann aussieht. Dafür einmal F5 drücken (oder im Hauptmenü „Debuggen“ von Visual Studio 2010 den Eintrag „Debuggen starten“ wählen), um den Debug-Modus von Visual Studio zu starten und die Anwendung auszuführen.

Microsoft Visual Studio LightSwitch

Visual Studio startet vor der Ausführung der Anwendung den internen LightSwitch Server; eine Firewall sollte somit auch Verbindung zum Localhost erlauben. Das Ergebnis ist in der oberen Abbildung zu sehen. Wenn auf die Schaltfläche „Add…“ geklickt wird, erscheint bei dieser Dialogform ein Extra Fenster, um den neuen Artikel anzulegen. Die Eingabefelder sind auch genauso konfiguriert, wie es die Datenbankfelder von ihren Einstellungen her erlauben. Beispielsweise muss die Artikelnummer eine Zahl sein und darf auch nicht leer sein. Ansonsten blendet LightSwitch eine entsprechende Fehlermeldung ein. Änderungen sollten in der Datenbank dann mit „Save“ übernommen werden.

Ein kleiner Hinweis: als ich mehrere Ansichten zu den Artikeln definiert hatte und in einer dieser Ansichten neue Artikel angelegt hatte, wurden die neuen Artikel nicht in den anderen Ansichten angezeigt bzw. aktualisiert. Da half leider auch kein Klick auf den „Refresh“ Button. Das erstmalige Laden der Ansichten bzw. die Aktualisierung dauerte auf meinem Rechner verhältnismäßig lange.

Microsoft Visual Studio LightSwitch

In der oberen Abbildung ist der Dialog zu sehen, wie er im Designmodus erscheint, der über einen Doppelklick auf den Baumeintrag rechts oben aufgerufen werden kann. Der gewählte Dialog besteht aus zwei Spalten (links die Liste mit den Artikeln und rechts die Details zum gewählten Artikel). Dieses spiegelt sich in der Designansicht über die zwei Baumeinträge „Left Column“ und „Right Column“ wieder. In diesen sind dann wiederum hierarchisch weitere Steuerelemente angeordnet; zum Beispiel Schaltflächen zum Hinzufügen, Bearbeiten oder Löschen von Datensätzen. Direkt rechts neben dem Namen des Steuerelementes sind kleine Pfeile zu finden, die die Auswahl des Steuerelementtyps bzw. der -gruppe ermöglichen. Beispielsweise könnte man statt der Artikelliste in Listenform (List) auch eine Tabelle wählen (Grid). Die Ansicht passt sich dann automatisch an. Zu jedem Steuerelement können zudem auch spezifische Eigenschaften im Fenster rechts gesetzt werden. Alle diese Eigenschaften aufzuzählen oder Steuerelemente durchzugehen, würde den Rahmen des Artikels jedoch deutlich sprengen.

Ein Punkt sollte aber nicht unerwähnt bleiben: beim Anlegen des Dialoges wurde automatisch das Element „ArtikelCollection“ angelegt, welches auch links im Screenshot zu sehen ist. Die Collection entspricht letzten Endes dem kompletten Inhalt der Artikeltabelle. Es lassen sich aber auch Filter definieren. Ich hatte in meinem Beispiel im Debug-Modus drei Artikel angelegt: „Computersoftware“ mit der Artikelnummer 1000, „Computerbuch“ mit der Nummer 2000 und „Computermagazin“ mit der Nummer 3000. Wenn ich mir vorstelle, alle Artikel mit einer Nummer zwischen 2000 und 2999 wären Bücher, könnte ich eine gefilterte Ansicht erstellen, die nur die Bücher aufführt. Links oben neben „ArtikelCollection“ ist eine Schaltfläche „Edit Query“ zu finden, die zu einer Bearbeitungsansicht der Abfrage führt.

Microsoft Visual Studio LightSwitch

Es kann dann, auch wiederum sehr komfortabel, ein Filter erstellt werden, der die Anzeige der Artikelnummer auf das gewünschte Werteintervall begrenzt. Ein Sortierkriterium kann ebenfalls festgelegt werden. Und komplexere Filter lassen sich zudem parametrisieren.

Berechnungsfeld in LightSwitch erstellen

Die Tabelle zum Umsatz enthält das Feld „Gesamtpreis“, welches, je nach Mengenangabe und Auswahl der Umsatzsteuer den Gesamtpreis anzeigen soll. In der Entwurfsansicht ist die Schaltfläche „Computed Property“ zu sehen, die ein neues Feld an die Feldliste anhängt und als dynamisches Berechnungsfeld markiert. Nachträglich kann aber auch ein Haken im Eigenschaftsfenster gesetzt werden.

Microsoft Visual Studio LightSwitch

Um die Berechnung durchzuführen, müssen wir ein klein wenig Code erstellen. Über einen Klick auf „Edit Method“ wird ein Codefenster geöffnet. Dort findet man eine vorgefertigte Prozedur vor, die nur noch mit der Anweisung zur Berechnung gefüllt werden müsste.

Microsoft Visual Studio LightSwitch

Das Berechnen des Gesamtpreises ist nicht sonderlich schwer: Gesamtpreis = Menge * Nettopreis * (1 + Umsatzsteuer / 100). Danach verblieben noch die Erstellung der Ansicht zur Eingabe des Umsatzes und das Testen im Debugger.

Microsoft Visual Studio LightSwitch

Die Tabelle kann auch nach Excel exportiert werden, dazu braucht nur die Schaltfläche „Export to Excel“ angeklickt zu werden. LightSwitch erkennt momentan jedoch nicht eine geöffnete Excel Instanz, sondern öffnet eine neue. Und hatte bei mir immer Excel 2003 geöffnet, obwohl auch 2007 und 2010 installiert sind. Die Titel der Spalten werden ebenfalls mitexportiert.

Weitere Beispiele für LightSwitch

Unter der Adresse http://code.msdn.microsoft.com/lightswitch ist meines Erachtens eine gelungene englischsprachige Beispielanwendung zu finden, die viele weitere der Möglichkeiten von LightSwitch vorstellt und sich prima zum Üben eignet. Zudem ist ein Tutorial zum Projekt ebenfalls auf MSDN zu finden. Weitere Links sind am Ende des Artikels aufgeführt.

Microsoft Visual Studio LightSwitch

Fazit

Dieses kleine Tutorial zum Einstieg in LightSwitch deckt sicherlich nur einen kleinen Teil der Fähigkeiten von dem Programm ab. Was ich aber bislang gesehen habe, gefällt mir außerordentlich gut. Ich kann mir durchaus vorstellen, das Tool beispielsweise zum Prototyping zu verwenden oder ein paar Interfaces zu Datenbanken zu erstellen; wenn nicht gar komplette Anwendungen. Abstürze oder ähnliches sind bei mir während des Testens nicht vorgekommen. Eine kleine Merkwürdigkeit trat auf, nämlich dass die Liste zur Umsatzsteuer mir das Feld immer mit einer 3 initialisiert hatte. Insgesamt freue ich mich aber schon sehr auf weitere Versionen von LightSwitch.

Ähnliche Artikel zu diesem Beitrag:

4 Kommentare

  1. vertragen sich den LightSwitch beta – in englisch – mit dem VS 2010 deutsche Version ???

  2. Hallo Wolf,

    ich hatte LightSwitch bei mir auf VS Pro 2010 Deutsch installiert und keine Probleme festgestellt. Insofern würde ich Deine Frage erst mal mit “Ja” beantworten.

    Gruß

  3. Hallo,

    leider bekomme ich nach dem Drücken von F5 kein Eingabefenster.
    Die Applikation läuft also nicht.

    Habe die Firewall ausgeschaltet, aber ohne Erfolg.
    Der interne Webserver von Lightswitch (Ver. 2011) zeigt nur eine leere Seite an.

    Woran kann es liegen; habt Ihr Erfahrungswerte diesbzgl.?

    Grüße

    Maja

  4. Hallo Maja…

    leider kann ich Dir dazu nicht viel sagen; Du könntest aber die Frage in einem Forum stellen, zum Beispiel hier http://social.msdn.microsoft.com/Forums/de-de/visual_studiode/threads

    Grüße :-)

Hinterlasse eine Antwort

Pflichtfelder sind mit * markiert.

*