The Zebra Striper iBloc is a custom action that applies alternating row backgrounds and mouseover highlighting behavior to tables, and can be used to re-color rows after showing or hiding rows.
Current Version: 1.1
Supported iRise Studio Versions: 8.7 – 8.12
Supported Browsers: IE 8.0+, Firefox 3.5+, Safari 4.0+, Chrome 8.0+, iOS Safari
Works in iRise iPhone and iPad Apps: Yes
What does it do?
- Applies background colors and/or background images to alternating rows in static or data-driven tables (‘zebra-striping’).
- Dynamically changes the background color, background image, and/or text color for rows on mouseover.
- Either zebra-striping or mouseover highlighting behavior, or both, can be applied to any given table.
- Can be used to re-color alternating rows after dynamically altering tables with show/hide or change properties actions.
- Supports tables with or without header and/or footer rows.
How can I use it?
- Drag the Zebra Striper iBloc onto any empty area of the canvas.
- In the properties panel, select a Target table and check ‘Zebra stripe rows’ and/or ‘Highlight row on mouseover’.
- Change background colors and/or images as desired.
- You can connect any page widget to this action with any event, but you’ll probably want the liquid layout effect applied on load. To do this, you first have to create an action that is associated with the page’s onLoad event.
- Right-click on a blank area of the page, and select Add Event > Action…
- Choose Show/Hide Widgets, and set “Select widgets to:” to Show. Select any widget on your page that is already shown by default. (This gives us a ‘dummy’ action that we can connect to the iBloc)
- Right click on the blue line that was created and select Move To > onLoad.
- Drag this new Show/Hide Widgets Action onto the Zebra Striper iBloc to connect them.
Tips & Tricks
- If you want to re-apply zebra striping after dynamically hiding or showing rows (this can mess up the alternating row effect if you are showing or hiding an odd number of rows), connect a Zebra Striper iBloc so that it is applied immediately after your show/hide action.