Anzeigen von Daten aus Twitter in einer Projekt Siena-App

In Project Siena können Sie eine Windows Store-App erstellen, in der Benutzer ihre Zeitachse anzeigen, anhand von Schlüsselwörtern nach anderen Benutzer suchen, anderen Benutzern folgen bzw. nicht mehr folgen und andere Daten aus Twitter anzeigen können. Sie können einen vorkonfigurierten Satz von Benutzeroberflächenelementen, der als zusammengesetztes Steuerelement bezeichnet wird, hinzufügen und anpassen, oder Sie können Galerien, Bilder, Bezeichnungen und andere Elemente je nach Bedarf einzeln hinzufügen. Wenn Sie mit dem Verhalten Ihrer App zufrieden sind, müssen Sie sich bei Twitter anmelden und die Datenverbindung konfigurieren, damit Sie Ihre App veröffentlichen können.

Eine Übersicht und App-Demos finden Sie unter Microsoft Project Siena.

In diesem Thema

Voraussetzungen

  • Project Siena, das kostenlos aus dem Windows Store heruntergeladen werden kann.

    Systemanforderungen und andere Informationen finden Sie in den Anmerkungen zu dieser Version.

  • Eine Internetverbindung sowie Anmeldeinformationen für ein Twitter-Konto.

  • Ein API-Schlüssel, ein API-Geheimnis sowie eine Rückruf-URL, wenn Sie Ihre App veröffentlichen möchten. Wenn Sie nicht Teil einer Organisation sind, die Ihnen diese Informationen zur Verfügung stellen kann, lesen Sie die Twitter-Seite für Entwickler.

  1. Starten Sie Project Siena, indem Sie auf dem Startbildschirm auf die entsprechende Kachel klicken oder tippen.

    Hinweis Hinweis

    Wenn Sie Project Siena installiert haben, die entsprechende Kachel jedoch nicht finden können, können Sie danach suchen, indem Sie einen Teil bzw. den gesamten Namen eingeben, während der Startbildschirm angezeigt wird. Wenn Sie Microsoft Project Siena in den Suchergebnissen finden, können Sie die Kachel an den Startbildschirm anheften, indem Sie mit der rechten Maustaste auf das Ergebnis klicken und dann auf An "Start" anheften klicken. Wenn die Kachel bereits angeheftet ist oder Sie sie nicht anheften möchten, können Sie Project Siena durch Klicken auf das Suchergebnis öffnen.

  2. Klicken Sie in der Mitte des Bildschirms auf Visuelles Steuerelement hinzufügen, um eine Liste von Benutzeroberflächenelementen hinzuzufügen, die Sie Ihrer App hinzufügen können.

    Wenn der Bildschirm Benutzeroberflächenelemente enthält, können Sie in der oberen rechten Ecke des Arbeitsbereichs auf das Pluszeichen klicken, um dieselbe Liste anzuzeigen.

  3. Klicken Sie in der Elementliste auf Sozial, und klicken Sie dann auf Twitter-Personensuche.

  4. Geben Sie im Fenster Mit einem Dienst verbinden die Anmeldeinformationen für Ihr Twitter-Konto ein, und klicken Sie dann auf Anmelden.

    In der linken oberen Ecke des angezeigten Bildschirms wird ein Bild und eine Bezeichnung angezeigt. Darunter wird ein Steuerelement für Eingabetext und wieder darunter eine Galerie angezeigt. Diese Elemente sind leichter zu erkennen, wenn Sie nicht die Maus davon weg bewegen.

  5. (Optional) Geben Sie eine oder mehr Suchbegriffe in das Suchfeld ein, sodass andere Benutzer angezeigt werden.

  6. (Optional) Zeigen Sie in den Suchergebnissen eine Beschreibung statt der Bildschirmnamen an:

    1. Klicken Sie im ersten Suchergebnis auf den Bildschirmnamen, der mit @ beginnt.

      Um das Element herum wird ein graues Feld mit einem dicken Rahmen angezeigt, wodurch angegeben wird, dass Sie es ausgewählt haben.

    2. Klicken Sie in der linken unteren Ecke des Arbeitsbereichs auf Text, und geben Sie dann die folgende Funktion in das Textfeld fx ein (bzw. fügen Sie sie ein):

      DiesesElement!description

  1. Entfernen Sie den Cursor von den Elementen auf dem Bildschirm, um sicherzustellen, dass keines ausgewählt ist.

  2. Klicken Sie in der oberen rechten Ecke des Arbeitsbereichs auf das Pluszeichen, und klicken Sie dann in der angezeigten Liste auf Schaltfläche.

    In der linken oberen Ecke des Bildschirms wird eine Schaltfläche angezeigt, die sich jedoch an der falschen Stelle befindet. Um die Schaltfläche herum wird ein graues Feld mit einem dicken Rahmen angezeigt; Sie können die Schaltfläche verschieben, indem Sie das Auswahlfeld ziehen.

  3. Verschieben Sie die Schaltfläche so, dass sie unter der Galerie angezeigt wird, und klicken Sie dann in der linken unteren Ecke des Arbeitsbereichs auf Text.

  4. Ersetzen Sie im Dialogfeld Text den Standardtext durch "Folgen" im Textfeld fx.

  5. Klicken Sie am unteren Ende des Arbeitsbereichs auf OnSelect, und ersetzen Sie dann den Standardtext durch die folgende Funktion im Textfeld fx:

    Twitter!Follow(Gallery1!Selected!screen_name)

  6. Klicken Sie das Suchfeld und geben Sie dann einen oder mehr Schlüsselbegriffe ein, sodass Sie Personen finden, denen Sie folgen möchten.

  7. Klicken Sie in den Suchergebnissen auf das Konto einer Person, der Sie folgen möchten, und klicken Sie dann auf Folgen.

    Hinweis Hinweis

    Wenn Sie Ihre App entwerfen, können Sie diese Schaltfläche nicht verwenden, um der Person oder dem Konto zu folgen, die bzw. das in den Suchergebnissen an erster Stelle angezeigt wird. Die Schaltfläche funktioniert jedoch, wenn Sie die App in der Vorschau anzeigen oder veröffentlichen. Um die App in der Vorschau anzuzeigen, klicken Sie mit der rechten Maustaste auf eine beliebige Stelle im Arbeitsbereich. Klicken Sie dann in der Ecke rechts oben auf Vorschau, klicken Sie auf das erste Suchergebnis, und klicken Sie dann auf Folgen. Um zum Entwurfsprozeß zurückzukehren, drücken Sie ESC.

  1. Klicken Sie in der oberen rechten Ecke des Arbeitsbereichs auf das Pluszeichen, klicken Sie auf Galerien, und klicken Sie dann auf die vertikale Benutzerdefinierte Galerie.

  2. Verschieben Sie die neue Galerie, und ändern Sie ihre Größe so, dass sie die rechte Hälfte des Bildschirms bedeckt.

    Sie können die Größe eines ausgewählten Elements ändern, indem Sie ein kleines, weißes Quadrat oder Rechteck in dem grauen Auswahlfeld mit dem dicken Rahmen ziehen.

  3. Während die neue Galerie ausgewählt ist, klicken Sie in der linken unteren Ecke des Arbeitsbereichs auf Elemente.

  4. Ersetzen Sie im Textfeld fx den Standardtext durch die folgende Funktion, und geben Sie dabei Ihren Bildschirmnamen an (bzw. den Bildschirmnamen eines anderen Benutzers).

    Twitter!UserTweets("Bildschirmname")

    Hinweis Hinweis

    Um Tweets von einem Benutzer anzuzeigen, den Sie in den Suchergebnissen gefunden haben, ersetzen Sie "Bildschirmname" in der Funktion oben durch Gallery1!Selected!Bildschirmname, und klicken Sie dann auf den Benutzer, dessen Tweets Sie anzeigen möchten.

  5. Klicken Sie in der Galerie, die Sie konfigurieren auf Visuelles Steuerelement hinzufügen, und klicken Sie dann in der Liste mit Benutzeroberflächenelementen auf Bezeichnung.

    Die Galerie zeigt das Datum und die Uhrzeit der neuesten Tweets an. Das erste Element in der Galerie ist eine Vorlage für alle Elemente in der Galerie. Alle Änderungen, die sie daher an dem ersten Element vornehmen, werden auf alle Elemente angewendet.

    Hinweis Hinweis

    Wenn keine Daten angezeigt werden, überprüfen Sie, ob der Benutzer über ein geschütztes Konto verfügt. Wenn dies der Fall ist, überprüfen Sie, ob Sie über die Berechtigung zum Anzeigen dieser Tweets verfügen.

  6. Erweitern Sie die Bezeichnung so, dass alle Informationen in einer Zeile angezeigt werden.

  7. Öffnen Sie die Liste mit Benutzeroberflächenelementen, fügen Sie dem ersten Element in der Galerie eine weitere Bezeichnung hinzu, und ändern Sie die Größe der neuen Bezeichnung so, dass ein Großteil dieses Elements bedeckt ist.

  8. Während die zweite Bezeichnung ausgewählt ist, klicken Sie in der linken unteren Ecke des Arbeitsbereichs auf Text, und ersetzen Sie dann den Standardtext durch die folgende Funktion im Textfeld fx:

    DiesesElement!Text

    Sie können durch die Galerie blättern, um die neuesten Tweets von dem angegebenen Benutzer anzuzeigen.

  9. (Optional) Machen Sie Tweets einfacher lesbar, indem Sie die den Text vergrößern:

    1. Während die Bezeichnung ausgewählt ist, klicken Sie am unteren Rand des Arbeitsbereichs auf Entwurf, und klicken Sie dann auf Text.

    2. Klicken Sie auf das Symbol Größe (links, zweites von oben), und ziehen Sie dann den Schieberegler, bis der Text die gewünschte Größe aufweist.

      Alternativ können Sie einen Wert, z. B. 20, in das Textfeld fx eingeben.

  1. Klicken Sie auf das untere Ende der Tweet-Galerie, um sie auszuwählen. Klicken Sie dann in der linken unteren Ecke des Arbeitsbereichs auf Daten, klicken Sie auf Elemente, und ersetzen Sie dann den Text im Textfeld fx durch die folgende Funktion:

    Twitter!Timeline()

    In der Galerie werden Tweets von allen Benutzern angezeigt, denen Sie folgen.

  2. (Optional) Fügen Sie eine Bezeichnung hinzu, um den vollständigen Namen oder den Bildschirmnamen der Person anzuzeigen, die den jeweiligen Tweet veröffentlicht hat:

    1. Klicken Sie auf das obere Ende der Tweet-Galerie, um die Elementvorlage auszuwählen.

    2. Öffnen Sie die Liste der Benutzeroberflächenelemente, klicken Sie auf Bezeichnung, und verschieben Sie dann die Bezeichnung, die Sie gerade hinzugefügt haben, in die obere rechte Ecke der Elementvorlage.

    3. Klicken Sie in der linken unteren Ecke des Arbeitsbereichs auf Text, und ersetzen Sie dann den Standardtext durch die folgende Funktion im Textfeld fx:

      DiesesElement!user!name

      DiesesElement!user!screen_name

  1. Wenn die obere App-Leiste nicht angezeigt wird, klicken Sie mit der rechten Maustaste auf eine beliebige Position im Arbeitsbereich.

  2. Klicken Sie im Menü App-Daten auf Datenquellen.

  3. Klicken Sie unter Vorhandene Quellen, auf Twitter, und klicken Sie dann auf Dienstkonfiguration.

  4. Geben Sie die angeforderten Informationen ein, und klicken Sie auf Anwenden.

Anzeigen: