Skip to end of metadata
Go to start of metadata

This page describes how you can easily display your data in a grid view for android in Crosslight apps. You will learn how to configure GridFragment and create the binding provider for GridFragment.

If you haven't familiar with simple list in Crosslight, please check out Displaying Simple List. It is expected that you have successfully displayed a simple list and created the required View Model before continuing.

On this page:


Displaying Grid on android

To display a simple grid in Android, start by defining a grid fragment that derives from GridFragment(TViewModel) Class -- a specialized Grid fragment that supports ViewModel and automates most data-related tasks based on the view model that has been created --  along with a FragmentActivity(TViewModel) Class. You can also use the GridActivity(TViewModel) Class to display a Grid of items. In creating Grid Fragment, you must register your GridView identifier on InitializeView method. The content of the Grid fragment will look like the following :

Next, we need to create a FragmentActivity as the GridFragment's Activity.

Configure Binding Provider

Now, the GridFragment and FragmentActivity are ready, we should create a binding provider that will bind the data on View Model with android view. The binding provider content will look like the following:

Finally, make changes to GridFragment by specifying the Binding Provider that will be used.


The final results can be seen in the image below.

Android Phone

Android Tablet


For more information about the basics of data binding in Crosslight, see Understanding Binding Providers.

For more information about Android platform support in Crosslight, see Crosslight for Android.



The sample code for this article can be downloaded from our Git server: