Fröhliche Weihnachten!

Ich wünsche allen ein fröhliches, besinnliches und friedliches Weihnachten 2010!

Größenveränderung eines Grid mithilfe von Thumb Steuerelementen

In der Expression Gallery findet Ihr ein neues Beispielprojekt für ein Grid, das durch Klicken, Halten und Ziehen in seiner Größe verändert werden kann. Zum Einsatz kommen dabei Thumb-Steuerelemente. Hier erstmal das lebendige Beispiel:

VB.NET: Teilermenge einer positiven ganzen Zahl berechnen

Am Wochenende habe ich für ein kleines Tool, an dem ich gerade arbeite, eine Funktion geschrieben, die die Teilermenge einer positiven ganzen Zahl berechnet. Also z.B. alle Teiler der Zahl 465289 sind die Zahlen 1, 11, 42299 und 465289. Für alle, die das mal brauchen gibt es hier die Funktion:

WP7: Den Text-Cursor bei der Eingabe von Text exakt positionieren

Dies ist ein kurzer Tipp für alle, die schon immer wissen wollten, wie man den Text-Cursor bei der Eingabe von Text in einer Windows Phone-Anwendung exakt positionieren kann.

VB.NET: Sortieren einer Dictionary(Of TKey, TValue)-Auflistung

Dies ist ein kurzer, aber vielleicht recht nützlicher Artikel über das Sortieren eines Dictionary(Of TKey, TValue). Als Teil eines kleineren Projekts war es erforderlich, ein Dictionary mit Schlüssel- und Wert-Paaren zu sortieren und abhängig von der Auswertung des Werts nur den Schlüssel (vom Typ String) zurückzugeben.

Der folgende Quellcode-Ausschnitt zeigt beispielhaft, wie es funktioniert:

WP7: Glossy TextBlock Custom Control

Ich habe ein GlossyTextBlock Custom Control für Windows Phone einschließlich Quellcode in der Expression Gallery zum Download bereitgestellt. Dieses Steuerelement ermöglicht die Darstellung von Text mit einem Schatten. So kann beispielsweise Text mit einem visuellen Glanzeffekt dargestellt werden.

How To: Neupositionieren von TextBlock- und TextBox-Steuerelementen beim Wechsel zwischen Portrait- und Landscape-Orientierung (WP7)

Dieser Artikel beschreibt Schritt-für-Schritt, wie man in einer Windows Phone 7-Anwendung mit TextBlock- und TextBox-Steuerelementen ein einigermaßen konsitentes Layout beibehält, wenn ein Wechsel von der Portrait- zur Landscape-Orientierung erfolgt.

WP7: Wechsel von Portrait- zu Landscape-Orientierung bei Layout mit größeren TextBlock- und TextBox-Steuerelementen

Das Layout einer Windows Phone 7-Anwendung kann darauf reagieren, je nach dem wie der Benutzer das Gerät in der Hand hält. Wenn das Gerät senkrecht gehalten wird, befindet es sich in der Portrait-Orientierung. Wenn das Gerät waagerecht gehalten wird, befindet es sich in der Landscape-Orientierung. Bei einem Layout mit mehreren TextBlock- und TextBox-Steuerelementen braucht man für beide Situationen eine möglichst konsistente Design-Lösung.

Visual Basic für Windows Phone Developer Tools - RTW erschienen

Gute Nachricht für alle VB-Programmierer, die für Windows Phone 7 programmieren wollen. Visual Basic für Windows Phone Developer Tools - RTW steht zum Download bereit.

Die Visual Basic Quellcode Beispiele für Windows Phone gibt es hier.

Es gibt zwar noch keine VB-Integration in Expression Blend 4 für Windows Phone. Visual Basic Windows Phone-Anwendungen werden in Expression Blend für Windows Phone leider noch nicht unterstützt. Das ist immernoch ein stattlicher Nachteil, aber immerhin kann jetzt schonmal in Visual Studio 2010 (>= Professional) losgelegt werden.

Eine Unterstützung für XNA Projekte ist ebenfalls noch unterentwickelt. Mit dem Release können zwar Visual Basic Silverlight Anwendungen für Windows Phone 7 erstellt werden, es gibt aber noch keine Projektvorlagen für XNA.

Für die Installation muss die CTP Version vorher deinstaliiert werden.

Seitenaufrufanalyse für eine reine Silverlight 4-Navigationsanwendung mit dem Microsoft Silverlight Analytics Framework und Google Analytics

Vor etwas längerer Zeit hatte ich einen Thread im Deutschen MSDN Silverlight-Forum mit der Frage nach einem Seitenzähler für eine reine Silverlight-Anwendung eingestellt. Oliver Michalski gab zu dieser Frage den entscheidenden Hinweis auf das Microsoft Silverlight Analytics Framework (MSAF) und damit die Antwort auf meine Frage.

Ich habe mich also eingelesen und schließlich mit Hilfe des MSAF und Google Analytics als Service-Anbieter eine Seitenaufruf-Analyse in eine reine Silverlight 4 Navigationsanwendung implementiert. Für alle, die auch eine Lösung für diese Anforderung suchen, beschreibe ich hier kurz, wie das geht. Es ist wirklich total einfach.

