Zebra Striper iBloc

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?

  1. Drag the Zebra Striper iBloc onto any empty area of the canvas.
  2. In the properties panel, select a Target table and check ‘Zebra stripe rows’ and/or ‘Highlight row on mouseover’.
  3. Change background colors and/or images as desired.
  4. 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.
  5. Right-click on a blank area of the page, and select Add Event > Action…
  6. 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)
  7. Right click on the blue line that was created and select Move To > onLoad.
  8. 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.

Feel free to download this and any of our free iBlocs here, and please tell us what you think.

4 replies
  1. Jason Barker says:

    I can’t get it to work at all! I drag the iBloc onto the canvas, select the table, check the boxes for alt row zebra stripe, highlight on mouseover, and it should work, right?

    Using iRIse 8.8.1, IE9, and Chrome 22.

    • Eric Romanik says:

      Jason, are you triggering the Zebra Striper action with an onLoad event? See steps 5-8 above for instructions on how to do that. Let me know if you’ve done that and it still doesn’t work.

  2. Eric Johnston says:

    Zebra Striper Action suddenly not responding correctly.

    Have been using Zebra Striper to much success. Unfortunately, yesterday 01/10/12 all iRise projects using it stopped functioning properly. For some reason the “Highlight Clicked Row” event no longer works (table colors revert to normal/alt colors when clicked on). Coloring for regular, alternate, and hover rows all still work.

    All projects are hosted on the iRise OnDemand Server (version Projects still produced error when ran from OnDemand Server or local. Projects still produced error when rendered in IE8 or Chrome.

    Can provide the .idoc file if need be.


Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

© Copyright 2017 - id8    Privacy Policy