On a recent project, I had to figure-out a way to dynamically display icons to represent that status of projects that were being reported on using Microsoft SQL Server 2000 Reporting Services.  Based off of information in the report’s data, I needed the report to show a different icon for projects that were either behind schedule (value = -1), on schedule (value = 0), or ahead of schedule (value = 1).  I initially thought this would be an easy task, but after spending nearly a whole day researching and testing different methods for doing this, I found it was not so easy!

First of all, one must understand that an image that looks good on a monitor will not print very clearly.  Most monitors have a resolution in the range of 72 to 96 dpi (so I’ve been told), where as an image should be at least 150 dpi (dots per inch) in order to print with any clarity. Vector images that have ‘hard edges’ like the circle-shaped icons I had chosen definitely need to be saved at a resolution higher than screen resolution.   Higher resolution images look very blurry and pixilated when displayed on-screen but should print very nicely.  The end-user must be made aware that just because the report looks terrible on-screen doesn’t mean it will print that way!

Knowing this, I recommend that if your goal is to have crisp graphics when the report is printed, start by creating higher resolution graphics, most likely a JPEG in the 300 dpi range.  If your reports will only be viewed on-screen, create lower resolution images; I found that GIFs are fine for that.  Stay away from using PNGs because the Reporting Services PDF generating doesn’t seem to like them.

I opted to save my status icons as 300 dpi JPEGs after creatig them in Adobe Illustrator.   I also found that the icons should be saved with dimensions (width and height) significantly larger than the desired print dimensions.  When I tried to create icons that were as small as I thought they needed to be, the end result was that they didn’t look good on screen or in print.  Go figure.  The image dimensions will be scaled down in the image control's properties in the report.

When accessing images in SQL Reporting Services, you have several options. By dragging an image control from the Visual Studio Toolbox, you’ll be presented with this dialog:


Figure 1: The Image Wizard dialog

Although I would’ve preferred that my dynamic icons be embedded into the report, I couldn’t figure-out a way to dynamically display embedded images so I opted for using images hosted on a web server.  If you know of a way to dynamically display embedded images, I’m all ears!

Because the Report Manager of SQL Server Report Services is a web site, I opted to create an images folder in IIS to host any images I might use.  I figure that if the person viewing the report can see the reports on the report web server, he or she will also have the ability to see the images in the report.  Make sure you test this before deploying your reports to a live environment.

To do the actual ‘dirty work’ of determining which image to display, I had to resort to using a combination of a custom code function and a custom expression in the image control's Value property.  First off, here is the code I used:

Function ShowStatusImage(value as Object) As String
      Dim strURL as String
      strURL = "http://<Server Name>/images/"

      Dim strImg as String
      Select Case value
            Case Nothing
                  strImg = "iconschedule.jpg"
            Case -1
                  strImg = "iconschedulebehind.jpg"
            Case 0
                  strImg = "iconscheduleon.jpg"
            Case 1
                  strImg = "iconscheduleahead.jpg"
      End Select
      Return strURL & strImg
End Function

This method must be placed in the report's code section which can be accessed by selecting Report -> Report Properties -> Code (tab) in the VS.NET designer:


Figure 2: The Report Properties window showing the dynamic image function

Note that it is not a good idea to use ‘localhost’ in the image URL as shown in the image above.  Instead, use the PC name or IP address so you can be assured that other people will be able to view the images from any where on your network.

So, how do you use this ShowStatusImage function?  That part is easy.  In the table cell where you want the image to be displayed, drag an image control from the Toolbox into a cell in the report.  In the Data : Source field, select External.  In the Data : Value field, enter the following:

=Code.ShowStatusImage(Fields!<YourDynamicImageField>.Value)

Obviously, you will have to insert whatever data field value you want to use as the input parameter of the ShowStatusImage function which will determine which image is shown. Modify the select statement in the function accordingly. The field I used obviously returned either no value, -1, 0, or 1.  The figure below shows the properties I set for each dynamic image:


Figure 2: Dynamic image field properties

Note that the Layout : Size property relates to the size of the report field that the image control is in, not the size of the image control itself.  In order to keep my icons from stretching to the size of the field they were in, I had to set the Layout : Sizing property to FitProportional. I also found that it was necessary to put some padding all the way around the field which reduced the size of the image slightly and seemed to keep the edges of the image from being cropped.  My icons are circle shaped, and without the padding, the circles kept ending-up with flat sides.

I opted to select no Data : MIMEtype as the images were not being served by the report itself.

Below is a screen shot of how my dynamic image fields look in the Layout tab of the VS.NET designer.  Note the icon legend at the top of the report:


Figure 3: Layout view of the report

And here a small snippet of the dynamic images in the report in Preview mode:


Figure 4: Preview of the report

I know you’re thinking, “Those status icons look like crap! They’re all pixilated and bumpy!” Yes, they do look terrible on-screen and look even worse when you try to export the report as a PDF.  However, they look great on paper, which was my goal.

