Abo
  • Services:

Web Components: UI-Bibliothek für Googles Dart

Google hat mit Web UI eine User-Interface-Bibliothek für seine Javascript-Alternative Dart veröffentlicht. Web UI nutzt Web Components, mit denen sich eigene HTML-Tags definieren und mit Inhalten versehen lassen, so dass sie wie Bausteine verwendet werden können.

Artikel veröffentlicht am ,
Todo-App auf Basis von Dart und Web UI
Todo-App auf Basis von Dart und Web UI (Bild: Google)

Web UI soll die Entwicklung mittlerer und großer Web-Apps vereinfachen. Die für Googles Programmiersprache Dart entwickelte Bibliothek unterstützt dazu dynamische Templates und Web Components.

Stellenmarkt
  1. Garz & Fricke GmbH, Hamburg
  2. Bankhaus Lampe KG, Düsseldorf

Templates funktionieren in Web UI ähnlich wie bei Mustache mit doppelten geschweiften Klammern. Damit lassen sich Inhalte, Attribute und Klassen in CSS mit Platzhaltern versehen, die gegebenenfalls nur dann angezeigt werden, wenn bestimmte Bedingungen erfüllt sind. Auch Schleifen werden unterstützt. Zudem lassen sich UI-Elemente mit Dart-Variablen verknüpfen, so dass die beiden Werte synchronisiert werden, wenn sich die Variable oder der Wert des UI-Elements ändert, beispielsweise durch eine Nutzereingabe.

Darüber hinaus hat Google in Web UI sein Web-Komponenten-Konzept umgesetzt, das Google im Mai bereits als W3C-Entwurf für Web Components veröffentlicht hat. Damit lassen sich Elemente in einer Seite in einem neuen Tag zusammenfassen, das im Code wiederverwendet werden kann. Das umfasst den dazu in einem Template gekapselten HTML-Code ebenso wie den dafür notwendigen CSS-Code und die zugehörige Script-Logik.

Eine Übersicht der Funktionen von Web UI hat Google unter dartlang.org samt passenden Beispielen zusammengestellt. Allerdings handelt es sich bei der jetzt veröffentlichten Version von Web UI um eine frühere Version. Diese enthält aber auch einen Compiler, der den Dart- und Web-UI-Code umwandelt, so dass er in jedem modernen Browser funktioniert.

Auch eine kleine Todo-App, die mit Dart und Web UI umgesetzt wurde, stellt Google zur Verfügung. Sie kann unter dart-lang.github.com ausprobiert werden.



Anzeige
Blu-ray-Angebote
  1. (2 Monate Sky Ticket für nur 4,99€)
  2. 4,25€

kitingChris 19. Dez 2012

Konkurrenz zur Wunderlist? SCNR


Folgen Sie uns
       


Samsung Flip - Test

Das Samsung Flip ist ein Smartboard, das auf eingängige Weise Präsentationen oder Meetings im Konferenzraum ermöglicht. Auf dem 55 Zoll großen Bildschirm lässt es sich schreiben oder zeichnen - doch erst, wenn wir ein externes Gerät daran anschließen, entfaltet es sein komplettes Potenzial.

Samsung Flip - Test Video aufrufen
Garmin Fenix 5 Plus im Test: Mit Musik ins unbekannte Land
Garmin Fenix 5 Plus im Test
Mit Musik ins unbekannte Land

Kopfhörer ins Ohr und ab zum Joggen, Rad fahren oder zum nächsten Supermarkt spazieren - ohne Smartphone: Mit der Sport-Smartwatch Fenix 5 Plus von Garmin geht das. Beim Test haben wir uns zwar im Wegfindungsmodus verlaufen, sind von den sonstigen Navigationsoptionen aber begeistert.
Ein Test von Peter Steinlechner

  1. Garmin im Hands on Alle Fenix 5 Plus bieten Musik und Offlinenavigation

eSIM: Die Plastik-SIM-Karte ist noch lange nicht weg
eSIM
Die Plastik-SIM-Karte ist noch lange nicht weg

Ein halbes Jahr nach dem Ende der Verhandlungen um die eSIM bieten immerhin zwei von drei Netzbetreibern in Deutschland die fest verbaute SIM-Karte an. Doch es gibt noch viele Einschränkungen.
Von Archie Welwin


    Cruijff Arena: Ed Sheeran singt mit Strom aus Nissan-Leaf-Akkus
    Cruijff Arena
    Ed Sheeran singt mit Strom aus Nissan-Leaf-Akkus

    Die Johann-Cruijff-Arena in Amsterdam ist weltweit das erste Stadion, das seine Energieversorgung mit einem Speichersystem sichert, das aus Akkus von Elektroautos besteht. Der englische Sänger Ed Sheeran hat mit dem darin gespeichertem Solarstrom schon seine Gitarre verstärkt.
    Ein Bericht von Dirk Kunde

    1. Energiewende Warum die Bundesregierung ihre Versprechen nicht hält
    2. Max Bögl Wind Das höchste Windrad steht bei Stuttgart

      •  /