Before
After
Changes in the Status Bar
Everything started with the idea of removing the status bar, in order to save space in the main window. The plan was to use something similar to Chrome's status popups, which are visible only when there is actual information to show to the user. However, after playing with the idea and thinking about how would it fit in MonoDevelop, I decided to try something else. Instead of removing the status bar, we would make a better use of the space it takes. So in the new GUI I merged the status bar and the bottom dock bar. The dock bar is the area where the title of pads in auto-hide mode are shown (for example, the Test Results pad in the above screenshots). When you hover over the title, the pad is shown in a popup window, with a nice sliding effect. The bottom dock bar is now shown next to the status bar, growing as more space is required.
I also added support for custom pad labels. So for example, the Errors List pad now shows the error and warning count, instead of just the "Errors List" label. In this way pads can show some status information while they are minimized.
Less intrusive output pads
Temporary output pads such as logs for Version Control or Find in Files operations are now shown in autohide mode by default. Until now, those pads were shown docked at the bottom, taking space from the text editor. I also removed the standalone Build Output pad. The build output is now available in the Errors List pad, by clicking on the Build Oputput button:
Visual improvements
A noticeable visual change is that the main window new has a darker background, with some subtle shading effects. The pads look more "physical" and better delimited. The pad toolbars are now integrated in the docking system, improving the overall visual consistency.
Configurable GUI compactness
One thing I learned while working in MonoDevelop is that it is hard to find the right balance in the use of padding between the gui components (specifically, between the components shown in the main window). Using more padding makes the GUI more visually pleasant, and the components are better delimited. On the other hand, padding may be a waste of space when working on small resolutions.
I added a configuration option for selecting the level of compactness of the GUI. There are five levels, from Very Compact to Very Spacious. So for example, the screenshots shown above are using the 'Spacious' level. In that level, there is some padding always visible between the pads, the window borders and the main menu. There is no such padding in 'Normal' mode.
Zoomable tree views
MonoDevelop has an option which allows choosing the font to use for the tree view pads such as the Solution pad or the Class pad. Those trees may be large for big projects, so users find it convenient to use a small font, which allows seeing more information at once.
To make font reduction easier and more handy, I added a Zoom capability to the tree pads. So to zoom, all you have to do is hold the Control key and move the mouse wheel up and down (the standard zoom shortcuts can also be used for this, including Control+0 to reset the zoom). This screenshot shows the solution and class pads with different levels of zoom:
Conclusion
The changes I described are part of an ongoing effort to make MonoDevelop easier to use. There is more to come. It would be great to have feedback on the changes we are doing, so that we can further fine tune the interface for the 2.4 release.
24 comments:
Thank you so much for your hard work, Monodevelop continues to improve with each release. For people like me who are simple, basic .NET developers this IDE has been a tool that I can't imagine working without now.
Thanks again
SpoodyGoon
Can you build MonoDevelop using MonoDevelop?
Can you build Mono (managed and unmanaged parts) using MonoDevelop?
Can you build Gtk# using MonoDevelop?
The large versions of the 2 first screenshots don't seem to work.
Anyway, keep up the good work.
very nice. I like what I'm seeing here.
That looks great! Are you planning F# support?
Is this build available for OSX as yet ? Or is it still only targeted at Linux flavors so far ?
The new status bar looks really great :)
Do you plan to add to the editor some features from Kate 4.0, like the ability to highlight blocks on mouse over ? It's a really useful feature.
Anonymous: Short answer: yes, you can build MD with MD; that's been possible for years. Classlibs too, with caveats, but not the other stuff.
Blackdog: certainly no plans until we have an open-source F# compiler. Contributions welcome in the meantime though.
Is this thing turned on ?: MD 2.2 was simultaneously released for Linux, Mac and Windows.
Rapha: You mean like Xcode's "code focus" feature? We shipped that in 2.2. Try hovering over the fold margin for a moment, or toggle with control-shift-k.
Excellent changes, I look forward to trying them!
will this modifications be released in Lucid
Excellent work! I do appreciate your efforts. It's a joy seeing monodevelop emerging.
I like some of the ideas, but I'm not so sure about the move of the hidden bottom tabs. Moving them right to the bottom-right of the screen seems like you're putting them a long way out of the way. Hopefully it is customisable to put them in the bottom-left instead (which somehow seems more logical to me - perhaps because that's where they are anyway, and because that's where quite a few apps put "status" stuff).
I'm not sure that the new flat "tab" style (whatever you want to call the File/Help/DB Browser 'buttons') is an improvement either as it makes them less obviously "clickable tab-like things".
Now to see if there are early builds on the OBS for openSUSE and to cross my fingers and hope for better refactoring support (and, at a push, Mercurial support!).
@Seif Sallam: The changes apply to all gtk themes.
@IBBoard: yes, moving the pad labels to the left is another option. In fact, that's the first thing I did. I then tried to move them to the right to see how it would work. I like both options. It will probably make it configurable.
@Lluis i was asking if this mono-develop version will be available in the Lucid Repository.
@Seif Sallam: it will be available when the official 2.4 release is made. There is no release date for 2.4 yet, it is work in progress.
Hmmm. Feature request...
In the bottom right of the status bar, it would be nice if the error/warning icons were displayed in grayscale when there were no errors/warnings. Once there is a error/warning they would be shown in their "loud" colours, as they are in your screenshots.
Two advantages:
- When there are no errors/warnings, there is one less loud icon to distract you from your work.
- When an error occurs your eyes will probably register the change in colour, even if you're not looking directly at the icon.
Lluis, I am loving these changes, especially on my laptop screen. The pads were one of the areas I liked least about the MonoDevelop UI.
On my build (153253) the Version Control pad does not display on hover; I have to double click it. Is this intentional?
The errors tab works great and I like how you combined it with build.
Thank you also to Michael and all the other MonoDevelop hackers. Trunk has been very stable for me.
Ok, on a newer build the version control pad does show on hover. Thanks!
Also, I really like that the pads now minimize to the bottom right. I hope it is at least configurable if others want it on the left.
I suspect there is a nasty memory leak in the newest MD builds though.
Amazing..
What are you using for the GUI ? is it GTK# ? (I gather its not mono winforms).
Also are the skin/theme components available to other GTK#/mono developers ? And if so under what lic ? (LGPL/MIT/Apache/???)
Thanks
@Anonymous: I like the idea of showing the error/warnings in greyscale. I'll give it a try.
@Andrew: the GUI is all GTK#. Most of visual components are reusable under the MIT/X11 license.
I have a tiny feature request that I'd like to post here.
I keep getting taken off guard by a little something in MonoDevelop: when adding a reference to a project, I double click the reference and click OK... only to find out a little while later that it did nothing, as double clicking a reference does not tick the checkbox next to it.
I'm used to double clicking to add a reference, because it works in other IDEs (SharpDevelop, Visual Studio)... but then again, those don't show checkboxes (and expect you to press Shift for multiple selections).
So, I suggest you make double clicking the name of a reference tick the checkbox to its left (and possibly automatically press OK for you, as you could assume someone double clicking a reference name only wants to add a single one). And while we're here, for the sake of accessibility, hitting space should also tick the checkbox of the focused row. Thanks.
it will be much better to have the stetic designer available when coding on vb.net, the current version only shows the designer when the user is coding in c#.
monodevelop is one nice tool... thank you and keep up the good work...
Excellent....Thanks 4 the info. keep up the good work.... :)
Post a Comment