I have a page with only one canvas section. The section height is 755.
In webapp view/ and browser preview, i gets truncated and there is no vertical scroll bar.

Name: lf-longpage.png Views: 37 Size: 22.5 KB


The Page scrollbar is only available in the desktop client. If you split the controls between 2 canvas sections you can expand/collapse the sections as required or use ‘accordion behavior‘ to handle it automatically.

You need to decide will you use Standard sections, Custom sections or Canvas sections.

Canvas is free style. There you can play with containers and stack stuff horizontally as you wish. con: No responsive.
Custom is by code. Define class, define class…
Standard has integrated CRUD and less freedom but less work.

In web pages you see 3 column design mostly.
Lianja has left sidebar, right sidebar, and the center is occupied by section.


I have a CommandButton on a Canvas section. There are no other sections on the page. The page has Stretch Last Section = True.

I want the CommandButton to be anchored to the bottom right corner and I want it’s size to remain constant.

I have set Anchor=12 (which is what I would have used in VFP). This results in it being anchored to the bottom right corner, but the size changes based on the size of the page.


You can layout your controls in the resize delegate.
Look at the code in the example_canvaslayoutjs app.
The resize delegate is in javascript but the logic is the same in VFP.

if you open a file explorer window you can drag an image file onto a section to make it the background for the section. The image will automatically be copied into your App directory and set as the background image.


How do I stack sections horizontally? Say I have a grid on the left side and I want a form on the right side.


You can layout a form section horizontally using a grid gadget and/or adding dividers.


How do I change the background colour of the section?


look in lib:/pagecenter/pagecenter.rsp at line 16. You can customize the background.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.