How can scroll views in an outline base the line of the center.

209 views
asked Apr 13, 2017 in GUI Development by linglongzhu
The size of the outline is bigger than the views it contains. How can scroll the views base the center of the outline?

1 Answer

0 votes
answered Apr 13, 2017 by Paul Banach
 
Best answer

Hi,

calculate the scroll displacement based on the distance between the center of the Outline Box and the center of the view you want to be arranged in the middle of the Outline area. For example:

// Get the center position of the Outline Box and of the view
// you want to arange in the middle of the Outline area.
var point outlineCenter  = Outline.Bounds.center;
var point someViewCenter = someView.Bounds.center;

// This is the necessary scroll displacement to arrange the 
// view in the center
var point displacement   = outlineCenter - someViewCenter;

// Let the Outline scroll by the just calculated displacement.
Outline.ScrollOffset = Outline.ScrollOffset + displacement;

If you want the scroll operation being performed smooth, use the Move point effect configured with:

Effect.Outlet = ^Outline.ScrollOffset;
Effect.Value1 = Outline.ScrollOffset;
Effect.Value2 = Outline.ScrollOffset + displacement;

Best regards

Paul Banach

commented Apr 13, 2017 by linglongzhu
Thanks for your answer, and I can understande your advice. But how can this process run in the SlideTouchHandler with the outline?
commented Apr 13, 2017 by Paul Banach
Can you explain your desired application case?
commented Apr 13, 2017 by linglongzhu
Scroll the views at the outline by the SlideTouchHandler base the center of the outline.
commented Apr 13, 2017 by Paul Banach

I still don't understand. You mean, after scrolling you want a view being centered within Outline? If this is the case, have you tried Configure the snap positions? With the snap positions you can instruct the Slide Handler to stop at predetermined positions. Knowing the size of the views within the Outline you can calculate the snap position and configure the Slide Touch Handler. This, however, works with views having equal size.

If the views have different size, you can configure the Slide Touch Handler to snap at a multiple of the smallest view. For example, if you display within the Outline Box views with 20, 30, and 60 pixel height, then you can configure the snap position to be 10. This is a multiple value valid for all three view sizes.

Then you can implement an OnEnd slot method to react to the end of the slide animation. This slot method is called when the Slide Touch Handler is finished with the scrolling. In the method you can determine which view is lying near to the center of the Outline Box. Knowing this view you can calculate the missing displaycement to adjust the scroll position, so that view will appear in the center of the Outline Box. Knowing this displacement, you can either adapt the value of the Outline ScrollOffset property or use an animation effect to do this smoot - as explained in my first answer.

Assuming, I understood your application case, in order to have the very first/last view in the center of the Outline Box you will need to add some additional gap views before the first and after the last real view. You can use for this purpose e.g. the Filled Rectangle view configured with transparent color #00000000. The view will thus not appear, the Outline Box however will calculate with its size so you can scroll and arrange the first/last real view in the center of the Outline Box.

Best regards

Paul

 

 

 

commented Apr 14, 2017 by linglongzhu
Thank for your advice. It has solved my question .

1. Devide slidehandler from the outline

2. Using the slidehandler's  slide, slideEnd event to control the scroll position of outline.

In addition, the default behavior of the combination of the outline and slidehandler is not fit to my case.

Embedded Wizard Website | Privacy Policy | Imprint

...