Appsheet “About” page and view is currently not really “customisable” for the moment, but some may want to generate landing page with more unique ways, and I was one of them. This would improve the appearance and users experience with app I believe.
This is just a simple trick in terms of how to create such by using Appsheet generic features alone. I suspect some app creator has been doing the same or similar and putting view in place to their app, but I will place this post for reference by user who does not know this trick.
To see is to believe, please have a look at this short movie.
This is basically super easy, and nothing difficult, but need to set up new simple table and follow a fixed path. See the steps to generate such a view.
Generate new table with list of the column you wish to place on the landing page. Such as Appname, etc, any sort of strings you wish to have. Make sure to have one image type fields, this image file will be used as background image of the landing page. (On my sample I use Gif file, but we can place any image file which Appsheet accept.)
Add table to Appsheet Editor
Make sure this table has full editable mode, i.e. can add, update, delete.
We utilise only one row out of this table. Add the row value either directly on your data source (spreadsheet) or view through the app view by adding new row.
Make sure you now have “values” on this table with single row.
You already may have “view” within you app. Anyway either way, generate “Detail View” out of this table and select “Detail View” at the end. Let’s place the name of this view as “Home”.
Now probably you see the detail view with data you already kicked in. Hit edit and go to edit mode. Upload image file to image type field and save view.
Add one Virtual Column with name “blank” and put app formula " ". Basically this generate null value, which won’t be visible.
Go to view setting. My sample app, it looks like this.
9.1 : I recommend to set Position to Menu as this should not be frequently used view, but place this whenever you want to place.
9.2 : Pick your image field for Main Image
9.3 : Header Columns, select “Blank” column.
*****Tips : You can place columns, such as App names, name of the site the app used etc into Header columns, rather than putting blank field. When you select fields, then it appears on the landing page. It s your choice and preference.
9.4 : Column Order, place the fields you put on. Those field will appear within the box which sit in the middle of the view in selected order.
9.5 : Display mode = Select “Centred”
9.6 : Image style = Background
As example, overall editor looks like this.
Go to table setting and then turn the setting of this table as “READ-ONLY”.
*Job completed, now you will see your own customised home/landing page whatever we call.
We can set this view as “start view” by going to UX pane, Options.
[Options to decorate view and make the view more actionable]
Below is just options. Possibility should not be limited, I welcome to hear what sort of optional trick you will find, interested to hear your feedback.
- Can add URL type column with hyperlink expression to place a link button to navigate and guide the user for the different and target view after landing page.
- Add actions, display overlay, prominently, inline
- add additional either image/thumbnail type column to kick into text box item. Gif file is one of my favourite to add.
**** I’m using Giphy to generate and host Gif.image file. Very useful and handy to generate gib out of the existing mp4 or other media.
Show if constrain to control and change item to show and hide based on users devices.
Hide field name to appear by changing display name of column to " "
This is mobile view for the same sample. On the mobile phone, we are able to use action to refresh the page without interrupting the use of the app by user. But some app user does not know this option is actually available even though we remind them before. So as additional reminder and guide to user, I added gif image of down arrow like my sample.
Enjoy creating nice Apps, everyone.