How To: Erstellen eines nicht rechteckigen ChildWindow - Teil 2

Dies ist der zweite Teil über das Erstellen eines nicht rechteckigen ChildWindow. In Teil 1 habe ich die grundsätzliche Vorgehensweise beschrieben, also welche Veränderungen an der Vorlage des ChildWindow vorgenommen werden müssen.

In diesem Teil 2 beschreibe ich, wie man in einem kreisförmigen ChildWindow mit Hilfe eines PathListBox-Steuerelements Inhalt platzieren kann, der zu der runden Form paßt.

How to: Erstellen eines nicht rechteckigen ChildWindow - Teil 1

Dieser Artikel beschreibt Schritt-für-Schritt, wie man ein nicht rechteckiges ChildWindow erstellt. Erstellt wird ein ringförmiges ChildWindow.

Nicht rechteckiges ChildWindow Styling

Gestern abend überlegte ich, wie man die Form eines ChildWindow etwas interessanter und individueller gestalten kann. Es wäre doch schön, ein ChildWindow zu gestalten das nicht rechteckig ist, sondern rund, dreieckig oder eine Herzform hat. Herausgekommen sind zwei neue Beispiele für die Expression Gallery. Das erste Beispiel ist ein dreieckiges ChildWindow. Es war noch etwas experimentell. Beim zweiten Beispiel, einem ringförmigen ChildWindow, wußte ich dann, wie man ein nicht rechteckiges ChildWindow herstellt. Es war extrem einfach und ging sehr schnell, es zu gestalten.

RichTextBox.Xaml Builder Add-In Version 1.0.0.3 für Expression Blend 4 - Neu mit automatischer Schriftgrößenerkennung

Eine neue Version des RichTextBox.Xaml Builder Add-In für Expression Blend 4 steht zum Download in der Expression Gallery bereit. Dies ist Version 1.0.0.3.

Die neue Version bietet eine automatische Schriftgrößenerkennung bei der Konvertierung von Rich Text für die Darstellung in einer Silverlight 4-Anwendung.

Quick Tipp: Text in der Zwischenablage vor dem Einfügen mit Strg+V modifizieren

Dieser Quick Tipp beschreibt, wie Text aus der Zwischenablage modifiziert werden kann, bevor der Nutzer den Text mit Strg+V in eine TextBox einfügt.

Quick Tipp: MouseOver VisualState für die gesamte Oberfläche eines ListBoxItem

Das Template eines ListBoxItems kennt den VisualState MouseOver. Wenn man den Mauszeiger über ein ListBoxItem bewegt, wird der VisualState MouseOver aber standardmäßig nur dann aktiviert, wenn der Mauszeiger über den sichtbaren Inhalt bewegt wird. Der sichtbare Inhalt wird durch den ContentPresenter des Templates definiert. Das ListBoxItem selbst ist aber in der Regel breiter, als der ContentPresenter bzw. als der Inhalt des ListBoxItems. Dieses Verhalten kann unerwünscht sein.

Nachfolgend beschreibe ich, was man machen muss, damit der VisualState MouseOver immer aktiviert wird, wenn der Mauszeiger über irgendeinen Punkt des ListBoxItems bewegt wird.

Neuer Accordion Style mit einem passenden ListBoxItem Style

Ich habe einen weiteren Accordion Style (Silverlight 4) in der Expression Gallery veröffentlicht. Bestandteil des Downloads ist auch ein ListBoxItem Style, der sich in das Design des Accordion Style einfügt.

Quick-Tipp: Einfache direkte Storyboard-Verkettung mit extrem reduziertem Quellcode

Bei der Arbeit an meinem aktuellen Projekt hatte ich eine Idee, wie man mehrere Storyboard mit weniger Quellcode miteinander verketten kann. Die vorgestellte Technik reduziert den xaml-Quellcode im vorgestellten Beispiel um fast 50%!

Schon gewußt? MSDN Magazin Inhalte mit Silverlight PivotViewer finden

Das MSDN Magazin ist eine ergiebige Wissensquelle für Entwickler. Das Auffinden von speziellen Inhalten wird seit einiger Zeit dadurch erleichtert, dass die Inhalte aller Artikel mithilfe eines Silverlight PivotViewers gefiltert werden können. Ein Klick auf "Launch Pivot" und alle Ausgaben des MSDN Magazins können mithilfe eines Silverlight PivotViewers gezielt nach dem gesuchten Inhalten gefiltert werden.

Klick das Bild, um zum englischsprachigen MSDN Magain zu gelangen

Leider gibt es dieses hilfreiche Feature bislang nur auf der englischen Seite des MSDN Magazins.

Untersuchung über das Hinzufügen einer ResourceDictionary.xaml Datei zu einem Silverlight 4 Projekt in einem Expression Blend 4 Add-In

Die in diesem Artikel vorgestellte Lösung zeigt, dass es grundsätzlich möglich ist, eine ResourceDictionary.xaml-Datei durch ein Add-In für Expression Blend 4 einem Silverlight 4-Entwicklungsprojekt hinzuzufügen.

RichTextBox.Xaml Builder Add-In Version 1.0.0.2 für Expression Blend 4

Es gibt eine neue Version des RichTextBox.Xaml Builder Add-In für Expression Blend 4. Es ist die Version 1.0.0.2. Mit dieser Version gibt es ein paar ergänzende Funktionen, die im wesentlichen das Verhalten des Add-In in der Entwicklungsumgebung von Expression Blend 4 betreffen. Daneben wurde ein kleines Fehlverhalten der UI behoben.

Zusammenfassung der Neuerungen

FunWithArcs UserControl - Designstudie für ein Navigationssteuerelement

Mit Silverlight 4 wurden Formen eingeführt. Es gibt Stern, Ring, Hexagon, Dreieck etc. Und es gibt die Kreisform, englisch: Arc. In der Entwicklungsumgebung von Expression Blend 4 wird das Steuerelement vom Typ Arc als Pie bezeichnet. Tatsächlich ist der Typ jedoch Arc.

Nun habe ich ein bißchen damit experimentiert und herausgekommen ist ein UserControl, das FunWithArcs UserControl. Eine Funktionalität hat es (noch) nicht. Also, was soll das? Nun, es ist wie gesagt ein Experiment. Und als solches betrachtet es bitte als Zwischenergebnis für das, was noch kommt. Ziel wird es sein, das UserControl zu einem Navigationssteuerelement weiterzuentwickeln. Mit dieser Idee im Hinterkopf, erschließt sich der gegenwärtige Stand der Entwicklung.

Das ist das UserControl im derzeitigen Entwicklungsstand:

Sichtbarkeit von einer Expression Blend Erweiterung (Add-In) abhängig vom Projekttyp

Die Funktionalität einer Expression Blend-Erweiterung zielt meistens auf einen bestimmten Projekttyp ab. Deswegen ist es nützlich zu wissen, wie man die Sichtbarkeit der Expression Blend-Erweiterung abhängig davon steuern kann, welcher Projekttyp geöfnet ist bzw. geöffnet wird. Dieser Artikel beschreibt, wie man die Sichtbarkeit von einer Expression Blend-Erweiterung in Abhängigkeit vom Projekttyp steuern kann.

Die vorgestellte Lösung funktioniert mit allen Solutiontypen von Expression Blend 4, einschließlich SketchFlow-Solutions.

Expression Blend 4 Add-In für Zugriff auf Xaml-Quellcode eines Silverlight 4 Projekts

Dieser Artikel beschreibt, wie man in einem Add-In für Expression Blend 4 Zugriff auf den Xaml-Quellcode von einem Xaml-Dokument eines Silverlight 4 Projekts erhält, das aktuell in der Entwicklungsumgebung geöffnet ist.

Im Ergebnis liefert der vorgestellte Beispiel-Quellcode einen String zurück, der das Xaml des aktuellen Xaml-Dokuments (z.B. MainPage.xaml, App.xaml, UserControl.xaml oder RecourceDictionary.xaml) enthält.

StoryboardEventHelper Klasse für eigene Storyboard-Ereignisse (VB.NET)

In diesem Artikel stelle ich eine kleine Helferklasse vor, mit deren Hilfe man für ein Storyboard (Silverlight 4) zusätzliche Ereignisse bereitstellen kann. Die Storyboard Klasse kennt regulär nur ein einziges Ereignis, das ist das Completed-Ereignis. Dieses Ereignis feuert, wenn das Storyboard-Objekt die Wiedergabe beendet hat. Es gibt aber eine Vielzahl von denkbaren Szenarien, in denen zusätzliche Ereignisse sehr nützlich wären.

Dieser Artikel beschreibt eine Technik, wie man zwar nicht der Klasse Storyboard selbst, aber über einen kleinen Trick mittels einer helfenden Klasse zusätzliche Ereignisse für ein bestimmtes Storyboard bereitstellen kann. Diese Klasse wird zwei zusätzliche Ereignisse eines Storyboard bereitstellen, auf die anwendungsweit reagiert werden kann. Das sind beispielhaft die folgenden beiden Ereignisse:

1. OnStoryboardStarted-Ereignis
2. OnStoryboardPositionChanged-Ereignis.

Den Nutzen der fertigen Klasse demonstriere ich dann anhand eines kleinen Beispiels, bei dem der VisualState eines beliebigen UI-Elements an einer bestimmten Timeline-Position eines laufenden Storyboards geändert wird.

Microsoft Translator Widget im Blogger Blog

Eben stieß ich im Blog von Daniel Greitens auf einen kurzen Beitrag zum Microsoft Translator. Daniel Greitens beschreibt, wie einfach man den Microsoft Translator als Widget in eine Webseite einbauen kann. Das habe ich natürlich sofort ausprobiert und bin wirklich beeindruckt, wie leicht dieses Tool auch in einen Blogger Blog eingebunden werden kann. Das Ergebnis seht Ihr ganz oben in der rechten Seitenleiste dieses Blogs.

Um den Microsoft Translator in einen Blogger Blog einzubinden braucht man nur ein paar Handgriffe:

RichTextBox.Xaml Builder Add-In für Expression Blend 4

