VSTO & .NET & Excel

October 27, 2011

Axialis Stock Icons For Toolbar & Ribbon

Filed under: .NET & Excel, Excel, UI Design — Dennis M Wallentin @ 5:43 pm

I’m the first to admit that I have moved forward and backward when it comes to stock icons and which icons to use. The UI plays a critical role in all kind of softwares which means that we also need to consider what kind of icons to be used. With the introduction of Ribbon UI I would say that the design has become even more important. It requires a larger area of the hosted Windows.

When I design UIs I try to put myself in the role of an end user who spends a considerable time with my solutions in Excel. Some cool UI design is no longer cool after two weeks use where the user spends perhaps 10-15 hours during that period using the solution.

However I cannot say that I’m well educated when it comes to design. I try to follow Microsoft’s concept for designing Ribbon UIs.

The following screen shot shows examples of the new stock icons from Axialis who has recently started out to offer complete icons sets. Yes, it’s the same company who also offers the great icon creator tool, IconWorkshop.


Personally I prefer light-weighted colored icons with a soft tone and that is also what the new icon set, Axialis Ribbon & Toolbar Stock Icons, offers. What we get is an improved professional UI.

It’s easy to forget that in VS.NET we cannot use resource files that have names like “aaa bbb.ping”. So if we use let say 16 icon files we need to rename them all before using them. Axialis has managed to keep that in mind and therefore all icon files have names like “aaa_bbb.ping”.

This is what Axialis writes about the new released icons:/
Icons are available in sizes 16×16, 24×24, 32×32, 48×48 and normal, hot & disabled states. Provided file formats are PNG, ICO and BMP. Colors are coded in RGB with alpha channel transparency in PNG and ICO icons. BMP icons are coded in RGB with magenta areas to define transparency.

For more information please visit one of the links. I also recommend visiting their homepage on a more regular basis as they plan to release more stock icons sets.

Kind regards,
Dennis

December 8, 2010

Ribbon UI: Syncfusion’s Essential Tools & Professional-Icons.com

Filed under: .NET & Excel, Excel, Tools, UI Design, VSTO & Excel — Dennis M Wallentin @ 8:14 pm

From time to time I come to think of how important it is with a user-friendly and with a professional Graphical User Interface (GUI). Of course, this is something that every developer sooner or later finds out themselves. What matters and what clients usually see is the GUI that the technical solutions are wrapped in.

In this article I will try to discuss my tools I use to create a GUI that can be competitive. I will do it by using the Ribbon UI, aka Office UI, and see which tools that is necessary in order to create the UI. I will not cover any guidelines to create the UI only which tools that are necessary in order to build the GUI.

Ever since Microsoft released its Office UI they have had a strong desire to protect the intellectual property (ip) of it. From what I know it appears to be the first time Microsoft actually has taken this action. To protect their ip Microsoft request every vendor, that wish to implement the Ribbon UI in their software solutions, to apply for a license in order to use the UI. It should be noted that it exist some exceptions from this request.

To apply for a license to use the Office UI is rather easy and is also free. To find out more about it please see the following; Office UI Licensing. What is notable is that if we have got a license to use Office UI 2007 we need to update the license to also include the Office UI 2010.

Due to my lack of knowledge about the law I don’t know to which extend we must apply for licenses when developing add-ins and standalone workbooks with customized Office UI in Excel.

So far I have only applied for licenses for my free and commercial add-ins that have customized Office UI but not for any clients’ solutions.

VS 2010 is shipped with some basic controls together with some simple icons. I say basic because the controls do what they are supposed to do but provide no flexibility and no extra that actually can light up the solutions. If we want to use the Office UI we must buy the required controls from a third-party since Microsoft does not provide us with such controls. On the market it exist a great number of vendors that offer a great number of powerful controls.

As for the icons we face the same situation as with the controls for the Ribbon UI. However it exist a larger groups of free icons with various quality on the Internet and without any support at all. An advantage with icons, compared with the controls, is that we can use the built-in icons shipped with Office. These icons are quite common which may be a limitation if we want to create more relevant and unique UIs. Third-party provides us with icons that reflect specific tasks and activities and the vendors usually provide us with support.

Personally I try to always get commercial tools as I then get good products with support and an access to larger knowledge base. Through the years I have used several vendors but previously this year I changed my strategy. Instead of using many vendors I decided to only have a very few vendors. Actually, I ended up with two vendors; Syncfusion for all the Windows Form Controls and Professional-Icons.com for all the icons.

I decided to use Syncfusion for a various reasons including very good and powerful controls together with an excellent support. Syncfusion’s packages are not among the cheapest on the market but I think they offer a high ROI, especially if we learn how to leverage them. At least that’s my experience. An expression I picked up for many years says: quality goes never out of style. Syncfusion has that kind of quality and their products are robust and reliable for all kind of software development.

