These iBlocs enable the insertion of an iPhone Date Time Picker widget on a page. They come in both a horizontal and a vertical orientation.
An iPhone Date Time Picker iBloc adds the following capabilities to an iRise simulation:
- Insert and easily configure a barrel-style date/time picker widget in your simulations.
- Leverage the On Selection Change and On blur custom triggers.
Before you start
- Download the iPhone Content Kit to leverage a wide variety of graphical content in your iPhone simulations (iRise 8.8 required).
- When building a simulation for an iPhone application, try to get your hands on an actual iPhone to get a feel for how applications work on the physical device. This will help guide the behaviors and interactions you build in your simulation.
- If you are not familiar with designing iOS applications, do a little research before attempting to build an iPhone simulation.
- Although the width and height of these iBlocs can be modified in Studio, these properties are ignored when the iBlocs are rendered in the browser. The dimensions of the iBloc in the browser will always be the default values indicated in the "Special Properties" table on this page.
- In simulation, the Target widget you specify when configuring the iBloc will be updated automatically when the reviewer changes the value in the iBloc. There is no need to submit data to see the change.
- Use the custom On blur event trigger to hide the iBloc automatically when focus is shifted to another widget.
- Use the custom On Selection Change event trigger to invoke navigation or page actions.
- You can set the value for Selected Date dynamically using the Set Value iBloc or from data values sent to the iBloc from the Canvas.
- Easily switch between iOS6 and iOS7 style with the Theme setting.
- Drag the appropriate iPhone Date Time Picker iBloc (Vertical or Horizontal) to a page.
- In the Properties Panel, choose a format from the options in the Date Format field. The selected format will be reflected in the value displayed in the Target widget, but not the iBloc itself.
- (Optional) Enter a value in the Selected Date field. Values entered into this field should match the format selected in the Date Format field. If no value is entered, the default value is the date/time on the reviewer's system clock.
- Click the chooser button in the Target widget field. The Select Widget box appears.
- Choose one of the widgets displayed in the Select Widget box and click OK.
- Modify the formatting attributes of the iBloc to meet the needs of your simulation.
In simulation, the reviewer can select a new date and time by clicking the different values displayed on the four wheels. Clicking and dragging will allow the reviewer to "spin" the wheels independently of each other. When a new value is chosen for any of the wheels, the change will instantaneously appear in the Target widget.
Latest Version: 3.2 Horizontal and 3.3 Vertical
Supported By: iRise
| iBloc Version
|| Minimum Studio Version
|| Supported Browsers
| 3.2 & 3.3
|| IE8, IE9 and IE10, Firefox 22, Chrome 30, Safari 5.1.7
| Expects / Produces
|| Normally used to set the dimensions of a widget, these attributes have no effect in simulation for this iBloc.
|| Will accept any positive integer in Studio, but always defaults in simulation to 320x180 for the Vertical Time Picker, and 480 x 150 for Horizontal.
|| Choose iOS6 or iOS7 style
| Selection from the available options.
| Date Format
|| Specifies the format of the value that is displayed in the Target widget.
|| Selection from the available date/time format options.
| Selected Date
|| Specifies the value that will be assigned both to the iBloc and to the widget selected in the Target widget field. When left empty, defaults to the date/time on the reviewer's system clock.
|| Text string in the format chosen in the Date Format field.
| Target widget
|| Links the Date Time Picker iBloc to a widget on the page. The default value of the iBloc will appear in the Target widget on page load. A built-in On Selection Change event automatically changes the value of the Target widget when a new value is selected using the iBloc.
|| Selection from the available widgets on the page.
Note: To associate a data field with one of the properties listed above, click the small square to the right of the property field. The Set Property dialog will allow you to select a data field currently flowing into the widget.