Erfolge

t.online.de für Windows 8

6. November 2012 von Thomas Erbrich

Zum Start von Windows 8 realisierte die ATE Software GmbH die App t.online.de für die Deutsche Telekom. Die App t-online.de ist speziell für Windows 8 entworfen und nutzt die neue Oberfläche zur übersichtlichen Anzeige von News, Videos und dem TV-Programm. In nur wenigen Wochen haben wir die t.online.de App umgesetzt und pünktlich zum Windows 8 Start am 26.10.2012 in den Store gebracht.

Den Rest des Eintrags lesen »

Expression Blend 5 und Visual Studio Hotfix

4. Oktober 2011 von Jens Peter Kleinau

In der aktuellen Deverloper Preview von Expression Blend 5 wird der geneigte XAML/C# Entwickler seine schlimmsten Alpträume verwirklicht sehen: ausschließlich Unterstützung für HTML5/CSS3 und Javascript. Diese ist recht gut gelungen, aber das wird nur wenig trösten. Vor allen vor der Perspektive, dass die Visual Studio 11 Developer Preview starke Probleme hat, XAML in einer akzeptablen Form editieren zu können.

Der Editor sowohl für XAML wie auch für HTML5/CSS3 innerhalb Visual Studio 8 ist mit Expression Blend identisch. Da Expression Blend 5 in der CTP aktuell kein XAML kann und auch die Umsetzung des Codes in ein Programm nicht besonders überzeugt, war der Dämpfer auf die Freude über das tolle Touch Design nachvollziehbar.

Zum Glück brachte Micrososft ein Hot Fix für die Developer Preview von Visual Studio 11 heraus, dass man hier herunterladen kann: Download Link. Die Benennung von Visual Studio 11 CTP als Visual Studio vNext sollte nicht iritieren, wenn man die Roadmap für Developer Studio kennt.

Windows 8 – live von der Build Conference – Anwendungs-Layout mit XAML

15. September 2011 von Jens Peter Kleinau

In dem Vortrag von Tim Heuer, einem XAML Program Manager bei Microsoft, geht es um „Reach all your customer’s devices with one beautiful XAML user interface“. Sein Blog findet sich hier: http://timheuer.com/blog/ .

WPF ist kein Thema mehr, denn aus einer Bibliothek von Features in dem .Net Framework ist das geworden, was der Name versprochen hat: Extensible Application Markup Language, unabhängig von Gerät und Plattform (so lange sie von Microsoft stammt, da Mono für Android noch kein Moonlight enthält und auch Silverlight für Mac ein Microsoft Produkt ist).
Den Rest des Eintrags lesen »

Windows 8 – live von der Build Conference – XAML

14. September 2011 von Jens Peter Kleinau

Nach den Keynotes ist die Anzahl der parallel laufenden Sessions beeindruckend. Wer nicht mit einem Dutzend von Mitarbeitern auf der Build Konferenz angekommen ist, der hat die Qual der Wahl. Als ehemaliger Microsoft MVP in Sachen XAML und Expression interessiert mich persönlich die Weiterentwicklung der zentralen Markup Language für Entwickler. So handelt meine erste technische Session über Metro mit XAML. Die Session ist übervoll und es stehen nicht genügend Sitzplätze zur Verfügung. Joe Stegman, Group Program Manager für XAML bei Microsoft, hält den Vortrag „Metro style apps using XAML: What you need to know“.
Den Rest des Eintrags lesen »

Windows 8 – live von der Build Conference – Developing

13. September 2011 von Jens Peter Kleinau

Entwickler erwartet in Windows 8 eine neue WinRT API als dem untersten Layer über den Windows 8 Kernel Services. Darüber liegen im Model/Controller Layer die Sprachen C++, C#, VB, in denen View und Model sauber getrennt werden. Als Darstellungslayer findet sich XAML, das für die oben genannten Sprachen als View. Die bei den Entwicklern laut Handabstimmung eindeutig wenig beliebte Kombination aus HTML/Javascript durchbricht diese Trennung und verbindet Model mit View.
Den Rest des Eintrags lesen »

Fachliches Maskendesign mit XAML

15. August 2011 von Nikolay Nikolov

Moderne Benutzeroberflächen sind schick, intuitiv und effizient; oder sie sollten es zumindest sein. Aber die neuen Oberflächentechnologien sind schwer zugänglich und vom Programmierer alleine nicht mehr beherrschbar. Das hat direkte Auswirkungen auf den Prozess bei der Entwicklung  moderner  Softwareprodukte.

Früher war alles einfacher

Früher war die Programmierwelt noch einfacher. Mit Technologien wie Windows Forms konnte ein Entwickler recht leicht Benutzeroberflächen aus vorgegebenen Elementen zusammenbauen. Dazu nutzte er einen simplen Maskendesigner, der auf die Bedürfnisse eines Programmierers zugeschnitten war.

Heute sind, dank Internet und neuer Hardware, die Anforderungen an Benutzeroberflächen weitaus höher. Corporate Design, User Experience, Animationen, Vektoren, 3D, Multi Touch, Barrierefreiheit; um hier nur ein paar Schlagworte zu nennen.

Das alles erhöht nicht nur die Aufwände für Planung, Design und Umsetzung von grafischen Oberflächen, sondern verlangt auch nach neuen Spezialisten, den GUI-Designern. Aktuelle Oberflächentechnologien ermöglichen durch die Trennung von Design und Code die enge Zusammenarbeit von Designern und Entwicklern. Moderne Werkzeuge zur Oberflächengestaltung, wie z.B. Expression Blend, sind daher auf die Bedürfnisse von Designer zugeschnitten. Er kann mit Styles, Templates, Timelines, Storyboards aus dem Vollen schöpfen.

Grafisches und fachliches Maskendesign

Das funktioniert prima für moderne Consumer-Anwendungen mit wenigen Masken. Die echten Herausforderungen beginnen bei stark formularbasierten Anwendungen, z.B. bei Versicherungen, Finanzdienstleistern oder Behörden. Hier liegt das Know-How bei den Fachentwicklern, die die Abläufe und Prozesse kennen und genau wissen, welche Formularfelder benötig werden und welche Daten anzuzeigen sind.

Genau so war auch die Situation bei einem unserer Kunden, der die Entscheidung getroffen hatte Windows Presentation Foundation (WPF) als Grundlage für die nächste Produktversion zu verwenden. Für das Produkt müssen viele Formulare erstellt und vor allem ständig an gesetzliche Änderungen angepasst werden. Einerseits ist es nicht möglich alle Formularmasken von Designer entwerfen zu lassen, da diese nicht über das notwendige fachliche Wissen verfügen und die Entwicklung dadurch zu teuer und zu langwierig würde. Andererseits legt der Kunde Wert auf sein Corporate Design und eine moderne, intuitive Usability des Produkts.

Die Auflösung des Paradoxons

Was zuerst nach einem unauflösbaren Paradoxon klingt, haben wir durch einen fachlichen Formulareditor gelöst.  Auf Basis von XAML (Extensible Application Markup Language) hat die ATE Software dafür ein neues Konzept zum Design von Masken verfolgt und in einen Maskeneditor für Fachentwickler umgesetzt. Der Editor ermöglicht es, aus fachlichen Elementen komplexe Formulare zusammenzusetzen.

Ein fachliches Element kann dabei aus mehreren physikalischen Controls bestehen. Es besitzt fachliche Eigenschaften, die auf die physikalischen Eigenschaften der zugrunde liegende Controls abgebildet werden. Z.B. kann ein Eingabeelement definiert werden,  welches die Eigenschaft „Titel“ und das Kennzeichen „Pflichtfeld“ hat.

Es besteht aus den physikalischen Controls Panel, Label und Textbox. Die Eigenschaft „Titel“ setzt den Text im Label, das Kennzeichen „Pflichtfeld“ setzt die Styles (und damit die Farbe und Darstellung) im Label und in der Textbox.

Der Fachentwickler muss so nur die fachliche Einstellungen (z.B. „Pflichtfeld“) verstehen. Die zugrundeliegenden Controls, Templates und Styles muss er weder kennen noch kann er sie verändern. Diese sorgen aber dafür, dass Farben, Abstände Schriftarten etc. immer dem Styleguide und damit dem Corporate Design entsprechen, während das fachliche Verhalten frei definiert werden kann.

Komplexere Bausteine (z.B. Adresseingabe) können aus bestehenden Elementen zusammengestellt werden. Diese Bausteine werden dann im Editor wie alle fachlichen Elemente verwendet. Dadurch kann der Entwickler auch aufwendige Formulare schnell gestalten und anpassen, ohne dafür Designkenntnisse zu benötigen.

Surface: Scatterview und auftauchende Elemente

1. November 2010 von Jens Peter Kleinau

Wenn man mit Microsoft Surface ein Element auftauchen lassen will, so soll dies danach auch sich bewegen, ziehen und auch drehen lassen. Dazu bietet sich der Scatterview an. Das Auftauchen von Elementen lässt sich leicht lösen, wenn diese frei und unabhängig vom Rest sind, also ein eigenständiges ScatterviewItem

Den Rest des Eintrags lesen »

WPFAnwendung mit TrayIcon

3. März 2010 von Jens Peter Kleinau

Eine WPF Anwendung mit einem TrayIcon zu versehen ist eine einfache Sache. Doch dazu müssen wir uns – bitte nicht erschrecken – bei WindowsForms bedienen. Zuallerst schaffen wir uns wie gewohnt eine WPF Anwendung mit dem Project Wizard. Diese entspricht einer völlig normalen WPF Anwendung und wird auch eine solche bleiben. Natürlich wäre es möglich in einer WindowsForms Anwendung WPF zu hosten, aber das ist nicht der Weg, den wir hier gehen wollen. Sondern wir erweiteren eine WPF Anwendung um Funktionalitäten, die wir von WindowsForms her kennen. Dazu bringen wir die Referenzen „System.Windows.Forms“ und „System.Drawing“ in unsere Anwendung mit „Add Reference“.

Den Rest des Eintrags lesen »

3D-Modelle aus Blender oder anderen Tools übernehmen

5. November 2009 von Jens Peter Kleinau

Mit Kazim habe ich schon erfolgreich in einem Projekt zusammen gearbeitet und würde mich freuen, wenn sich wieder die Gelegenheit ergibt. In seinem neuen Blog „ux developa“ hat er einen kurzen Artikel über das Importieren von 3D Objekten in Expression Blend 3 verfasst. OBJ ist ein offenes Definitionsformat für geometrische Daten (Spezifikation).

Seinen Artikel findet man hier: http://www.developa.org/2009/10/3d-modelle-aus-blender-nach-xaml-konvertieren/

Fade away – Opacity Blending von Masken

28. September 2009 von Jens Peter Kleinau

Um Masken ein- oder auszublenden scheint die entsprechende Animations sehr simpel. Man nehme schlicht und ergreifend die Maske, schenke ihr eine DoubleAnimation und reduziere das OpacityProperty in einem angemessenen Zeitraum auf den Wert 0. Doch leider stellt man fest, dass die auszublendende Maske im Ausblenden genauso anklickbar ist, wie im normalen Maskenleben.

Einfallsreiche legen dann einen Canvas als Klickschutz darüber, um das Klicken zu unterbinden und es scheint, dass nun das unverklickbare Ausblenden gerettet ist. Doch damit das gut funktioniert müssen folgende Bedingungen gültig sein.

  1. Der neue Klickschutz-Canvas muss im Z-Layer über allen anderen Masken liegen.
  2. Die nun anzuzeigenden Masken (Einblendung) müssen im Z-Layer unter den alten Masken liegen.

Will man die gesamte Maske aus- oder einblenden, dann ist das noch relativ leicht machbar. Doch will man einzelne Masken nachladen und dabei einblenden, so muss man diese in einen neuen Canvas kopieren (parent, ist hier im Codebeispiel ein Panel, welches die auszublendenden Maskenteile enthält).

blender = new Canvas();blender.Width = ((Panel)parent).ActualWidth;
blender.Height = ((Panel)parent).ActualHeight;
newblender = true;UIElement[] arr = new UIElement[((Panel)parent).Children.Count];
((Panel)parent).Children.CopyTo(arr,0);  ((Panel)parent).Children.Clear();
foreach (UIElement ele in arr)  { blender.Children.Add(ele);  }

Insgesamt eine recht einfache Sache, doch irgendwie lästig. Das geht auch eleganter.

Man nehme die wunderbare Klasse “RenderTargetBitmap”, verwende die festgezimmerte Bildschirmauflösung von 96dpi und mache einen Screenshot von den Elementen, die auszublenden sind.

void SnapIt(Panel blender) {            
     RenderTargetBitmap rtb = new
         RenderTargetBitmap((int)blender.ActualWidth,
         (int) blender.ActualHeight,96d, 96d, PixelFormats.Pbgra32);
     rtb.Render(blender);
     Image img = new Image();
     img.Source = rtb;
     blender.Children.Clear();
     blender.Children.Add(img);
     DoubleAnimation dba = new DoubleAnimation(1d, 0,
           new Duration(TimeSpan.FromSeconds(opacityBlendingSeconds)));
     dba.Completed += new EventHandler(blender_Completed);
     blender.BeginAnimation(Image.OpacityProperty, dba);
}

Damit sich das auch sauber beendet wird noch am Ende der Animation der Eventhandler aufgerufen, der schließlich das Image wieder entfernt.

void blender_Completed(object sender, EventArgs e)  {
if (sender != null && sender is
   Image && ((Image)sender).Parent != null &&
      ((Image)sender).Parent is Panel)      {
         lock (sender)          {
         ((Image)sender).Visibility = Visibility.Hidden;
         ((Panel)((Image)sender).Parent).Children.Remove(((Image)sender));
       }
   }
}

Nicht vergessen sollte man, dasss man mit mehreren Threads arbeitet, also munter Exception fangen und behandeln (hier im Codebeispiel verzichte ich aus Platzgründen auf die entsprechende Fehlerbehandlung).
Insgesamt kann man mit den Screenshots (genauer dem Rendern in eine Bitmap) recht gut arbeiten. Es sind eine Menge Effekte denkbar, nicht nur das Aus- und Einblenden.

« Frühere Einträge