When building the Ribbon UI (see below) I used several controls from the Syncfusion’s Essential Tools also for creating the framework for the Ribbon UI. It’s straightforward and quite easy to build this UI, especially if You have done it a couple of times. The Ribbon UI control can, in addition to work with Windows Form Controls, also work well with other .NET controls. For a good introduction about the main control RibbonControl Adv please click here.

So far I have only been talking about Windows Form controls but nothing about the icons. The icons from Professional-Icons.com come with a great number of file formats including ICO, PNG, GIF, JPEG and BMP. The icons shipped come also in various sizes from 16 x 16 to 256 x 256. They ship the icons in various packages such as Applications, Accounting, Business, Medical and many more. Professional-Icons.com also offers some bundles of their packages that give better prices then buying the packages one by one. In my experience I rarely can only use one package of icons. It’s more common that I need icons from at least from two packages like Business and Network or Database. Again, Professional-Icons.com’s products are not the cheapest on the market but by selecting them You get great icons with high quality and also a very good support.

The following screen shot shows Syncfusion’s Windows Form controls and Professional-Icons.com’s icons in use in a Ribbon UI. This is actually a stripped version of a client’s solution.

Personally I find the screen shot to be very nice and reflect the quality I want to achieve when building UI in my clients’ solutions.

What do You think and how do You work to create user-friendly UI?

Kind regards,
Dennis

PS: Syncfusion offers also great controls for ASP.NET/ASP.NET MVC, WPF and Silverlight

August 9, 2010

Working with Folders

Filed under: .NET & Excel, UI Design, VSTO & Excel — Dennis M Wallentin @ 10:48 pm

Introduction

It’s quite often that we need to work with folders in various Excel solutions. It involves creating, deleting, moving, copying and update folders with or without any user interactions.

In this article I will discuss and show the code in order to work with folders. In the first part I will cover the basic processes to handle folders and in the second part of the article I will discuss folders and some user interactions.

Before we start up we should make sure that we have a reference to the System.IO namespace in the project and that we have made an import statement at the top of the class module. We will be using classes and methods that reside in that namespace.

Basic work with Folders
In the first example we will create a new folder named “Code” within a user’s folder system. That is done as the following code snippet shows:

Const NewFolder As String = "c:\Users\Dennis Wallentin\Document\Code"

If Not Directory.Exists(NewFolder) Then
'If it not already exist we create the folder.
Directory.CreateDirectory(NewFolder)
End If

To delete an empty folder is also quite easy to do which the below code snippet also shows:

Const DeleteFolder As String = "c:\Users\Dennis Wallentin\Document\Code"

If Directory.Exists(DeleteFolder) Then
'If it exist we delete the folder.
Directory.Delete(DeleteFolder)
End If

But what if we want to delete folders that contain files? The above code will throw an exception if the folder is not empty. By setting the second argument explicit to “True” in the Delete method a recursive deleting of all files is executed. That includes also all the subfolders in the targeting folder. The following code snippet shows it:

Const DeleteFolder As String = "c:\Users\Dennis Wallentin\Document\Code"

If Directory.Exists(DeleteFolder) Then
'If it exist we delete all the files and the folder.
Directory.Delete(DeleteFolder, True)
End If

To move files and subfolders from one location to another is also an easy task to achieve. What should be noted is that the old folder is always deleted and that the new folder cannot exist when the code is being executed. If the folder already exists the code will throw an exception. The code snippet below shows the details.

Const Folder As String = "c:\Users\Dennis Wallentin\Document\Code"
Const Target As String = "c:\Test\Dennis"

If Directory.Exists(Folder) Then
'The new folder cannot exist.
If Not Directory.Exists(Target) Then
'Move file and subdirectories to
'the new created folder and delete
'the old folder.
Directory.Move(Folder, Target)
End If
End If

To copy a folder’s content to a new location requires another strategy then what we so far have been used. Instead we must use the method My.Computer.FileSystem.CopyDirectory which also the following code shows. The last parameter controls if any existing files should be overwritten or not.

Const Folder As String = "c:\Users\Dennis Wallentin\Document\Dennis"
Const Target As String = "c:\Test\Backup"

If Directory.Exists(Folder) Then
'If the destination folder does not exist it
'will automatically be created.
My.Computer.FileSystem.CopyDirectory(sourceDirectoryName:=Folder,
destinationDirectoryName:=Target, overwrite:=True)
End If

The CopyDirectory method has two additional parameters that we can use whereof one can be rather useful here. If we know that we will be handling large files or a great number of files that will take some time to copy then we can let the users know about it. To do so we add the parameter ShowUI to the code as the below code also shows.

'On top of the CLass module
Imports System.IO
Imports Microsoft.VisualBasic.FileIO
'...

Const Folder As String = "c:\Users\Dennis Wallentin\Document\Dennis"
Const Target As String = "c:\Test\Backup"

