Skip to content

19 novembre 2010 | Rédigé par Axon

7

Réaliser un mini client Twitter [Tutoriel Windows n°2]

Enfin un tutoriel Windows Phone ! Déjà 20 tutoriels Android, 8 tutoriels iPhone et seulement 2 tutoriels Windows Phone, quel honte ! :D Bon en plus, je ne vous cache pas que je ne savais pas trop quoi faire comme tutoriel pour cette plateforme. Je n’étais pas très inspiré alors j’ai cherché un petit peu sur le net pour voir ce qui existait déjà et j’ai trouvé un tuto réalisé par David Rousset. Il nous apprend à réaliser très facilement un mini client Twitter. J’ai donc décidé de le partager avec vous pour sa simplicité et son efficacité.

Comme il est très bien fait je ne vais pas le refaire, je vous invite donc à aller le découvrir ici. Par contre je vais vous mettre tout le code source en une seul fois pour que vous n’ayez qu’à faire un seul copier/coller par fichier. Cependant cela ne remplace en rien le tuto de David Rousset, car il faut le suivre pour réaliser l’interface graphique ou importer les bonnes librairies entre autre.

Donc dans le fichier MainPage.xaml.cs insérez le code suivant :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
using System.Xml.Linq;
 
namespace MiniTwitter
{
    public partial class MainPage : PhoneApplicationPage
    {
        public MainPage()
        {
            InitializeComponent();
 
            SupportedOrientations = SupportedPageOrientation.Portrait | SupportedPageOrientation.Landscape;
        }
 
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            WebClient twitter = new WebClient();
 
            twitter.DownloadStringCompleted += new DownloadStringCompletedEventHandler(twitter_DownloadStringCompleted);
            twitter.DownloadStringAsync(new Uri("http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=" + textBox1.Text));
        }
 
        void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
        {
            if (e.Error != null)
                return;
 
            XElement xmlTweets = XElement.Parse(e.Result);
 
            listBox1.ItemsSource = from tweet in xmlTweets.Descendants("status")
                                   select new TwitterItem
                                   {
                                       ImageSource =
                                         tweet.Element("user").Element("profile_image_url").Value.ToString(),
                                       Message =
                                         tweet.Element("text").Value.ToString(),
                                       UserName =
                                         tweet.Element("user").Element("screen_name").Value.ToString()
                                   };
        }
    }
}

Votre fichier MainPage.xaml doit ressembler à ceci :

<phoneNavigation:PhoneApplicationPage 
    x:Class="TMiniTwitter.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phoneNavigation="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Navigation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}">
 
    <Grid x:Name="LayoutRoot" Background="{StaticResource PhoneBackgroundBrush}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
 
        <!--TitleGrid is the name of the application and page title-->
        <Grid x:Name="TitleGrid" Grid.Row="0">
            <TextBlock Text="http://www.tutomobile.fr" x:Name="textBlockPageTitle" Style="{StaticResource PhoneTextPageTitle1Style}" Margin="20,20,0,0" />
            <TextBlock Text="Twitter" x:Name="textBlockListTitle" Style="{StaticResource PhoneTextPageTitle2Style}" Margin="20,43,0,0" />
        </Grid>
 
        <!--ContentGrid is empty. Place new content here-->
        <Grid x:Name="ContentGrid" Grid.Row="1">
            <Button Content="Voir les tweets !" Height="70" HorizontalAlignment="Left" Margin="258,0,0,0" Name="button1" VerticalAlignment="Top" Width="216" Click="button1_Click" />
            <TextBox Height="32" HorizontalAlignment="Left" Margin="6,0,0,0" Name="textBox1" Text="" VerticalAlignment="Top" Width="263" />
            <ListBox Height="568" HorizontalAlignment="Left" Margin="0,78,0,0" Name="listBox1" VerticalAlignment="Top" Width="480" >
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Height="150">
                            <Image Source="{Binding ImageSource}" Height="75" 
                   VerticalAlignment="Top" Margin="0,0,5,0"/>
                            <StackPanel Width="370">
                                <TextBlock Text="{Binding UserName}" Foreground="Yellow" FontSize="26" />
                                <TextBlock Text="{Binding Message}" TextWrapping="Wrap" FontSize="22" />
                            </StackPanel>
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </Grid>
    </Grid>
 
</phoneNavigation:PhoneApplicationPage>

Et enfin la classe TwitterItem.cs que vous devez avoir créée doit contenir le code suivant :

using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
 
namespace MiniTwitter
{
    public class TwitterItem
    {
        public string UserName { get; set; }
        public string Message { get; set; }
        public string ImageSource { get; set; }
 
    }
 
}

Et normalement, si tout se passe bien lorsque vous compilez et que vous lancez le projet, tout devrait fonctionner. Voilà ce que j’ai obtenu :

Si vous rencontrez le moindre soucis, n’hésitez pas à me poser des questions via les commentaires. Sinon je fais appel à vous pour me donner des idées de tuto Windows Phone donc si vous en avez donnez les moi via la page de contact. Merci à vous et à très vite j’espère pour un prochain tuto Windows Phone.

Découvrez d'autre articles de la catégorie Tutoriels Windows Phone 7

Encore un peu de lecture :

7 Commentaires Poster un commentaire
  1. lucianot54
    20 nov 2010

    Salut,
    J’ai déjà fait le tuto la sur un autre site. Il est bien mais tu récupères seulement les tweets des personnes publics. Pour récupérer les tweets de tes amies il faut te connecter avec Oauth.

    En se moment je développe une application pour récupérer les données sur facebook et twitter. Si j’ai le temps, je te ferai un tuto dessus.

    Et quand j’aurai encore plus le temps, je reprendrais les tuto android ^^.

  2. 20 nov 2010

    @lucianot54 : oh oui volontiers se serait très intéressant comme tuto ! ;) Merci d’avoir laissé un petit com’ ! :)

  3. jonathan
    13 déc 2010

    Je suis en train de développer une application de réalité augmenté. Si tu penses que ça peut t’intéresser, dis-le moi, je pourrais te préparer un tuto.

  4. 13 déc 2010

    @Jonathan : au que oui ça m’intéresse je t’envoi un mail ;)

  5. 24 jan 2011

    Ca serait bien un petit tuto’ sur les Webview de chez Microsoft (WebBrowser ) non ?!

  6. TecKnologikS
    26 mai 2011

    Mdr tu fait de la pub pour moi =) Reponse a RobPauquet =)

Trackbacks & Pingbacks

  1. Les tweets qui mentionnent Tutoriel Windows Phone 7 : réaliser un mini client Twitter | Tuto Mobile -- Topsy.com

Une question, une suggestion, une opinion? Partagez ce que vous pensez, laissez un commentaire.

(obligatoire)
(obligatoire)

Note: Votre adresse email ne sera jamais publiée.

Suivez les réponses aux commentaires