- Import von RSS content
- Anlegen mehrer Screens
- Navigation zwischen den Screens
- Arbeiten mit Galleries
Die in diesem Beispiel benutzten Inhalte wurden nur deshalb als Vorführgrund ausgewählt, da es sich hierbei um eine gut strukturiertes RSS-Konzept des Anbieters handelt und hat nichts mit einer persönlichen Präferenz zu tun.
Daher ist dieses Tutorial auch mit den jeweilig persönlich gewünschten Anbietern umsetzbar.
Und los gehts:
In unserer neuen arbeiten wir mit live content aus dem Internet. In diesem Fall benutzen wir RSS Feads. Diese geben uns die Möglichkeit den User über das aktuelle Geschehen des jeweiligen RSS Feads zu informieren.
Die in dieser App benutzten RSS feads stammen von folgenden Anbieter:
http://www.bild.de/corporate-site/rss-infoseite/bild-service/rss-3257128.bild.html
Schritt 1: Einbinden der Datenquellen
Datenquellen können in Siena sehr leicht eingebunden werden. Um dies zu tun blendet man per Rechtsklick die obere Menüleiste ein. Dort wählt man "File" aus und wechselt in die Ansicht "Data Sources".
Jetzt könnt Ihr euch entscheiden welche Datenquelle ihr hinzufügen möchtet. Hier importieren wir nun die einzelnen RSS Feads der Kategorien unseres Anbieters.
Im späteren Programmverlauf können wir unsere Datenquellen über deren Namen ansprechen wie z.b. rss_1 rss_2 etc. Daher sollte man sich auch merken, welche Datenquelle welchen Namen zugeordnet ist. GGf. wird es in späteren Releases möglich sein, den Namen individuell anzupassen.
Schritt 2: Aufbau und Design der App
Als nächstes kümmern wir uns um das look and feel. Dafür platzieren wir die Grundelemente, die später als Buttons, Logos oder Texte dienen sollen auf die Hauptseite.
Als nächstes werden die noch benötigten weiteren Screens hinzugefügt, die dann die jeweiligen Informationen enthalten sollen.
Schritt 3: Verknüpfung der Screens
Um von einem Screen zum nächsten zu wechseln benutzt man die Funtion Navigate.
Dieser gibt man zum einen den Screen-Namen an, zu dem man wechseln möchte und zum anderen die Art und weise wie dies geschehen soll.
Beispiel: Navigate (ScreenName,Transition!Fade)
Transitioneffekte im Überblick:
- Fade (Der aktuelle Screen wird immer transparenter)
- Cover (Der neue Screen schiebt sich von rechts nach links über den anderen)
- Uncover (Der aktuelle Screen verschiebt sich von links nach rechts aus dem Bild)
Diese Verknüpfung kann nun auf alle einzelnen Buttons gelegt werden, mit den jeweiligen Screenverknüpfungen.
Schritt 4: Gestaltung der Detailseiten
Als nächsten Schritt müssen wir nur noch die einzelnen Screens gestalten, welche die RSS Feads anzeigen sollen. Dabei gehen wir so vor, das wir erst einmal nur einen Screen gestalten und danch per copy und paste die Inhalte auf die anderen übertragen.
Als erstes benötigen wir einen zurück Button um wieder auf den Homescreen navigieren zu können. Diesem ordnen wir wieder die Funktion Navigate zu. Navigate(Home,Transition!Fade)
Nun fügen wir als neues Visual eine Gallery hinzu. Diese verknüpfen wir unter der Eigenschaft Data mit einer der enthaltenen RSS Data Sources.
Mann kann jetzt den einzelnen Gallery Elementen noch die korrekten Werte zuweisen in dem man in der Gallery die einzelnen Elemente anklickt und dann unter Data den richtigen Wert zuordnet.
Als nächstes möchten wir, das wenn dem Leser der Artikel gefällt, er die Möglichkeit hat auf der Originalseite mehr über das Thema zu erfahren. Dafür platzieren wir in dem erstellten Gallery-Element einen neuen Button. Dieser bekommt die Funktion "Launch" um externe Inhalte aufrufen zu können.
Hier ein Beispiel:
Launch(“http://www.bing.com”)
Konkret in diesem Fall wir folgende Syntax benötigt:
Launch(RSSQuelle!Link) Die RSSQuelle ist dann durch die jeweilige Datasource zu ersetzen.
Um sich nun etwas arbeit zu ersparen, kann man alle Objekte des aktuellen Screens kopieren und auf einem neuen Screen einfügen. Es muss dann nur noch die jeweilige Datenquelle des Galleryelementes einmalig geändert werden.
Jede erstellte App in Siena kann natürlich auch im offiziellen Microsoft Store veröffentlicht werden. Eine genaue Anleitung zu dem Thema werde ich demnächst veröffentlichen.
Hier schon mal meine App im Store: BILD RSS Feads
