I have a form where a user can enter a new name for a specific folder. The full folderpath is displayed on the form for informational purpose which leads to a problem.
I don't want my form to expand its width too much just because the path is so long. So I put the path into a read only textbox with a horizontal scrollbar.
Although it works fine and looks acceptable, I was wondering if anyone has a better idea on how to solve this.
New Name Form, No Scroll
New Name Form, Scroll
There's a number of issues here.
Input controls aren't meant for displaying data, they're meant for, well, input :). When you show a disabled textbox, the user understands that in some cases it can be enabled. You should use a read-only textbox for the folder path.
It would be a good idea to populate the New Name field with the current name, and just name it Folder Name.
Group boxes aren't really used any more, but even regardless of trends - when they're used, it's for grouping controls. A group box that contains a single control is redundant in 99% of the cases, because there's nothing to group.
It's usually a good idea to add a Cancel button if you have a Confirm button. The X at the top right isn't enough.
download bmml source – Wireframes created with Balsamiq Mockups
Target folder: C:\text\of\full\path\to\folder followed by New folder name: user-supplied input and then lastly New Target folder: C:\text\of\full\path\to\user-supplied-folder and the New target folder: should update as the user types
Commented
May 13, 2014 at 16:19
I would get rid of scrolling, and truncate the folder path when the text box doesn't have focus, and indicate this with ellipsis (...) at the end.
When the text box has focus, display a multi-line edit box instead of the single line one.
I remember there was a function that will create a String like
D:\Folder\...\CurrentFolder
I think the parameter was length in pixels or even a windows component where the path should fit in. Sorry I don't remember more, but maybe someone else knows what I mean.
The next step would be to make it clickable and show the full name with word wraps. Just imagine the following shortened directory and assume you have documents in every of your projects:
D:\Projects\....\documents\
Or show the full path as hint, that's cool too.
And last but not least, you should remove all size constraints from your software, because you can never be sure what kind of system it will be used on. Just think about translations, font-sizes, dpi-sizes, ...
One more argument: Free Will! The user should be able to decide if the path should be shown in 2560x100 window or as 400x400 or whatever. People get larger screens all the time and then having a tiny box not showing the necessary information is just annoying.
What you could do is have it so the partial folder path displays at first so instead of: D:\Folder\Folder\Folder\Folder you could have it as D:...Folder with an option to show the full path if the user really wanted to see it. However, as Matt stated in may be an "unnecessary complication" because they are not changing the location and simply the name. It could work to have an option for the user to see the full path or not maybe a simple check box so that you don't always have that scroll bar there seems to just add nothing to the program. Just an idea, hope it helps.
Give up? Are you certain this a problem you have to solve? (the answer may be yes of course) However, from here it looks like you're using winforms and interacting with a file system.
Why are you prompting your users to do these types of interaction in new bespoke exciting ways when things like the OpenFileDialog Class exists?
I'd advise to get rid of the form in the first place. If you follow the principle of changing something where you see it, then the changing should take place in the location where the name is displayed to the user. (S)he navigated down the path somehow, probably the path can be seen there still, and this is the context where the change should happen. Don't take the user out of the current context.
Windows Explorer does this, for example. Just press F2 while the focus is on a filename.