Vor Kurzem habe ich das RichTextBox.Xaml Builder Tool, ein kleines WPF Programm, vorgestellt. Nun gibt es das RichTextBox.Xaml Builder Add-In für Expression Blend 4. Dieses Add-In bietet die gleiche Funktionalität wie das standalone tool, aber halt mit dem Vorteil, dass es direkt in Blend 4 genutzt werden kann.

Das Add-In ist natürlich kostenlos und als Download in der Expression Gallery erhältlich.

Wichtiger Hinweis: Das Add-In ist in der aktualisierten Version 1.0.0.2 verfügbar. Die aktualisierte Version bietet einige nützliche Neuerungen, insbesondere erkennt das Add-In ab Version 1.0.0.2 den Projekttyp eines geöffneten Projekts. Weitere Informationen zur Version 1.0.0.2 und den Link zum Download gibt es hier im Blog. Es wird empfohlen, die aktuelle Version 1.0.0.2 zu verwenden.

Um so wird das Add-In in Expression Blend 4 eingebunden:

1. In dem Ordner C:\Program Files (x86)\Microsoft Expression\Blend 4\ einen neuen Ordner mit dem Namen "Extensions" erstellen.

2. Die Datei XamlBuilder.Extension.dll aus dem Download in diesen Ordner einfügen.

3. Expression Blend 4 starten.

4. In der laufenden Instanz von Expression Blend 4 auf das Menü "Fenster" klicken und auf "XamlBuilder" klicken.

Hiernach erscheint der RichTextBox.Xaml Builder als neues Fenster in der Entwicklungsumgebung von Expression Blend 4. Das XamlBuilder-Fenster kann wie jedes andere Fenster von Blend 4 in einen der Registerkartenpanel per Drag & Drop hinzugefügt werden, so dass es dann z.B. als Registerkarte neben Projekt, Objekte, Auslöser, etc. abgelegt ist und genutzt werden kann (siehe Screenshot oben).

Verwendet wird die Oberfläche genauso, wie auch das standalone tool. Insofern empfehle ich das Video, das ich als Screencast zu dem standalone tool gemacht habe.

Wer selbst ein Add-In für Expression Blend 4 schreiben will, dem empfehle ich als Einstiegspunkt den sehr instruktiven Artikel von Timmy Kokke. Die Klasse, die er dort vorstellt ist in C# geschrieben. Für alle, die in VB.NET programmieren findet Ihr nachstehend den Quellcode der Klasse XamlBuilderExtension.vb. Diese Klasse entspricht in ihrer Grundstruktur dem C# Quellcode von Timmy Kokke und ebnet für das RichTextBox.Xaml Builder Add-In den Weg hinein in Expression Blend 4:

Ich hoffe, das Add-In ist für Euch eine nützliche Erweiterung in Blend 4.

Viel Spass damit.

Windows Phone 7 Entwicklung mit VB.NET

Seit Kurzem gibt es die finalen Developer Tools für Windows Phone 7. Super Sache, dachte ich mir. Und zack, gleich installieren. Doch leider gibt es für die finalen Tools noch keine VB.NET templates für Visual Studio.

Aber für alle VB.NET-Entwickler, die bereits jetzt in ihrer Programmiersprache mit der WP7-Entwicklung loslegen wollen, gibt es seit Kurzem ein kleines Trostpflaster: Die Visual Basic CTP  for Windows Phone Developer Tools. Weitere Informationen findet Ihr hier, auch zu den Einschränkungen gegenüber der RTM.

Rich Text zu Xml zu RichTextBox.Xaml mit dem "RichTextBox.Xaml Builder" Tool

Der RichTextBox.Xaml Builder ist ein kleines kostenloses Programm das ich entwickelt habe, mit dem man Rich Text, z.B. aus einer Word Datei, in Xml konvertieren kann. Das besondere ist, dass bei der Konvertierung zu Xml eine Xml-Dokumentstruktur erstellt wird, die mit Xaml kompatibel ist. Die resultierende Xml-Datei kann also benutzt werden, um sie in ein Silverlight 4 Projekt einzubinden und den Text in einer regulären Silverlight 4 RichTextBox oder in meinem RichXamlViewer, einem Silverlight 4 UserControl, darzustellen.



Screenshot des RichTextBox.Xaml Builder


Hier ein lebendiges Beispiel für den RichXamlViewer, in der als Quelle für den dargestellten Text eine .xml-Datei verwendet wird, die mit dem RichTextBox.Xaml Builder erstellt wurde.

Das RichXamlViewer UserControl basiert auf einer regulären Silverlight 4 RichTextBox, hat aber ein paar nützliche Zusatzfeatures. Der Text kann über das ZoomPad oben rechts zur Laufzeit vergrößert oder verkleinert werden. Die Textgrößenveränderung erfolgt animiert, weil die entsprechende Eigenschaft "TextFontSize" als DependencyProperty implementiert ist. Außerdem kann der Text über ein integriertes Kontextmenü ganz oder in Teilen in die Zwischenablage kopiert werden (das allerdings nicht im Rich Text Format). Der größte Vorteil des RichXamlViewer UserControl ist, dass es im Zusammenspiel mit Expression Blend 4 ein echtes Null-Code-Control ist. Einfach Drag & Drop auf die Oberfläche zur Entwurfszeit, den .xml-Dateinamen der mit dem RichTextBox.Xaml Builder Tool erstellten .xml-Datei in die "XamlSource"-Eigenschaft des UserControls eintragen und fertig.

Der Vorteil, den Text, der in einer Silverlight 4 RichTextBox dargestellt werden soll, in einer .xml-Datei abzulegen, anstatt ihn direkt in die RichTextBox einzugeben, besteht darin, dass der Text nicht mehr in der Xaml-Ansicht sichtbar ist. Außerdem kann über den Code Behind der darzustellende Text zur Laufzeit über eine einzige Zeile Code ausgewechselt werden. Man weist der RichTextBox.Xaml Eigenschaft einfach eine andere .xml-Datei zu. Einfacher geht es kaum.

Alle Infos dazu, wie das geht, zur Anwendung des RichTextBox.Xaml Builder und der Verwendung einer mit diesem Tool erzeugten .xml-Datei mit einer regulären Silverlight 4 RichTextBox oder mit dem Silverlight 4 RichXamlViewer UserControl gibt es in diesem Demo-Video:


Rich Text zu Xml zu Xaml from LawBot on Vimeo.

Den Download für den RichTextBox.Xaml Builder gibt es in der Visual Studio Gallery. Alternativ könnt Ihr den RichTextBox.Xaml Builder auch als Click-Once-Anwendung installieren, um stets die neueste Version zu erhalten.

Der RichXamlViewer kann in der Expression Gallery heruntergeladen werden.

Viel Spaß damit.

CodeBox - Syntax Darstellung in Silverlight für jede Programmiersprache

CodeBox ist ein Silverlight 4 UserControl. Mit CodeBox kann die Darstellung von Quellcode jeder beliebigen Programmiersprache als Silverlight 4 Anwendung in eine Website eingebunden werden.

Das ist CodeBox:

CodeBox ist wahrscheinlich die simpelste SyntaxHighlighting Lösung überhaupt. CodeBox verzichtet auf eigenes Programmieren eines Code-Parsers und auf umständliche Konvertierungen von Klartext zu RichText oder von RichText zu HTML.

CodeBox nutzt schlicht das neue Silverlight 4 RichTextBox Steuerelement für die absolut syntaxgetreu formatierte Darstellung von Quellcode. Und das Beste daran: Mit CodeBox kann jede beliebige Programmiersprache dargestellt werden. Egal ob C#, VB.NET, F#, C++, HTML, XAML, XML oder was auch immer. Alles wird exakt so dargestellt, wie es im Visual Studio Code-Editor dargestellt ist.

Die Verwendung von CodeBox

Mit CodeBox eine syntaxgetreu formatierte Darstellung von Quellcode in Silverlight 4 darzustellen geht folgendermaßen:

1. CodeBox herunterladen.

2. Ein neues Silverlight 4 Projekt öffnen.

3. Das Beispiel-Projekt aus dem Download öffnen und die Datei "SilverLawCodeBoxControl.xaml" kopieren (Rechtsklick ... kopieren) und in das neue Projekt einfügen (Rechtsklick auf das neue Projekt im Projekt-Explorer von Blend 4 und Einfügen).

4. Die XAML-Ansicht von SilverLawCodeBoxControl.xaml öffnen und x:Class="CodeBoxControlSolution.SilverLawCodeBoxControl" durch x:Class="DeinProjektName.SilverLawCodeBoxControl" ersetzen.

5. Den Quellcode, der dargestellt werden soll, aus dem Visual Studio Code-Editor in die Zwischenablage kopieren.

6. Zurück in die Design-Ansicht von SilverLawCodeBoxControl.xaml in Expression Blend 4 und in der Registerkarte Objekte und Zeitachsen das Element mit dem Namen "CodeBox" selektieren (das ist eine simple RichTextBox).

7. In der Design-UI von Blend einen Doppelklick auf die CodeBox-RichTextBox machen, wonach der gesamte Text in der CodeBox-RichTextBox markiert ist.

8. Mit Strg-V den in die Zwischenablage kopierten Quellcode in die CodeBox-RichTextBox einfügen.

9. F5.

Das war's!

Zur Laufzeit kann durch Klicken und Ziehen mit dem Mauszeiger entweder ein Teil des Textes oder über das Context-Menü der gesamte Text markiert werden. Über das Context-Menü kann der markierte Text in die Zwischenablage kopiert werden.

Aus der Zwischenablage kann der Text dann wieder in den Visual Studio Code-Editor eingefügt werden.

Ach ja. Und wenn Ihr mit CodeBox in einem Google Blogger Blog Quellcode darstellen wollt müßt Ihr folgendes machen:

1. Eine Silverlight 4-Anwendung mit einer CodeBox herstellen.

2. Die TestPage.html zusammen mit der .xap-Datei auf einem Web-Server ablegen.

3. In der HTML-Ansicht des Post-Designers von blogger den folgenden Code an der Stelle einfügen, in der die CodeBox erscheinen soll:

Also ... viel Spaß mit CodeBox.


Bitte beachtet noch folgendes, wenn Ihr CodeBox in Eurer Website nutzen wollt:
Der HyperlinkButton mit dem Namen hbDownload darf weder vollständig entfernt, noch darf der dort gesetzte Link auf die originale Download-Quelle in der Expression Gallery entfernt werden.

