WhileVisibleInScrollView

Hi guys,

I’m having some trouble with WhileVisibleInScrollView.

I have a ScrollView with several components inside:

<ScrollView ux:Name="editPlanningScrollView" LayoutMode="PreserveVisual">
	<StackPanel Margin="10,10,0,0">
		...
	</StackPanel>
</ScrollView>

I also have a bottom StackPanel:

<StackPanel Dock="Bottom" ux:Name="editPlanningBottomMenu">
	...
</StackPanel>

Which is shown like this:

Here we can see the ScrollView inside the blue borders.

Hence the Switch is a NativeViewHost component, when scrolling it will overlap the bottom bar:

So the idea is to hide it using WhileVisibleInScrollView.

<SwitchDetail ux:Name="switchDetail" ... Visibility="Hidden">
	<WhileVisibleInScrollView>
		<Change switchDetail.Visibility="Visible"/>
		<DebugAction Message="im in view" />
	</WhileVisibleInScrollView>
</SwitchDetail>

The problem here is that it detects the component “visible in the ScrollView” when it “enters” the bottom of the screen and not only when it’s on the ScrollView. (This happens for the other components too, but they hide behind the bottom StackPanel). When reaching the end of the screen the Switch component hides (the component is inside the blue border on the bottom of the screen):

I’ve tried playing around with the Distance property with no avail.

Is there a way so it hides when it reaches the end of the ScrollView and not the bottom of the screen?

Thank you in advance.

Hi!

Mixing native components with opengl components is currently not going to give you correct rendering. If you put a NativeViewHost around your whole app, you’ll get correct layering. Currently you might experience some bugs when doing that, but we are actively working towards fixing those. At that point, this will not be a problem at all, but until then, i suggest you use the Fuse components (at least for cases like this when you need proper layering and scrolling behaviors).

Let me know how this works for you :slight_smile:

Hi Kristian,

Thans for your answer.

If I surrounded the app with NativeViewHost it behaviours weirdly so this is not an option.

Before you included WhileVisibleInScrollView in fuse, I had the Bolav’s WhileVisibleInScrollView package included in my code.

And I played around a little with the function CheckInView in his uno code and I was able to hide the Switch before it reached the end of the page. That’s what I was going for and what I thought the Property Distance was for.

Thanks.