Toolbox

User-Friendly UIs, Online Data Entry Controls, and More

Scott Mitchell

Contents

Build Office-Like UIs
Add Rich Data Entry Controls to Your Site
Generate PDF Documents
The Bookshelf

Build Office-Like UIs

Microsoft® Office is one of the most well-known and most-used consumer products. For many people, their only experience with a computer is when using Office, be it checking e-mail, creating presentations, or writing a document. Due to Office's ubiquity, many programs strive to offer a similar end-user experience by mimicking its user interface. While the Microsoft .NET Framework ships with common controls for building Windows® Forms applications, these controls are much simpler than their Office equivalent, lacking in features, aesthetics, and pizzazz.

To overcome the limitations of the default Windows Forms controls, many developers turn to third-party controls. DotNetBar Suite by DevComponents offers developers a rich suite of controls designed to provide an Office-like user experience. DotNetBar Suite encompasses a total of 14 eye-pleasing controls that make it easy to add menus, balloons, dockable windows, panels, side bars, tabs, and other common UI elements to your .NET Windows Forms-based applications.

Being an ASP.NET developer by trade and lacking any sort of artistic skill, my strength lies in creating really unattractive applications when it comes to Windows Forms development. Regardless, with DotNetBar I was able to easily and quickly create a very appealing and user-friendly UI whose menu and toolbar looked as slick as Office. The ease of design is due in large part to the DotNetBarManager control, which, once added to a form, allows you to create and customize the UI elements through the DotNetBar Designer. The designer window provides a Layout Preview pane, making it easy to see immediately how additions and changes to the controls on the page and their properties affect the results seen by the end user.

The most recent addition to the Suite is the Ribbon control, a new user interface concept introduced with the upcoming Office 12. The Ribbon control groups common tasks together, where each task can have a unique set of controls and user interfaces. With DotNetBar Suite's Ribbon control, creating professional-looking Ribbons are a breeze. Simply add on a RibbonControl item to start and then drag in a RibbonBar control for each set of common tasks to appear in the Ribbon. Buttons, comboboxes, textboxes, or other UI items can be added to the RibbonBar controls.

Building attractive, Office-like user interfaces offers more than just eye candy—it can also make your programs more intuitive and usable. End users who are familiar with the Office UI will likely find an app that uses DotNetBar Suite more familiar than one that relies on the Windows Forms controls.

Price: $189 for a single developer license.

www.devcomponents.com/dotnetbar

Add Rich Data Entry Controls to Your Site

My first real-world experience with Web development was back in 1998 when I was tasked with moving a company's internal business processes from a paper-based system to the company intranet. The main bulk of this job required taking the data currently captured by the paper forms and providing Web pages to collect the same information.

By moving these processes to the Web, the company was able to assess the data more quickly and view aggregate information more easily. When building such an online data entry system, ease of data entry and input validation are primary concerns. Users will be remiss to move to an online-based system if it's more burdensome to enter the data through a browser than it is through pen and paper. While with paper-based forms, it's acceptable if the user forgets to include the year when writing in a date, or spells out a number by writing in "two" instead of "2", a computer is not as forgiving.

Creating a data-entry application can be done entirely with the builting ASP.NET controls. The TextBox, CheckBox, and DropDownList controls can be used to collect data, and the ASP.NET validation controls can be used to help ensure that the data entered is valid. Speaking from personal experience, while such user interfaces do meet the minimum requirements, they are often less than ideal. The ASP.NET built-in validation controls only allow for trivial validation scenarios. The built-in Web controls are often too generic for more specialized data entry forms.

Before trying to kludge ASP.NET data entry and validation controls together, give the PeterBlum.com Professional Validation And More toolkit a try. Validation And More (VAM) offers over 40 ASP.NET controls that make creating efficient, usable data entry forms with rich validation support a breeze. Improving over the default TextBox control, the VAM provides the IntegerTextBox, CurrencyTextBox, FilteredTextBox, and others, which emit JavaScript to prevent users from entering invalid characters, thus helping to reduce typos and errors. In addition, VAM offers a client-side toolkit that includes controls to help inject JavaScript in a page to make it more interactive.

Need to have controls become enabled or disabled based on the state of another control? Want to display a running total that is updated as the user enters values into a series of textboxes? All of these tasks, and more, can be done with the client-side toolkit of VAM.

Where Professional Validation And More really shines is in its validation capabilities. While ASP.NET provides 5 validation controls, VAM includes 25. Furthermore, the VAM controls can be turned on or off based on an assortment of conditions. That textbox may not be a required field unless a particular checkbox is checked—the VAM controls offer this level of flexibility. There's also ASP.NET 2.0 support, including callback support for the CustomValidator control, localization, and themes and skins support. After having used Professional Validation And More in several projects, I can't imagine going back to using vanilla textbox controls and ASP.NET-provided validation functionality.

