Click here to Skip to main content
13,195,170 members (71,315 online)
Click here to Skip to main content
Add your own
alternative version


3 bookmarked
Posted 19 Mar 2010

SPList Image and SPFile Icon

, 2 Apr 2010
Rate this:
Please Sign up or sign in to vote.
Take advantage of SPList.ImageUrl and SPFile.IconUrl to improve the user experience of WinForm apps for SharePoint.

If you ever wanted to create a WinForms app for SharePoint that displays or interacts with lists, document libraries and files, then taking advantage of the SPList.ImageUrl and SPFile.IconUrl would help improve the user experience for your app.

Below is an app that displays all the webs, lists, document libraries and files in a selected site collection.

We can improve this a little bit by adding icons (taken from TEMPLATE\IMAGES folder on a SharePoint installation) for some of the nodes, as follows:

However, this is not good enough since we'll have all lists with the same icon, all doc libs with the same icon and so on… Here is the same app taking advantage of the list image URL and file icon URL.

For the list or document library, this is done by using the SPList.ImageUrl attribute. Here is how the tree node was added:

TreeNode listNode = parentNode.Nodes.Add(list.Title);
listNode.SelectedImageIndex = listNode.ImageIndex = 

For the file, this is done by using the SPFile.IconUrl attribute. Here is how the tree node was added:

TreeNode fileNode = parentNode.Nodes.Add(file.Name);
fileNode.SelectedImageIndex = fileNode.ImageIndex = 

The GetImageFullPath method simply gets the full path of the image:

/// <span class="code-SummaryComment"><summary>
</span>/// Gets the SharePoint full path from the relative path
/// <span class="code-SummaryComment"></summary>
</span>/// <span class="code-SummaryComment"><param name="relativePath"></param>
</span>/// <span class="code-SummaryComment"><returns></returns>
</span>private static string GetImageFullPath(string relativePath)
    //  Get image name
    string imageName = Path.GetFileName(relativePath);

    //  Get SharePoint IMAGES folder path
    string fullPath = SPUtility.GetGenericSetupPath(@"TEMPLATE\IMAGES");

    return Path.Combine(fullPath, imageName);

Given that now we have the full file system path to the image, all we have to do is create an image from the file path, then add it to the ImageList of the TreeView. The GetImage() method below does the job:

/// <span class="code-SummaryComment"><summary>
</span>/// Gets the image of the sp element from specified URL
/// <span class="code-SummaryComment"></summary>
</span>/// <span class="code-SummaryComment"><param name="url"></param>
</span>/// <span class="code-SummaryComment"><returns></returns>
</span>private int GetImage(string url)
    //  Get image index from the Image List
    int imageIndex = spImageList.Images.IndexOfKey(url);

    //  Image is not in the list, so add it
    if (imageIndex == -1)
        //  Get the image from specified path
        Image image = Image.FromFile(url);

        //  Add the image to the image list
        spImageList.Images.Add(url, image);

        //  Get its index
        imageIndex = spImageList.Images.Count - 1;

    return imageIndex;

Here is how the final app looks like. Click on the image below to download the source and EXE.

Filed under: SharePoint Tagged: IconUrl, ImageUrl, SPDocumentLibrary, SPFile, SPList


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Ali BaderEddin
Software Developer Qualtrics
United States United States

You may also be interested in...

Comments and Discussions

GeneralMy vote of 5 Pin
Dilip Nikam27-Sep-12 5:48
memberDilip Nikam27-Sep-12 5:48 
GeneralI am started in C# Pin
engwaleed024-Mar-10 12:23
memberengwaleed024-Mar-10 12:23 
Blush | :O Thanks for you
I am from syria
I am studying communication
I ask you if you have anything for application about Communication in C#

I am started in C#

I hope to help me

thanks Blush | :O
GeneralRe: I am started in C# Pin
Ali BaderEddin24-Mar-10 14:51
memberAli BaderEddin24-Mar-10 14:51 
GeneralNice article Pin
Mohd Arshad (Sam)19-Mar-10 10:26
memberMohd Arshad (Sam)19-Mar-10 10:26 
GeneralRe: Nice article Pin
Ali BaderEddin19-Mar-10 11:35
memberAli BaderEddin19-Mar-10 11:35 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.171019.1 | Last Updated 3 Apr 2010
Article Copyright 2010 by Ali BaderEddin
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid