Dropbox on Windows Phone 7 with DropNet

Posted by on

So I have been working on an open source Dropbox client library for a while now called DropNet. I have recently put this project into NuGet so its super easy to add Dropbox support to your Windows Phone 7 apps.

Update: The source for this sample project is available here: https://github.com/dkarzon/DropNet/tree/master/DropNet.Samples/DropNet.Samples.WP7

Update: The DropNet and DropNet-WP NuGet packages have been merged and allow for both Project Types.

I’ll start with a File -> New Project, creating a sample Windows Phone Application.

FileNew2

First thing to do is install the DropNet package, NuGet will automatically detect the type of project you are using and add the DropNet reference for that project type (eg. DropNet.WindowsPhone for Windows Phone 7 projects.)

DropNetNuGet

Ok, now we can start with the App, for starters I created a global variable for my DropNetClient instance.

GlobalClient = new DropNetClient("API KEY", "API SECRET");

Now from that we will need to let the user login so my main page has a basic login form, 2 textboxes for Email and Password and a button to make it work.

private void Login_Click(object sender, RoutedEventArgs e)
{
    //try login
    App.GlobalClient.LoginAsync(_model.Email, _model.Password,
        (response) =>
        {
            if (response.Data != null)
            {
                //DropNet automatically sets the result token inside the client
                NavigationService.Navigate(new Uri("/FilesPage.xaml", UriKind.Relative));
            }
        });
}

DropNets Login function automatically saves the user Token and Secret to its client instance so we dont have to set it. Then I just navigate to a new page where we will attempt to browse our Dropbox Folder.

This page has a basic view model with 1 property for the folders content.

private ObservableCollection<MetaData> _contents;
public ObservableCollection<MetaData> Contents
{
    get { return _contents; }
    set
    {
        _contents = value;
        NotifyPropertyChanged("Contents");
    }
}

Pretty easy, the page itself simply binds this collection to a listbox displaying the Name and an icon if its a folder.

Ok, now to actually get the data from Dropbox… We do this by calling our DropNetClient’s GetMetaDataAsync method. This method takes a path parameter so we can tell it which folder to get the metadata for.

App.GlobalClient.GetMetaDataAsync("/",
    (response) =>
    {
        foreach (var c in response.Data.Contents.OrderBy(f => f.Name).OrderByDescending(f => f.Is_Dir))
        {
            _model.Contents.Add(c);
        }
    });

Browse1

After getting the MetaData I then order it, folders first then alphabetically.

Wait, really? Thats it?

Yep! Thats my Dropbox folder.

Now to make it even better we can handle the listbox’s selection change event and if the selected item was a folder we can show its contents.

private void ListBox_SelectionChanged(object sender, System.Windows.Controls.SelectionChangedEventArgs e)
{
    if (e.AddedItems.Count > 0)
    {
        var selected = (e.AddedItems[0] as MetaData);

        //if its a folder browse to it
        if (selected.Is_Dir)
        {
            _model.Contents = new ObservableCollection<MetaData>();
            App.GlobalClient.GetMetaDataAsync(selected.Path,
            (response) =>
            {
                foreach (var c in response.Data.Contents.OrderBy(f => f.Name).OrderByDescending(f => f.Is_Dir))
                {
                    _model.Contents.Add(c);
                }
            });
        }
    }
}

There we go, thats the basis for a Dropbox app using DropNet, lets see what we can come up with!

DropNet Implements most of the API’s functions, including :

  • Uploading files
  • Downloading files
  • Creating folders
  • Creating an account
  • Getting account info
  • Deleting files/folders
  • Data usage counter

I’m always updating the project over at GitHub, drop by and let me know what you think or if you have any feature requests/bugs. GitHub Project.

Or check out the NuGet Package here.

Browse3 Browse2