Tutorial 4-9. Customizing the Enter Values Parameter Interface
In an effort to make Crystal Reports accessible for all people regardless of disability or impairment, the Enter Values dialog box is fully customizable. This enables you to make it easier for all your users to enter parameter values for a report. You can increase the size of the text, change the background color, and make a plethora of other modifications. But just because this was done for the purpose of making your reports accessible, that doesn’t mean you can’t use it to make them look better. In fact, you can customize the Enter Values dialog box so that it matches your corporate identity.
The Enter Values dialog box is designed using HTML and CSS (Cascading Style Sheets). If you are familiar with website design, then you know that CSS files let you centralize the look and feel of your website within a single text file. Each web page references the same CSS file so that they have a consistent format with a minimal amount of work. That same logic is used with the Enter Values dialog box.
Crystal Report uses the file “promptengine_default.css” as the template for displaying the Enter Values dialog box. That file is located in the following directory (assuming you performed a default installation):
This file is a basic text file that can be opened with any text editor or your favorite CSS editing program. Here is an excerpt of a few lines of sample code from that file.
This book doesn’t teach you how to program with CSS, but the basic idea of this code snippet is that it defines how to display the prompt message and the prompt text box. It defines the font color, font size, and font style. If you modify this text file and save it, you’ll immediately see the changes next time you enter parameters in a report. Let’s walk through the steps for making some simple changes to this file and see what the effects are.
The changes you make to the CSS file are not report specific. Since the CSS file is external to the report files, the changes you make to the Enter Values dialog box will be visible on every report. If you open the report on a different computer, the Enter Values dialog box will default back to normal because the modified CSS file was only stored on your computer. If you want other users to have the changes applied on their computer, then you have to copy the new CSS file over the one on their computer.
- To modify the CSS file, open the Windows Explorer and navigate to the folder:
C:\Program Files\Common Files\Business Objects\3.0\crystalreportviewers11\ prompting\css\
- Right-click on the file “promptengine_default.css” and select Copy.
- Right-click anywhere in that window and select Paste. This makes a backup copy of your CSS file. You MUST make a back-up copy because what we are doing is only for training purposes and you will want the original file restored after we are finished.
- Click on the Start menu and select All Programs > Accessories > Notepad. Click File > Open and navigate to the CSS file and open it.
- Scroll through the file and look at the different options you have for changing the format of the Enter Values dialog box. Some of it may appear cryptic, but it shouldn’t be too hard to figure out because they are named very descriptively.
- Let’s make a couple of changes and see what the results are. Find the style .pePromptElementText near the middle of the file. Double the font-size property from 8 to 16.
- Find the style .pePromptRuler and change its height property from 1px to 20px.
- Did you really create a backup copy of this file in Step 3 like I suggested? If you did, then save this file. If not, this is your last chance to make a backup copy before overwriting it!
- After saving the changes, open any report with parameters and refresh its data. You’ll see something similar to the following screen shot.
Notice how the prompt text is twice as large as the rest of the text? That is because we doubled the font size. And the gray bar separating parameters (the ruler) is huge compared to the thin line it used to be. Of course, I used these specific changes because they are easy to illustrate in the book, but they aren’t very practical. If you wish to modify the Enter Values dialog box for your own reports, then you should get a book on CSS to make sure you have a basic understanding of what you are doing. It isn’t very hard to change the fonts and color scheme to give it your own personal touch or make it match your corporate image.
If you are making a lot of changes to the CSS file and going back and forth to see how the changes affect the dialog box, press the F5 key in the dialog box. It automatically refreshes the interface to reflect the latest changes saved to the CSS file. This is much easier than refreshing the report data and reopening the Enter Values dialog box each time to see the changes.
After playing around with these changes, you’ll want to go back to the folder and delete this new CSS file and replace it with the backup copy you made earlier.