An Alternate Approach (That Didn’t Work)

For those of you who know your fonts, you might notice that the icons I’ve chosen look an awful lot like some of the characters in the Wingding font family… and that’s because they are *inspired* by the Wingding fonts  Instead of using actual images as status icons, I tried using various icon looking fonts instead.  The idea seemed great to me because I knew that fonts would look great on screen and print well.  There was one problem with this plan, I knew that people would be generating PDFs from my reports and Reporting Services does allow for embedding fonts into PDFs   As a result, I could print and view the reports directly from Report Manager and the icons looked great, but when I exported to PDF, I ended-up with some other crazy font symbols.

If you know of a better way to display dynamic images than the way I demonstrated here, please let me know!

Once again, Scott Guthrie posted some more highly informative ASP.NET 2.0 information; this post being the first in a series featuring typed datasets.

Many people groan at the thought of using typed datasets because ‘purists’ feel that using them generates a lot of unnecessary code (among other things which I won’t discuss here.)  While this may be true, they are very useful for creating a very quick-n-dirty data access layer with almost no need to write SQL or ADO code.  In addition, getting ‘free’ strongly typed code (intellisense = good) makes me think that typed datasets are well worth looking at!

• Part 1: Building a DAL using Strongly Typed TableAdapters and DataTables in VS 2005 and ASP.NET 2.0
• Part 2: Building Our Master Pages and Site Navigation Structure

While trying to print some Microsoft Solutions Framework documents, the page numbers get messed-up when printing the Word document.   Instead of getting ‘Page 2 of 21’ for example, the printer would print ‘Page 2 of 2’, ‘Page 3 of 3’, etc., all the way to page 21.   The solution (or so it appears) is simple: Disable the ‘Background colors and images’ option in Word’s Options menu:

If that doesn’t work, try checking the ‘Reverse print order’ option.  However, this option is highly annoying as all your pages will print in the wrong order.

I found these solutions in an MSDN article for Word 2000.  You’d think this would’ve been fixed in Word 2003. :-(

The W3C has introduced a MIME type for XHTML documents. This new MIME type is application/xhtml+xml. The W3C recommends that you use the application/xhtml+xml MIME type when serving XHTML documents, because XHTML pages should be interpreted in a stricter way than legacy HTML pages.

You can serve an ASP.NET page with a particular MIME type by including the ContentType attribute in a page directive. For example, including the following directive at the top of an ASP.NET page causes the page to be served as application/xhtml+xml.

<%@ ContentType="application/xhtml+xml" %>

Doing so will force you to make sure your web pages are valid XHTML files because they’ll break if your code is sloppy.

Ok, that’s great… except for the fact that Internet Explorer will now display your web site as an XML file instead of an HTML file!  There are a few work-arounds for this, but the easiest one for ASP.NET 2.0 sites seems to be this simple addition to the Global.asax file:

<script runat="server">

    Sub Application_PreSendRequestHeaders(ByVal s As Object, _
      ByVal e As EventArgs)
        If Array.IndexOf(Request.AcceptTypes, _
          "application/xhtml+xml") > -1 Then
            Response.ContentType = "application/xhtml+xml"
        End If
    End Sub

</script>

I’ve had a small obsession with learning about web standards recently, mostly because a world of truly standards-compliant browsers is a world where web developers don’t have to test their web sites on all the latest (and very quirky) browsers.

Along with attaining standards compliance comes meeting the needs of those with disabilities, such as those who are visually impaired or blind.  The Internet is a wonderful place full of nearly unlimited amounts of information and it would be a shame if your web site was preventing people from tapping into part of it!

So how do you make your web site standards compliant and make sure it caters to the needs of those with disabilities?   Well, this MSDN article does a great job of explaining all of this:

MSDN: Building ASP.NET 2.0 Web Sites Using Web Standards

One thing I like about the article is that even though it is from Microsoft, it doesn’t hide the fact that Internet Explorer isn’t quite up-to-snuff when it comes to meeting some of the stricter standards (like XHTML Strict).  The article also offers some work-arounds for some of the problems one will encounter with trying to make a site fully standards compliant.

In addition to the MSDN article, these two articles may also come in handy when designing more usable web sites:

• Trace Research and Development: Designing More Useable Web Sites
• UseIt.com: Accessible Design for Users With Disabilities
• Section 508: The Road to Accessibility
• W3C Web Accessibilty Initiative

As you'll read in some of these web sites, there are laws that require a web site to be accessible (Section 508) when working with government agencies.

As a site designer (in addition to being a developer), one thing I’m finding challenging about creating accessible site designs for users with disabilities is that it greatly limits what I can do with my site in terms of formatting and using scripting technologies like DHTML.   It seems to me that when designing a site for a client that has business requirement for designing an accessible site, it may be best to either create a text-only version of the web site or make sure there is a CSS style sheet that can display the web site without all the glitz.  This also means that dynamic DHTML menus have to go away in favor of more static hyperlinks and sitemaps.