Page 1 of 1

Responsive Design Samples/Code Start

Posted: Fri Jan 15, 2016 11:25 am
by dannyoorburg
Hi All,

attached is a simple sample on how you can architect a responsive application using a Visual LANSA Web Page.
(Of course there are many many different ways to do that...)

All you need to do is import it, compile it and run. (All objects have the SYD prefix)

This is what it looks like.

Desktop size:
SYD Desktop.png
SYD Desktop.png (8.96 KiB) Viewed 4060 times
Mobile size:
SYD Mobile.png
SYD Mobile.png (13.38 KiB) Viewed 4060 times
It's a simple navigation model, the content area shows three different panels.
- Home
- Places
- Events

Navigation is centralized into an application-scoped object (called SYDAPP).

Layout on the main page is done through an attachment layout with
- TOP: Header (one for mobile, one for desktop)
- TOP: Content
- BOTTOM: Footer

Doing it like this, TOP/TOP/BOTTOM, results in a page that scrolls as a single unit.

Most parts of the application change their appearance (slightly) when switching between mobile and desktop view.


PS: If anyone else has some nice samples on how to do a (responsive) application framework, please share them.