Responsive Design Samples/Code Start

This forum allows developers to post programming tips and coding techniques that may be useful to other Visual LANSA developers. The information contained in this forum has not been validated by LANSA and, as such, LANSA cannot guarantee the accuracy of the information.
Post Reply
dannyoorburg
Posts: 156
Joined: Mon Jan 04, 2016 9:50 am
Location: Australia

Responsive Design Samples/Code Start

Post by dannyoorburg » Fri Jan 15, 2016 11:25 am

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 3941 times
Mobile size:
SYD Mobile.png
SYD Mobile.png (13.38 KiB) Viewed 3941 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.

Cheers,
Danny

PS: If anyone else has some nice samples on how to do a (responsive) application framework, please share them.
Attachments
Responsive Layout CodeStart - my Sydney App V14 GA.zip
(74.44 KiB) Downloaded 323 times

Post Reply