The TileView control was created to replace the default Dashboard view provided by DAW in their WebApplications. The Dashboard view is rather limited in functionality which prompted the creation of this class

Some of the features we had been looking for are

  • Dynamic Tiles
    Dynamically hiding and showing tiles. When doing so we expect the tile view to reorganize of course
    Dynamically adding and removing tiles. We also expect the tile view to reorganize when tiles are removed or added
    Dynamically changing content on tiles
  • Ability to easily change the appearance of tiles (Colors, Font, Font Size, Text location, icon, image, etc)
  • Different size tiles
  • Tiles with icons
  • Tiles with images
  • Responsive View
    tiles view should reorganize based on size of device

Types of Tiles

We want to support different size tiles. Normal Size (a square tile), small size (also square but smaller, 4 filling the space of one normal tile) and a wide tile (rectangular filling the space of 2 normal tiles)

We also want to support tiles with icons as well as tiles with images

Here is an example of what these tiles look like

tileview1

Lets take a look at the code that created these tiles

We can also dynamically modify a tile as follows

Responsive Tiles

We want our tile view to be responsive and change based on device size or browser size

tileviewanim

Hiding and Showing Tiles

We can hide and show Tiles by setting the pbShow property of the tile object

Full Dynamic Tiles

if we want to create tiles fully dynamic we can do that as well

The above code creates 3 tiles dynamically. We can also use the ClearTiles method to remove all tiles as well as the DeleteTile method to delete a specific tile.
A tile can be hidden or shown using the ShowTile method.

Visually Tiles can be modified in size, color, icon, image and other appearance using properties and/or css classes

This is just one of the many controls StarZen created for the WebApp platform.

Michael Salzlechner is the CEO of StarZen Technologies, Inc.

He was part of the Windows Team at Data Access Worldwide that created the DataFlex for Windows Product before joining StarZen Technologies. StarZen Technologies provides consulting services as well as custom Application development and third party products specifically for DataFlex developers