How To: Rotieren eines ChildWindow

Dieser Artikel beschreibt Schritt für Schritt, wie man ein ChildWindow zum Rotieren bringt, einschließlich einer Rotationsanimation beim Öffnen des ChildWindow.

Das folgende Beispiel zeigt, wohin die Reise geht:

Focus für TextBox mit dem Laden der Seite

Über dieses Problem ist garantiert jeder einmal gestoplert: Wie stellt man sicher, dass nach dem Laden einer Silverlight-Anwendung der Focus auf eine TextBox gesetzt ist? Chris Rouw löst dieses Problem in einem kurzen Blog-Beitrag.

Neues Blog-Design

Es ist kaum zu übersehen. SilverLaw hat ein neues Blog-Design. Grund dafür ist nicht zuletzt, dass dieser Blog jetzt als externer Blog in der Community Section der offiziellen Microsoft Expression Studio Seite gelistet ist.

Video: Seitenübergänge mit eigener Transition - Silverlight 4

Das Navigation-Framework von Silverlight ermöglicht es, in einer Silverlight-Anwendung zwischen mehreren Seiten zu navigieren, einschließlich der Integration in die Browser-History. Alles was man dazu braucht, sind die einzelnen Seiten, also Pages, und ein Frame-Element, in dem die Seiten angezeigt werden und das für die Navigation zuständig ist.

Soweit so gut. Die Seitenübergänge von einer zur nächsten Seite sind standardmäßig jedoch plötzlich. Also bei der Navigation zu einer neuen Seite erscheint die Seite sofort und ohne Seitenübergang.

Es gibt aber eine recht einfache Möglichkeit, innerhalb des Navigation-Framework ansprechende Seitenübergänge hinzuzufügen. Wie man einen eigenen Seitenübergang erstellen und implementieren kann, das habe ich in einem Demovideo zusammengefaßt.


Seitenübergänge mit eigener Transition from LawBot on Vimeo.

Das Demovideo findet Ihr, neben weiteren Screencasts, auch in meinem Vimeo channel, LawBot On Silverlight.

Es zeigt Schritt für Schritt, wie man vorgeht. Das im Video entwickelte Beispiel baut einen Seitenübergang, der jede neue Seite von einer monochromen Farbdarstellung (also von schwarz-weiß) zu der tatsächlichen Farbdarstellung der Seite aufscheinen läßt (ColorTone Page Transition).

Wie das Ganze im Ergenis aussieht, könnt Ihr am folgenden Beispiel sehen. Den Quellcode für dieses und alle anderen Beispiele findet Ihr als Download jeweils in der Expression Gallery.

Weitere Quellcode-Beispiele für Seitenübergänge mit eigener Transition findet Ihr in der Expression Gallery:

Flexible MouseMove Surface - Silverlight 4

In der Expression Gallery findet Ihr ein Beispiel inklusive Sourceode für eine flexible Oberfläche, die auf den MouseMove reagiert (Flexible MouseMove Surface). Das ist eine Ergänzung zu meinem Flexible Surface Effect - Silverlight 4.

Und so sieht das Ganze aus:

Viel Spass damit.

Hyperlink Button Style - Silverlight 4

In der Expression Gallery findet Ihr einen HypelinkButton Style, der bei den Entwürfen für die UI meiner neuen Silverlight Seite entstanden ist.

Hier ein lebendiges Beispiel:

Viel Spass damit.

SilvAir Strike - Ein kostenloses Silverlight Spiel

Ich habe ein kleines kostenloses Silverlight Spiel geschrieben: SilvAir Strike.

Ziel des Spiels ist es, möglichst alle angreifenden Flugzeuge abzuschießen. Angreifende Flugzeuge, die nicht oder nicht rechtzeitig abgeschossen werden, fliegen vorbei und treffen den eigenen Stützpunkt. Mit dem fünften Treffer ist das Spiel verloren. Mit jedem Treffer verschlechtert sich die Sicht auf die angreifenden Flugzeuge. Wie, das werdet sehen, wenn Ihr SilvAir Strike spielt ...

Das Spiel hat drei Level. Die Level unterscheiden sich in der Angriffsintensität, der Dauer, über die man angreifende Flugzeuge abwehren muss und in der Anzahl der zur Verfügung stehenden Munition. Das Spiel ist gewonnen, wenn man über die Spieldauer des Levels überlebt hat.

Wenn Ihr SilvAir Strike spielt solltet Ihr unbedingt die Lautsprecher anstellen. Nicht nur wegen des ziemlich genialen Soundtracks, Evil March von Kevin MacLeod, dessen Internet-Seite eine echte Fundgrube für Royalty Free Music ist. Den Sound des Spiels selbst habe ich u.a. so gebaut, dass das Motorengeräusch jedes angreifenden Flugzeugs aus der Richtung kommt, aus der auch das angreifende Flugzeug anfliegt. Das kann manchmal ganz nützlich sein.

Hier ist ein kurzer HD-Video-Trailer zu SilvAir Strike:

PivotViewer Control Silverlight 4 verfügbar

