13.07.2015 Views

Using the DeepSee Dashboard Designer - InterSystems ...

Using the DeepSee Dashboard Designer - InterSystems ...

Using the DeepSee Dashboard Designer - InterSystems ...

SHOW MORE
SHOW LESS

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Adding a Picture Button7.9 Adding a Picture ButtonA picture button is a button that includes both an image and a caption. You specify <strong>the</strong> position ofboth of <strong>the</strong>se elements.To add a picture button to a dashboard:1. Open <strong>the</strong> dashboard in edit mode, as described in “Editing a <strong>Dashboard</strong>,” earlier in this book.2.Click <strong>the</strong> add picture button icon ( ).<strong>DeepSee</strong> displays a dialog box in which you specify <strong>the</strong> details.3. Type <strong>the</strong> caption of <strong>the</strong> button into Caption.4. Specify <strong>the</strong> main image used on <strong>the</strong> picture button. To do so, click <strong>the</strong> Normal Display tab and<strong>the</strong>n do one of <strong>the</strong> following:• Select a <strong>DeepSee</strong> image file. To do so, ei<strong>the</strong>r type <strong>the</strong> image ID into Image List or click <strong>the</strong>button next to that field and <strong>the</strong>n select an image.• Select an external image file. To do so, click Browse, navigate to <strong>the</strong> file, and click OK. Thisaction loads <strong>the</strong> file into <strong>the</strong> database and uses it as this dashboard element.The Normal Display tab displays a preview of <strong>the</strong> image.5. Optionally specify <strong>the</strong> following:• Upon Clicked — Specifies <strong>the</strong> image to display when <strong>the</strong> user clicks <strong>the</strong> picture button. Click<strong>the</strong> tab and choose a image as described previously. The tab shows a preview of <strong>the</strong> image.If you use this option, make sure that <strong>the</strong> image has <strong>the</strong> same dimensions as <strong>the</strong> main image.• Mouse Over — Specifies <strong>the</strong> image to display when <strong>the</strong> user hovers <strong>the</strong> cursor over <strong>the</strong> picturebutton. Click <strong>the</strong> tab and choose a image as described previously. The tab shows a previewof <strong>the</strong> image. If you use this option, make sure that <strong>the</strong> image has <strong>the</strong> same dimensions as <strong>the</strong>main image.• Font — Specifies <strong>the</strong> typeface, font style, and font size for <strong>the</strong> caption. You can also chooseunderline or strike-through properties. Ignore <strong>the</strong> color options and alignment, which haveno effect. Click this and specify <strong>the</strong> options.• Fore Color — Click this and <strong>the</strong>n select <strong>the</strong> color of <strong>the</strong> caption text.• Auto Resize — If you select this, <strong>the</strong> picture button is resized to fit <strong>the</strong> image as soon as youclick OK.• Picture Position — Specifies <strong>the</strong> position of <strong>the</strong> image within <strong>the</strong> picture button. Click anoption from <strong>the</strong> drop-down list.<strong>Using</strong> <strong>the</strong> <strong>DeepSee</strong> <strong>Dashboard</strong> <strong>Designer</strong> 71

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!