Create Simple Twitter client with .Net for Windows Phone 7

As we know for now on, twitter has becoming a large social network these days. And it’s pretty great if we could develop a twitter client that made by ourselves.

Well, in this post, i will try to explain about how we doing this one. We will try to request a public timeline from twitter, get value from their xml file, store it to our local object and show it to our UI. You could do this one using windows application, WPF, Silverlight or whatever. I will not put any home timeline, mention, etc that required authentication. In handling OAuth with twitter, i will create a new post later.

We will try to create our simple tweet client using Windows Phone 7. Ok, lets start then…

Open your Visual Studio (either 2008 or 2010). In this example, i use Visual Studio 2010. Create your new WinPhone 7 Project. Name it whatever you like, and choose Windows Phone Application for the project’s template. You can refer to this picture below:

After you create your new project, you will get a view of design surface and markup, which you could easily customize it, based on your need.

Leave it the UI Design for now, and choose your project from solution explorer, right click choose Add > Class > named it TwitterItem.cs. This class is used as helper class to stored value from twitter.

In this class, we want to show up screen name, profile photo, twitter status, and application that the user used, to update their status.


Back to your UI Design, and add a listbox control to your main page, named it whatever you want for this control.

Go to your xaml markup for your main page, and add a listbox data template to show our twitter item. For our data template in listbox, i use grid for layout control, image for showing user profile pic, and 3 textblock controls to represent twitter screen name, status and what application that user use to update their twit.

Now you have your helper class, Listbox control to represent your twitter item value, and now, we will start to request for twitter data from twitter.com. Like i said before, in this example we will use public timeline of twitter to test our simple twitter client. So we don’t have to deal with OAuth at this moment. But once you want to get home, mention, direct message, send new tweet, then you should deal with OAuth. For that matter, you could google for .Net OAuth lib for twitter, or you could create your own helper.

For documentation of twitter API, you could go to this link. Based on twitter API, the url for requesting twitter public timeline is

http://api.twitter.com/version/statuses/public_timeline.format

where version is twitter API version and format is return format for this request. It supported json, xml, rss and atom. In this moment, we will use xml as our return value for our request. Ok, now we start doing to request public timeline in our code. Right click on your MainPage.xaml file, and choose view code menu.

Don’t forget to add reference of System.Xml.Linq to our solution project, and call it in our main page code by add:

using System.Xml.Linq;

For http web request, we will use WebClient class from System.Net namespace. Here is the mainPage.cs file look alike after we added a logic to request twitter public timeline.


// Constructor
public MainPage()
{
InitializeComponent();

//define onLoad Event Handler
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
}


void MainPage_Loaded(object sender, RoutedEventArgs e)
{
//Initialize WebClient instance
WebClient wc = new WebClient();

//define url for twitter public timeline based on Twitter API
string url = @"http://api.twitter.com/1/statuses/public_timeline.xml";

//Call download resource from url
wc.DownloadStringAsync(new Uri(url));

//add event handler for completed process
wc.DownloadStringCompleted += new DownloadStringCompletedEventHandler(wc_DownloadStringCompleted);
}


void wc_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
//check if there is any error
if (e.Error != null)
{
//do error handler
MessageBox.Show(e.Error.Message, "My Simple Twit Client", MessageBoxButton.OK);
return;
}

//if no error occured, then iterate value from xml file
//and stored it to our helper class
XElement xmlResult = XElement.Parse(e.Result);
var result = from t in xmlResult.Descendants("status")
select new TwitterItem
{
ProfilePhoto = t.Element("user").Element("profile_image_url").Value,
ScreenName = t.Element("user").Element("screen_name").Value,
Status = t.Element("text").Value,
Via = t.Element("source").Value
};

//last, binding our result value to listbox control
mainListBox.ItemsSource = result;
}

After all of required setup, press F5 to debug your application. And here’s the result for our simple twitter client for getting public timeline.

Notice that our via content value is still in html tag. The simplest way is use XElement class to get value from this one. I created helper method to deal with this one.

string GetRealContent(string value)
{
try
{
return XElement.Parse(value).Value;
}
catch (Exception)
{
return value;
}
}

And, update our wc_DownloadStringCompleted method to

//check if there is any error
if (e.Error != null)
{
//do error handler
MessageBox.Show(e.Error.Message, "My Simple Twit Client", MessageBoxButton.OK);
return;
}

//if no error occured, then iterate value from xml file
//and stored it to our helper class
XElement xmlResult = XElement.Parse(e.Result);
var result = from t in xmlResult.Descendants("status")
select new TwitterItem
{
ProfilePhoto = t.Element("user").Element("profile_image_url").Value,
ScreenName = t.Element("user").Element("screen_name").Value,
Status = t.Element("text").Value,
Via = GetRealContent(t.Element("source").Value)
};

//last, binding our result value to listbox control
mainListBox.ItemsSource = result;

That’s it, try to press F5 again, and now, your via will show it’s html content without html tag.

You can download complete solution and source code in here.

Where we are going from here? You could try to googling about handilng OAuth in .Net. There’re several library to do this one. I found a nice blog by Shannon Whitley with example how we dealing with OAuth in .Net. You can start from there.

That’s it, next i will create a post to handling with authentication in twitter in .Net.

Happy Coding 🙂

Advertisements

4 thoughts on “Create Simple Twitter client with .Net for Windows Phone 7

  1. Um dude the link to the Source Code is non existent…Do you think you can update me with a proper link because I need this tutorial!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s