[SOLVED] scrollbars and placing more controls than the page allows

Anything beyond the basics in using the LiveCode language. Share your handlers, functions and magic here.

Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller

karmacomposer
Posts: 361
Joined: Wed Apr 27, 2011 2:12 pm

[SOLVED] scrollbars and placing more controls than the page allows

Post by karmacomposer » Tue Jul 10, 2018 4:18 pm

I am creating a form for a client project and need it to scroll to reveal more fields. Right now, I am using a tabbed interface as a container, not seeing any formal container control (used to other programming IDEs with format containers to hold items).

The card is set to 1024 x 768 (Ipad) but to be honest, it's going on much larger screen as a PC executable eventually. Possibly an in-browser HTML5 app as well. Mobile app if it will allow.

Is there a formal container control? How do I fit more on screen than the card allows? How do I get a scrollbar on the IDE so I can put more items on the potentially larger form?

I know of the scrollbar control, but not sure how to use that in the GUI to build larger forms (cards)?

If I am not being clear, I apologize.

Mike
Last edited by karmacomposer on Wed Jul 11, 2018 4:14 pm, edited 1 time in total.

dunbarx
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 9580
Joined: Wed May 06, 2009 2:28 pm
Location: New York, NY

Re: scrollbars and placing more controls than the page allows

Post by dunbarx » Tue Jul 10, 2018 4:38 pm

Hi.

A group of controls (note that even a single control can be grouped) might be the solution.

Have you ever played with something like this? You do not even need scrollBars, since you can set the scroll of such a thing directly. In this way, you can create a group much larger than the card rect, and move around the group at will.

Try it. Make a very large card and pretty much fill it with buttons randomly spaced all over. Group them all. Now reduce the group rect dramatically, and also the card rect both in X and in Y, and start setting the scroll (and the hScroll) of the group to various values, like 0, 42, and the width of the group

Craig Newman
Last edited by dunbarx on Tue Jul 10, 2018 4:50 pm, edited 3 times in total.

Klaus
Posts: 13806
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: scrollbars and placing more controls than the page allows

Post by Klaus » Tue Jul 10, 2018 4:40 pm

Hi Mike,

you cannot scroll careds, but you can "fake" it by GROUPing all your controls,
adjust the size of the group and enable scrollbars for it.


Best

Klaus

karmacomposer
Posts: 361
Joined: Wed Apr 27, 2011 2:12 pm

Re: scrollbars and placing more controls than the page allows

Post by karmacomposer » Tue Jul 10, 2018 4:46 pm

Here is my card:

Image

Here is the form:

Image

Grouping sounds good, but how do I PLACE the items on the screen without scrollbars in the IDE?

Mike

dunbarx
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 9580
Joined: Wed May 06, 2009 2:28 pm
Location: New York, NY

Re: scrollbars and placing more controls than the page allows

Post by dunbarx » Tue Jul 10, 2018 4:48 pm

Grouping sounds good, but how do I PLACE the items on the screen without scrollbars in the IDE?
Did you try my experiment?

Remember that you have to reduce both the rect of the group and the rect of the card to really play with the concept.

You do not need scrollbars at all, since they can be distracting.

Craig

dunbarx
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 9580
Joined: Wed May 06, 2009 2:28 pm
Location: New York, NY

Re: scrollbars and placing more controls than the page allows

Post by dunbarx » Tue Jul 10, 2018 4:56 pm

Once you see how you can "scroll" your group in both x and y, you can either use a slider to set the scroll, or do so without any visible gadget under script control. For example, you could use the mouseLoc, scaled as you require, to change the scrolls of the group.

Write back if any of this makes sense. (Lagi, I am watching you...)

Craig

bogs
Posts: 5435
Joined: Sat Feb 25, 2017 10:45 pm

Re: scrollbars and placing more controls than the page allows

Post by bogs » Tue Jul 10, 2018 4:58 pm

dunbarx wrote:
Tue Jul 10, 2018 4:48 pm
You do not need scrollbars at all, since they can be distracting.
I'm assuming that you mean aside from the ones that grouping normally provides in this instance, since scrollbars would be the expected behavior to get to the other parts of the form hidden by the grouping.

In the group, and for a form type setup like he is showing, I would expect to see at least a vertical scrollbar.

I see that you posted as I was typing Craig, but I would still expect a scrollbar on the vertical as a user.
Image

karmacomposer
Posts: 361
Joined: Wed Apr 27, 2011 2:12 pm

Re: scrollbars and placing more controls than the page allows

Post by karmacomposer » Tue Jul 10, 2018 4:59 pm

I grouped the whole kit and kaboodle, made it smaller and the card a bit smaller, turned on vertical scrolling (don't need or want horizontal scrolling).

I cannot move anything - The whole thing is grouped and I can move that around, but not with scrollbars.

The scrollbar DOES work when I run the program, but in edit mode I cannot scroll it and hence not put any more there.

If you look at the pictures, you'll see the bottom of the form I need to have there - and there's no room.

I am sure I am being stupid. It's been a long time since I last used LiveCode and now I really need to use it.

Mike

Klaus
Posts: 13806
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: scrollbars and placing more controls than the page allows

Post by Klaus » Tue Jul 10, 2018 5:07 pm

Hi Mike,

after resizing the rect of your group did you LOCLOCK the groups size in the inspector ("Position" tab)? If not, the group will resize itself to display all of its content!


Best

Klaus

karmacomposer
Posts: 361
Joined: Wed Apr 27, 2011 2:12 pm

Re: scrollbars and placing more controls than the page allows

Post by karmacomposer » Tue Jul 10, 2018 5:09 pm

I did check the lock size and position - is that what you are referring to?

Let me clarify - I need to graphically create a card larger than the screen.

I watched the tutorial on how to do this where you load a picture larger than the card and then scroll around it. That's great for one picture. This is an entire form (see picture 2 above).

In Photoshop nomenclature I need to enlarge my canvas so I can fit more on it and then scroll to those parts to place more controls.

I hope that makes sense.

Mike

Klaus
Posts: 13806
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: scrollbars and placing more controls than the page allows

Post by Klaus » Tue Jul 10, 2018 5:18 pm

Hi Mike,
karmacomposer wrote:
Tue Jul 10, 2018 5:09 pm
I did check the lock size and position - is that what you are referring to?
yes.

I know what you mean, you can always set the SCALEFACTOR in the inspector of the stack to do some finetuning and postion objects outside of the visible region of a card. I think this will be the most effective setting for your task.

Once all elements are ready you can select all, group it, adjust the groups size and then set the SCALEFACTOR back to 1. Know what I mean?


Best

Klaus

Klaus
Posts: 13806
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: scrollbars and placing more controls than the page allows

Post by Klaus » Tue Jul 10, 2018 5:20 pm

Hint:
In the preferences "General" you can set:
Property Labels are -> Name of Livecode property

This way you see the name of the property you can set in scripts and not only their descriptions!

karmacomposer
Posts: 361
Joined: Wed Apr 27, 2011 2:12 pm

Re: scrollbars and placing more controls than the page allows

Post by karmacomposer » Tue Jul 10, 2018 5:23 pm

Here is what I have with every inspector showing - what am I doing wrong?

Image

Thank you for helping me. Time is a factor and I am trying to get the design work done first.

Mike

karmacomposer
Posts: 361
Joined: Wed Apr 27, 2011 2:12 pm

Re: scrollbars and placing more controls than the page allows

Post by karmacomposer » Tue Jul 10, 2018 5:26 pm

Yes, that sounds right. Scale everything way down, edit, group and then scale back up.

Klaus, you are a genius! That's exactly what I was looking for.

Got it now!

Mike
Last edited by karmacomposer on Tue Jul 10, 2018 5:27 pm, edited 1 time in total.

Klaus
Posts: 13806
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: scrollbars and placing more controls than the page allows

Post by Klaus » Tue Jul 10, 2018 5:27 pm

Hi Mike,

inspector for the stack -> tab "Basic"


Best

Klaus

Post Reply

Return to “Talking LiveCode”