In einem früheren Beitrag hatte ich darauf hingewiesen, dass es Pivot bald für Silverlight 4 geben wird. Jetzt ist es soweit: Das PivotViewer Steuerelement für Silverlight 4 ist verfügbar.

Einen allgemeinen Überblick, u.a. mit einigen beeindruckenden Videos, über das Silverlight 4 PivotViewer Control findet man hier. Das Steuerelement selbst, inklusive Dokumentation, kann hier heruntergeladen werden. Um das PivotViewer Steuerelement verwenden zu können, benötigt man das Silverlight 4 Toolkit.  Ansonsten die übliche Ausstattung, um Silverlight 4 zu programmieren.

Auf der offiziellen Silverlight Seite gibt es einen speziellen Bereich für das PivotViewer Control mit Infos, Tipps, weiterführenden Links und ersten Anleitungen zum Einbau des PivotViewer Control in eine Silverlight 4 Anwendung. Neu ist ein spezielles PivotViewer Forum.

How To: Storyboard erst beginnen, wenn die Seite vollständig geladen ist - Silverlight 4

Es ist eine bekannte Schwierigkeit, ein Storyboard im Loaded event handler der MainPage tatsächlich erst dann starten zu lassen, wenn die Silverlight-Seite bereits vollständig geladen ist. Fügt man dem Loaded event handler schlichtweg den code

sbMeinStoryboard.Begin()

hinzu, und braucht die Seite länger für das vollständige Laden, als die Dauer von sbMeinStoryboard, dann ist das Storyboard schon abgelaufen, wenn die Silverlight-Anwendung geladen ist. Das Ergebnis: Die Animation, die eigentlich als erstes zu sehen sein sollte, erscheint garnicht oder man sieht gerade mal noch den "Abspann".

Der folgende Code Ausschnitt bietet eine generelle Lösung für dieses Problem an:

Flexible Surface Effect - Silverlight 4

Ich habe einen Flexible Surface Effect entwickelt, der es ermöglicht, dass die UI einer Silverlight-Anwendung sich verhält, als würde man mit dem Finger in Wasser tippen. Dieser Effekt, der kein eigenständiger Effect im technischen Sinne ist, sondern einen regulären RippleEffect (Silverlight 4) nutzt, eröffnet ein paar wirklich interessante neue Möglichkeiten.

Hier ein lebendiges Beispiel:

Veröffentlicht habe ich das ganze wie immer in der Expression Gallery für Silverlight 4, Silverlight 3 und mittlerweile auch für WPF 4. Jeweils komplett mit Quellcode.

In meinem englischsprachigen Blog findet Ihr den ersten Teil eines Tutorials zum Flexible Surface Effect (Silverlight 4). Leider war die englische Community diesmal früher dran. Aber ich arbeite bereits an einer Tutorial-Serie in deutscher Sprache. Seid gespannt.

In der Expression Gallery findet Ihr noch zwei weitergehende Beispiele für den Flexible Surface Effekt.

Zum einen ein Beispiel für die Anwendung des Flexible Surface Effekt mit einer Drag & Drop Interaktivität. Ebenfalls mit dem kompletten Sourcecode:

Das bislang jüngste Beispiel ist Silver Soccer. Eine Fallstudie für eine Anwendung des Flexible Surface Effekt in einem Fussballspiel. Quellcode ist dabei. Es ist (noch) kein vollständiges Spiel, aber Ihr könnt einen Fussball ins Tor schießen, ihn durch einen Klick auf den Elfmeterpunkt zurückholen und erneut schießen usw. Bislang habe ich nur einen Torschuss implementiert. Der Ball landet immer oben links im Tor. Als Demonstration für den Flexible Surface Effect ist das denke ich schon ziemlich cool. Denn der Flexible Surface Effekt ist auf das Tornetz gelegt, so dass es sich wie ein echtes Tornetz bewegt sobald der Ball im Tor landet. Schaut Euch einfach den Quellcode an.

Leider habe ich im Moment wenig Zeit, so dass die Tutorials ein wenig dauern werden, aber seid gespannt ... es kommt noch mehr!

Silver Spot Light

Eigentlich war ich gerade dabei, für die UI einer Silverlight 4 App ein paar Sachen auszuprobieren. Bei einer meiner Studien kam ich dazu, ein Spot-Light für Silverlight 4 zu entwerfen. Herausgekommen ist mein ganz persönliches Silverlight-Licht ;-)

Das Interessante an diesem Demo-Projekt ist, dass alle Objekte pures XAML sind, gestaltet mit Expression Blend 4 RC. Es sind also keine Images. Das Deckenlicht z.B. besteht aus mehreren Kreisen in mehren Ebenen, die räumlich versetzt angeordnet sind. Kombiniert mit Blur-Effekten auf den Kreisen ergibt sich der dargestellte Effekt einer räumlich wirkenden Röhre, die aussieht wie ein Deckenlicht.

Aus dem Blickwinkel der Performance ist die Kombination mehrerer Blur-Effekte potentiell kritisch. Es sind aber keine Animationen enthalten, so dass im Ergebnis die Performance nicht beeinträchtigt ist.