If Directory.Exists(Folder) Then
'If the destination folder does not exist it
'will automatically be created.
My.Computer.FileSystem.CopyDirectory(sourceDirectoryName:=Folder,
destinationDirectoryName:=Target, showUI:=UIOption.AllDialogs)
End If

When executing the code the following Progress Dialog in Windows 7 is showed (the option UIOption.AllDialog makes it possible):


And as we also can see from the screen shot the user can cancel the operation if necessary. Since the other methods of My.Computer.FileSystem are focused on single items they are of little interest in this context.

If You are used to use the SHFileOperation Function then it has been replaced with the IFileOperation Interface. For more information about the later please see IFileOperation Interface.

Some words about Special Folders
It’s beyond the scope for this article to discuss SpecialFolders but I would like to show a basic example on how we can work with Special Folders.

In the following example we will retrieve the path to My Documents folder for the current user:

Dim MyDocuments As String = Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments)

MessageBox.Show(MyDocuments.ToString)

As we can see, to get access to the special folders we use the Environment.SpecialFolder.MyDocuments to access to MyDocuments Special Folder. When executing the above code we get the following information:


Folders & User Interactions
The UI design for the two cases, with some user interactions involved, is showed in the below screen shot.

In the first case the user click on a button in order to populate the ListBox control with names of Excel files. To get the file names from the pre-decided location we use the following code in the Click event for the button:

Private Sub btnFixedFolder_Click(ByVal sender As System.Object,
ByVal e As System.EventArgs) _
Handles btnFixedFolder.Click

Const Folder As String = "C:\Users\Dennis Wallentin\Documents\Fixed Folder"

Dim dirInfo As New DirectoryInfo(Folder)
Dim ArrayFiles As FileInfo() = dirInfo.GetFiles("*.xlsx")

Me.lbFixedFolder.DataSource = ArrayFiles
End Sub

When executing the code the outcome is what the below screen shot shows:

If we need to iterate through the collection of files in the array it’s also quite easy to do. The following code shows an example where we extract the files names and add them to the ListBox:

For Each item In ArrayFiles
strBuilder = New StringBuilder(item.Name)
strBuilder.Replace(".xlsx", String.Empty)
Me.lbFixedFolder.Items.Add(strBuilder)
Next

In the next case the users must select a source folder. To let the users choose folder we add the FolderBrowserDialog control to the project. The following code makes the Folder Browser Dialog available to the users and populates the ListBox control with the Excel files from the selected folder:

Private Sub btnUserFolder_Click(ByVal sender As System.Object,
ByVal e As System.EventArgs) _
Handles btnUserFolder.Click

Const Title As String = "Select a folder for the documents:"
Me.FolderBrowserDialog1.Description = Title

If Me.FolderBrowserDialog1.ShowDialog = Windows.Forms.DialogResult.OK Then

Dim Folder As String = Me.FolderBrowserDialog1.SelectedPath
Dim dirInfo As New DirectoryInfo(Folder)
Dim ArrayFiles As FileInfo() = dirInfo.GetFiles("*.xlsx")

Me.lbUserFolder.DataSource = ArrayFiles

End If

End Sub

When the code is executed the Folder Browser Dialog is launched as the following screen shot also shows:

After the selection of a source folder the Listbox gets populated as the following and final screen shot also shows:

I hope that the above has given some insight on how to work with folders in the VB.NET language.

Kind regards,
Dennis

September 9, 2009

Goodbye Radio Buttons!

Filed under: .NET & Excel, COM Add-ins, UI Design, VSTO & Excel — Tags: — Dennis M Wallentin @ 12:20 pm

For years I have been using the Radio Button control in many of my solutions (where it has been appropriated). When using the control it was usually together with the Group Box control. The following screen shot shows a common approach when using these two controls together and where users are supposed to select one of the three options. Typically one of the Radio Buttons is also pre-checked when the Windows Form is loaded.

RadioButtons

When designing the UI and consider to use Radio Buttons the question we should raise is; when is the number of items relevant to the end users? My answer is when the users are about to make a selection, not before and not after that decision point. After the decision has been made the selected item should be viewed. 

This lead to a new standpoint, at least to me, when designing UI; instead of a group of Radio Button controls we replace them with a Combo Box control as the following screen shot show:

Comboboxes

When the Windows Form is loaded we have the same option as with Radio Buttons; to have one (or more) item(s) selected or to have no no item pre-selected. When the users have made their decisions the selected item is showed in the control. Consequently,  the UI gets cleaner and the Windows form may even be down sized. Of course, the same discussion can be applied to the List Box control.

All in all, for all my future projects I will simple drop the Radion Button control and instead use the Combo Box control. Do You agree?

Kind regards,
Dennis

Theme: Silver is the New Black. Blog at WordPress.com.

Follow

Get every new post delivered to your Inbox.