Price: $200 for the Web server license.

www.peterblum.com/VAM

Generate PDF Documents

Over the years I've had the opportunity to use a few different PDF-generating components, the most recent one being TallPDF.NET by TallComponent. TallPDF provides two mechanisms through which you can create PDFs: programmatically, via the TallPDF object model or declaratively, through XML.

In the programmatic approach, you use classes like Document, Section, Paragraph, Image, and so on to lay out the content of the PDF. While this approach allows for the greatest degree of flexibility, I've found that creating a detailed PDF document in this manner can quickly lead to code bloat. For example, adding some formatted text involves creating a TextParagraph object, adding a Fragment object to the TextParagraph, specifying formatting settings, and then adding the TextParagraph to the appropriate Document's Section. However, if you need a highly customizable page layout based on dynamic criteria, this is a small price to pay.

TallPDF can also have its structure specified declaratively, through XML files. The XML content defines the various elements in the PDF document, such as sections, paragraphs, fragments, and so on, along with each element's style settings. The XML content can even include elements whose value is populated at run time.

For example, within a <paragraph> element you could add a dynamic <fragment> element like so: <fragment fontsize="14" font="verdana" type="MyObject.PropertyName" />. This fragment would, when rendered, insert the value of the specified object's specified property.

TallPDF is designed simply to create PDFs. That means that with TallPDF you'll need to write the code or define the XML that specifies the document's complete structure. If you want to be able to take an existing PDF document and dynamically insert content into placeholders, you'll have to upgrade to TallComponents's PDFKit.NET. In addition to TallPDF.NET and PDFKit.NET, TallComponents also offers PDFTextBox .NET, a Windows Forms component for authoring PDF documents.

Price: $499 for the standard server license.

www.tallpdf.net

The Bookshelf

Have you ever taken your commonly used code and wrapped it up inside of a class, making it easier to reuse, test, and extend? Or maybe you were tasked with creating reusable code libraries for your development team at work? Do you work for a company that sells a product aimed at the developer market, such as a Windows Forms control library, or, like TallComponents, a toolkit for creating PDFs? If you fall into any of these categories, then you know how easy it is with the .NET Framework to create, deploy, and extend reusable code libraries.

While the mechanics of building a reusable .NET library are trivial, it is anything but to design an easy-to-use library that will gracefully handle future changes and additions. The naming conventions, types, members, exceptions, and design patterns that make up the library greatly affect its overall success. Code libraries that aren't intuitive, that are inconsistent, or that deviate from standard conventions are apt to frustrate its users. When designing a code library, then, why not turn to Microsoft for advice? After all, Microsoft has released the largest reusable code library for .NET—the .NET Framework Base Class Library! Framework Design Guidelines: Conventions, Idioms, and Patterns for Reusable .NET Libraries (Addison-Wesley, 2005), by Krzysztof Cwalina and Brad Adams, shares the framework design lessons learned by Microsoft since .NET development began in the late 90s.

The book begins with an interesting discussion of what qualities make up a well-designed framework. Among other things, the authors note that a well-designed framework is both expensive to design and full of trade-offs. In other words, if you want to create a great reusable code library it's going to take time to properly design it, and even then it won't be perfect.

Next, the book covers the fundamentals of framework design, hammering home the importance of making libraries that are scenario-driven and offer a low barrier to entry. Design for specific-use cases and make sure that your library makes it trivial to accomplish easy tasks. The book also examines guidelines for naming, types, members, exceptions, and so on, along with a look at designing for extensibility.

What I liked best about this book was the style in which it was written. Rather than being a stodgy tome on framework design, it is very readable thanks to the many "discussions" interjected throughout the book by various Microsoft architects. These discussions, which appear in offset boxes after particular guidelines, give the book a very conversational feel, almost as if you're sitting in on a meeting at the Microsoft campus.

For example, in the "Type Design Guidelines" chapter, after the guideline that reads, "Do favor defining classes over interfaces," Krzystof Cwalina adds that in talking with developers on the team, many have regretted shipping some API as an interface, while no one has regretted shipping a class. Jeffrey Richter then interjects, recommending that framework developers use both an interface and then an abstract base class that implements the interface, as this gives the end-user developer the luxury of choosing whether to define their own type based on your interface (for convenience) or abstract base class (for flexibility).

While this book is best suited for those creating sufficiently large frameworks, anyone who creates reusable code libraries of any size would benefit from the lessons offered.

Price: $39.99, 346 pages.

www.awprofessional.com

Send your questions and comments for Scott to  toolsmm@microsoft.com.

All prices were confirmed at press time and are subject to change.

Scott Mitchell, author of numerous books and founder of 4GuysFromRolla.com, is an MVP who has been working with Microsoft Web technologies since 1998. Scott is an independent consultant, trainer, and writer. Reach him at mitchell@4guysfromrolla.com or via his blog, at ScottOnWriting.NET.