Das vollständige Projekt könnt Ihr in der Expression Gallery herunterladen. Enthalten ist ein Style für einen Silverlight 4 ToggleButton. Irgendwie muss man das Licht ja ein- und ausschalten können ...

Viel Spass damit!

ChildWindow und Accordion Styling - Silverlight 4

Vor knapp vier Monaten hatte ich in der Expression Gallery ein ChildWindow und Accordion Styling für Silverlight 3 veröffentlicht. Der Sourcecode zum Projekt wurde seither fast 17.000 mal heruntergeladen und ist damit vom Download her der erfolgreichste Upload in der Expression Gallery. Danke an alle, die die Styles heruntergeladen haben.

Seit heute gibt es nun auch die Version für Silverlight 4. Ein Beispiel und den Download mit dem vollständigen Sourcecode findet ihr in der Expression Gallery.

Wenn Euch der Download gefällt, dann vergebt bitte ein paar Sterne für den Download über das Rating in der Expression Gallery. Wenn Ihr Anregungen, Fragen oder Kritik habt, dann postet sie bitte hier in meinem Blog.

Pivot - Design und Interaktion mit komplexen Daten (bald auch für Silverlight 4)

Pivot ist ein Software der Microsoft Live Labs, die faszinierende neue Möglichkeiten für das Design und den Umgang mit komplexen Informationen in riesigen Datenmengen ermöglicht. Im Sommer 2010 soll es Pivot auch als Silverlight 4 Steuerelement geben. Ein Blick auf Pivot lohnt sich also. Denn Pivot eröffnet neue Perspektiven für den effetiven und intuitiven Umgang mit komplexen Informationsmengen.

ChildWindowMouseScrollResizeBehavior - Silverlight 3

Ich habe ein Behavior entwickelt, das es ermöglicht, die Größe eines regulären Silverlight 3 ChildWindow zur Laufzeit durch das Scrollen mit dem Mausrad proportional zu verändern (ChildWindowMouseScrollResizeBehavior).

Hier könnt Ihr ein lebendes Beispiel sehen und ausprobieren.

Das Behavior selbst kann als kompilierte .dll in der Expression Gallery heruntergeladen werden.

Eine Größenveränderung für ein ChildWindow zu implementieren ist teilweise etwas aufwändig. Deswegen habe ich diese Funktionalität in ein Behavior eingebaut. Das Behavior kann in Expression Blend 3 komfortabel konfiguriert werden.

How To: ChildWindow durch Mausclick auf den Overlay neu positionieren

Der standardmäßige Ablauf beim Umpositionieren eines Silverlight 3 ChildWindow ist zur Laufzeit ein Drag-and-Drop Prozess. Der Nutzer klickt mit der linken Maustaste auf die Fensterleiste des ChildWindow, hält die Maustaste gedrückt, zieht es an die neue Position und läßt dann die Maustaste wieder los. Das sind insgesamt drei Aktionen, die der Nutzer auf dem Weg zum Ziel vornehmen muss (Maus-Klick, Maus-Bewegung, Maus-Loslassen).

Dieser Artikel beschreibt, wie man ein ChildWindow zur Laufzeit mit einem einfachen Mausklick auf den Overlay, also einer einzigen Aktion, umpositionieren kann.

Video: ChildWindow Styling

Wer ein reguläres Silverlight 3 ChildWindow visuell auffrischen will, der muss das ChildWindow stylen. Am einfachsten geht das mit Expression Blend 3. Das folgende Video führt Schritt für Schritt durch ein vollständiges Styling eines ChildWindow mithilfe von Expression Blend 3.

How To: Position eines ChildWindow zur Laufzeit ermitteln

Manchmal ist es erforderlich, die Position eines regulären Silverlight 3 ChildWindow zur Laufzeit zu ermitteln. Dieser Beitrag beschreibt Schritt für Schritt, wie das geht.

Twisting Navigation - Silverlight 3

In der Expression Gallery findet Ihr hier den Download für mein Twisting Navigation Usercontrol. Dieses Usercontrol kann für die Navigation in einer Silverlight 3-Anwendung eingesetzt werden. Der Download enthält den vollständigen Sourcecode.

Herzlich Willkommen

Schon lange wollte ich einen deutschsprachigen Blog zum Thema Silverlight einrichten. Und hier ist er nun. Bisher habe ich unter SilverLaw in Englisch gebloggt. Das werde ich auch weiterhin machen. Zukünftig möchte ich meine Begeisterung für Silverlight und Expression Blend, mein Wissen und meine Ideen vor allem in diesem deutschsprachigen Blog mit Euch teilen. Denn es gibt tausende Silverlight-Blogs in englischer Sprache, aber zu wenige in deutscher Sprache.

Die Blog-Einträge, die Euch erwarten, drehen sich rund um Anwendungsentwicklung und Design mit Silverlight und Microsoft Expression Blend. Videos werde ich weiterhin in meinem Channel LawBot on Silverlight bei vimeo.com veröffentlichen und hier thematisch verlinken.

Ich hoffe, dass Euch mein neuer Blog gefallen wird und Ihr von dem einen oder anderen Blog-Eintrag profitiert.

Beste Grüße,

Martin Krüger (SilverLaw)