Grid View acts as a Group that displays items in a two-dimensional, scrollable grid. A grid view or a datagrid is a graphical control element that presents a tabular view of data.
Configure.IT brings you this control with the data being displayed as per your requirement. You can have number of rows and columns as desired. Configure the Grid cell where you can have Image, Button, Label, etc within and find the data being populated. After all, the way you display your data, Matters! Hence explore and give that finest User Interface and Experience.
Sets border width for a control.
Sets radius with which control's rounded corners should be drawn. Setting this property will enable control appear with rounded corners.
Sets the border color for a control. Works only if "Border Width" property is set to a value more than 0. Default would be black color.
Sets width of each dash in dashed border pattern for a control.
Helps set the spacing between Dashes for Dashed Border.
Sets angle in degrees to which control in its normal state has to be rotated. Possible values for this property are -360 to 360.
Used to set space between two tiles.
Sets the space between Grid Tiles.
This property is for enabling dynamic height for Grid View based on number of cells. Maximum height would be the value set in "Height" property.
This property is for setting web service key name based on whose value we have to group data source into sections. Works only if "Sections Enable" property is enabled.
This property is for setting "Object ID" of view to be shown as header of sections. Works only if "Sections Enable" property is set.
Sets the background color for header of sections. Works only if "Sections Enable" property is set.
Sets the background image for header of sections. Works only if "Sections Enable" property is set.
Displays single character in sectional header and sections will be grouped based on alphabet.
Enables cornered border for sections. Works only if "Border Corner Radius" property is set.
A WS key name based on which paging will be done (ex: next_page)
This property is for setting "Object ID" of view that has to be shown as footer for Table or Grid view when user scrolls down to the end for loading next page. Works only if "page token Id" property is set, "Paging Enable" property is enabled and "Table Load Next Page" event is configured.
This property sets "Object ID" of control which has to be shown when there is no data available to show in Grid View control.
This property disables sorting of sections associated with Table View, if "Sections Enable" and "Section Key" properties are set. If this property is enabled, sections will not be sorted. Else sections will be sorted based on the key set in "Section Key" property.
Sets the web service key based on which table view data has to be sorted.
This property is for enabling single tile deletion on long press. If this property is enabled when user long presses on a tile delete button would appear on that tiles and user can delete that tile by tapping on delete button.
This property is for enabling multiple tile deletion on long press. If this property is enabled when user long presses on a tile, delete button would appear on all tiles and user can delete multiple tiles.
This property is for setting image for delete button shown when long pressed on cell. Works only if "Enable Deletion Of All Tiles on Long Press" or "Enable Deletion On Long Press" property is enabled.
This property is for setting delete button x position offset from grid view cell origin x position. Default value is -5 Used to set x offset of delete button. Works only if "Enable Deletion Of All Tiles on Long Press" or "Enable Deletion On Long Press" property is enabled.
This property is for setting delete button Y position offset from grid view cell origin Y position. Default value is -5 Used to set Y offset of delete button. Works only if "Enable Deletion Of All Tiles on Long Press" or "Enable Deletion On Long Press" property is enabled.
This property is used to set border color for Grid View tiles in normal state.
This property is used to set border color for selected Grid View tile.
Sets "Object ID" of control, on whose click, you want to provide single selection.
Sets "Object ID" of control, on whose click, you want to provide multiple selection.
This property sets name of the key with which selected values should be stored in session.
This property is for setting "," separated keys you want to send to WS.
This property is for setting "Object ID" of View that should be shown as header when view is scrolled downwards. Works only if "Enable Vertical Navigation" property is enabled.
This property for setting "Object ID" of view that has to be shown as sectional footer.
Enabling this property will animate cells loading while scrolling Grid View.
Sets Grid View cells Wave, Fan or Curl animation direction left to right of the screen. This works only if "Enable Row Animation" is enabled and "Animation Type" property is set to "Wave", "Fan" or "Curl".
Sets animating Grid View cells tilt backwards. This works only if "Enable Row Animation" is enabled and "Animation Type" property is set to "Tilt".
Set the Animation effects for rows loading, from the different available options as curl, fade, flip, etc.
Sets the time duration for Animation. Works only if "Enable Row Animation" property is enabled.
Set the Indicator style from Default, Black or White. The style of the scroll indicators.
A Boolean value that manages visibility of horizontal scroll indicator visible while scrolling horizontally.
A Boolean value that manages visibility of vertical scroll indicator visible while scrolling vertically.
Enable scrolling with this option.A Boolean value that determines whether scrolling is enabled.
A Boolean value that determines whether paging is enabled for the scroll view.
A Boolean value that determines whether scrolling is disabled in a particular direction.
A Boolean value that controls whether the scroll view bounces past the edge of content and back again.
A Boolean value that determines whether bouncing always occurs when horizontal scrolling reaches the end of the content view.
A Boolean value that determines whether bouncing always occurs when vertical scrolling reaches the end of the content view.
A floating-point value that specifies the minimum scale factor that can be applied to the scroll view's content.
A floating-point value that specifies the maximum scale factor that can be applied to the scroll view's content.
A Boolean value that determines whether the scroll view animates the content scaling when the scaling exceeds the maximum or minimum limits.
A Boolean value that determines whether the scroll view delays the handling of touch-down gestures.
A Boolean value that controls whether touches in the content view always lead to tracking.
Enables user interaction i.e, control responds to user touches.
This is for setting transparency of control. ranges from 0 to 1.
Used to set the background color to the Grid View.
Group of vertical android default properties.
These are the android default properties to set selected view with respect of other view.
Reference object that is used for positioning selected object
marginTop : Specifies extra space on the top side of this view. This space is outside this view's bounds.
marginBottom : Specifies extra space on the bottom side of this view. This space is outside this view's bounds.
Value define the extra space value in pixel.
This property centers the child vertically with respect to the bounds of its parent view.
If any of the vertical layout setting parameter(s) are selected then this value is selected to indicate user applied vertical custom layout setting parameter(s)
Group of horizontal android default properties.
Reference type is the the default property to set selected view with respect to other view.
Reference object that is used for positioning selected object.
marginLeft : Specifies extra space on the left side of this view. This space is outside this view's bounds.
marginRight : Specifies extra space on the right side of this view. This space is outside this view's bounds.
Offset Value defines the extra space value in the pixel.
This property centers the child horizontally with respect to the bounds of its parent view.
If any of the horizontal layout setting parameter(s) are selected then this value is selected to indicate user applied horizontal custom layout setting parameter(s).
Sets the X position of the Grid View.
Sets the Y position of the Grid View.
Sets the width of the Grid View.
Sets the height of the Grid View.
Sets unique identifier for the control. Grid View can be referenced with the name set in this property for configuration.
Set "Object ID" of Grid View which contains this control or can serve as parent.
Sets “key name to datasource” for a particular part of datasource.
Set the identifier of Grid View Cell or View to be shown as rows for Grid View control.
This property centers the child vertically with respect to the bounds of its parent view.
The height of the view cannot be less than the given value.
If user select “Default Min Height” then android default value is taken otherwise it takes 0dp.
The width of the view cannot be less than the given value.
If user select “Default Min Width” then android default value is taken otherwise it takes 0dp.
Group of horizontal android default properties.
If any of the layout setting parameter(s) are selected then this value is selected to indicate user applied custom layout setting parameter(s).
For instance, a Bottom value of 2 will push the view's content by 2 pixels to the top of the bottom edge
Group of vertical android default properties.
Sets the height of the view
match_parent/fill_parent : Takes the height as its parent view
wrap_content : Takes the height as its content’s height
The padding is expressed in pixels for the left, top, right and bottom parts of the view. Padding can be used to offset the content of the view by a specific amount of pixels.
For instance, a Left value of 2 will push the view's content by 2 pixels to the right of the left edge
For instance, a Right value of 2 will push the view's content by 2 pixels to the left of the right edge
Sets the width of the view
match_parent/fill_parent : Takes the width as its parent view
wrap_content : Takes the width as its content’s width
For instance, a Top value of 2 will push the view's content by 2 pixels to the bottom of the top edge
Hiding an element can be done by checking ‘Hide’. This property lets you hide the control.
Advance - Sets auto resizing with respect to superview, for Grid View.
A Boolean value that determines whether subviews are confined to the bounds of the control.
This event is triggered on load Grid View. Hence any action can be defined [for eg: when a Grid View loads like API Call to load data to be shown on cells] This can be configured in "LOAD" event listed under "Action(S)" tab of Grid View control.
This event is triggered when a row on Grid View is tapped. Any action to be defined when row is tapped can be configured in "Table Select Row" event listed in "ACTION(S)" tab of Table View controls.
This event is triggered when cell of a Grid View is about to load. Any actions to be performed on Grid View cell load can be configured in "Table Cell Will Load" event listed under "ACTION(S)" tab of Grid View control.Note: This event is used for multiple cell configuration i.e, showing more than one kind of a cell in Grid View.
This event is triggered when all rows of Grid View are loaded completely. So any actions to be performed after all cells are loaded, can be configured in "Loaded Successfully" event listed under Grid View control.
This event is triggered when an item of Grid View is deleted. So any actions to be performed after deeltion of item, can be configured in "Delete On Grid Item" event listed under Grid View control.
This feature lets you animate items while user scrolls Grid View to view them. Use “Enable Row Animation” property to enable item animation. You can select the type of animation from “Row Animation Type” property. Here you have wide range to choose from, such as Curl, Fade, Fan, Flip, Helix, Tilt, Wave where Curl is the default one. You can customize the animation using “Animation Duration”, “Row Animation Start Position”, “Animate To Right” and “Animate To Back” properties.
This feature facilitates Grid View data to be refreshed when user pulls it down and releases. You need to configure “API Call ” action in “Table Pull Refresh” event under Grid View control’s Property-Action window to add this feature.
Pagination lets you load Grid View data in batches. This feature proves to be extremely useful when you need to show large data in Grid View. Using this you can load relatively less amount of data on startup. This increases startup loading speed and populates the grid with data, faster. To add this feature you need to configure “Trigger Data Source(API Call)” action in “Table Load Next Page” event under Grid View control’s Property-Action window.
Sectional Grid View is for displaying Grid data divided into sections. You can configure sectional grid using, “Sections Enable” and “Section Key” properties. You can also customise sections using, “Section Header View ID”, “Section Header Color”, “Section Header Background Image”, “Sectional Data is Single Character” and “Section Corner Radius Enable” properties.
This feature lets you add delete button to grid view item when user long presses on it. You need to enable “Enable Delete On Long Press” or “Enable Deletion Of All Tiles On Long Press” property. Configure “Delete On Grid Item” event for performing any actions on deletion of grid item.
Grid View height is set to dynamic by enabling “Dynamic Height Enable” property, i.e, Grid View height will be set in run time based on number of items it contains. Grid height will be set by adding height of each row or column of items(based on scroll direction enabled). It will be set to a value minimum of row height sum and height set in “Height” property of Grid View.
Configure.IT provides you this feature of showing a view to indicate user that there is no data available to display using “Empty Data Representation View ID” property. You need to set control to “Empty Data Representation View ID” property, which you want to show when there is no data available to show in Grid View. This reduces the overhead of configuring “Change Object Properties” >> “Hidden” action explicitly by checking response of API.
Follow us on Social Media to stay updated
Chat with our support agents in real time and get answers to your questions.
Have any questions related to sales or getting on board? Send us your questions.
