Skip to content
This repository has been archived by the owner on May 1, 2024. It is now read-only.

[Bug] ScrollView inside SwipeView #12582

Closed
Denn1Ro opened this issue Oct 23, 2020 · 2 comments · Fixed by #12819
Closed

[Bug] ScrollView inside SwipeView #12582

Denn1Ro opened this issue Oct 23, 2020 · 2 comments · Fixed by #12819
Assignees
Labels
a/scrollview a/swipeview blocker Issue blocks next stable release. Prioritize fixing and reviewing this issue. e/4 🕓 4 i/regression in-progress This issue has an associated pull request that may resolve it! t/bug 🐛
Milestone

Comments

@Denn1Ro
Copy link

Denn1Ro commented Oct 23, 2020

Description

I use swipeview for entire screen with TopItems(Swipe direction from up to down).
Inside the swipeview there is a grid layout which has 3 section, Header, Body, Footer.
The Body section is a ScrollView.
Up until the Xamarin.Forms 4.7.0.1179 version, the swipeview events are canceled when the user swipes inside the ScrollView(Body section) and whenever tries to swipe in the Header or Footer section the swipe event are works fine.
From the version Xamarin.Forms 4.7.0.1239 and beyond, that behavior is changed.
Now the swipeview consumes ScrollView's scrolling events, so the ScrollView is disabled for the direction that is configured in swipeview(from up to down).
I think that the child(ScrollView) should has more priority to consumes these events than his parent(SwipeView) ?
If for some reason that I don't know the priority should be as it is right now, please give me some instructions on how to disable parent(SwipeView) event when the user uses the child element(ScrollView). I find the IsEnabled property of SwipeView but it doesn't help me because that disables swipe events for the entire screen. All I need is the child element should have more priority for consuming common events from his parent.
Code example:

`<SwipeView BackgroundColor="Transparent">
        <SwipeView.TopItems>
            <SwipeItems Mode="Execute" 
                        SwipeBehaviorOnInvoked="Close">
                <SwipeItem 
                        BackgroundColor="Transparent"
                        Command="{Binding SwipeCommand}"/>
            </SwipeItems>
        </SwipeView.TopItems>
        <SwipeView.Content>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="10*"/>
                    <RowDefinition Height="60*"/>
                    <RowDefinition Height="30*"/>
                </Grid.RowDefinitions>
                <!--HEADER-->
                <Label Grid.Row="0" Text="HEADER" Padding="20" BackgroundColor="Red"/>
                <!--BODY-->
                <ScrollView Grid.Row="1" BackgroundColor="Blue">
                    <StackLayout Spacing="20" Padding="15">
                        <Label Text="Dummy Text: 1" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 2" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 3" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 4" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 5" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 6" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 7" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 8" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 9" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 10" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 11" FontSize="Medium"  Padding="30"/>
                        <Label Text="Dummy Text: 12" FontSize="Medium"  Padding="30"/>
                    </StackLayout>
                </ScrollView>
                <!--FOOTER-->
                <StackLayout Grid.Row="2" Padding="20" BackgroundColor="Red">
                    <Label Text="FOOTER"/>
                </StackLayout>
            </Grid>            
        </SwipeView.Content>
    </SwipeView>`

Steps to Reproduce

  1. Create an new Xamarin Forms
  2. Copy - Paste the code above inside a content page
  3. Swipe from up to down direction for all three different sections(Header, Body, Footer) in Xamarin.Forms 4.7.0.1179 and the latest version in order to detect the different behavior.

Expected Behavior

The scollview should consume the swipe event with direction from up to down and cancel his parent(SwipeView).

Actual Behavior

The SwipeView as a parent element consumes the swipe event and it cancels any other common event from his children.

Basic Information

  • Version with issue: Xamarin.Forms 4.7.0.1239 and above
  • Last known good version: Xamarin.Forms 4.7.0.1179
  • IDE: Visual Studio for Windows
@Denn1Ro Denn1Ro added s/unverified New report that has yet to be verified t/bug 🐛 labels Oct 23, 2020
@samhouts samhouts added this to New in Triage Oct 23, 2020
@jsuarezruiz jsuarezruiz self-assigned this Oct 28, 2020
@jsuarezruiz jsuarezruiz moved this from New to Needs Estimate in Triage Oct 28, 2020
@jsuarezruiz jsuarezruiz removed the s/unverified New report that has yet to be verified label Oct 28, 2020
@jsuarezruiz jsuarezruiz added this to To do in vNext+1 (5.0.0) via automation Oct 28, 2020
@jsuarezruiz jsuarezruiz moved this from To do to Blockers in vNext+1 (5.0.0) Oct 28, 2020
@PureWeen PureWeen added the blocker Issue blocks next stable release. Prioritize fixing and reviewing this issue. label Oct 31, 2020
@jsuarezruiz jsuarezruiz moved this from Needs Estimate to Ready For Work in Triage Nov 4, 2020
@PureWeen PureWeen added i/regression blocker Issue blocks next stable release. Prioritize fixing and reviewing this issue. and removed blocker Issue blocks next stable release. Prioritize fixing and reviewing this issue. labels Nov 5, 2020
@PureWeen PureWeen added this to the 5.0.0 milestone Nov 5, 2020
@samhouts samhouts added this to To do in Other Ready For Work Nov 5, 2020
@samhouts samhouts removed this from Ready For Work in Triage Nov 5, 2020
@jsuarezruiz
Copy link
Contributor

jsuarezruiz commented Nov 12, 2020

@Denn1Ro Thanks for the detailed description. I am working in the fix: #12819
Tested the behavior from 4.7 to 5.0 and, the behavior in the PR is slightly different but I think better. Could you review the description of the behavior and look at the attached gif of the PR and give me your feedback? Is it the behavior you would expect?

fix12582

@jsuarezruiz jsuarezruiz added the in-progress This issue has an associated pull request that may resolve it! label Nov 12, 2020
@Denn1Ro
Copy link
Author

Denn1Ro commented Nov 12, 2020

@jsuarezruiz your solution is just perfect! Would you create this implementation for IOS too ?
Thank you!

@rmarinho rmarinho moved this from Blockers to In Progress in vNext+1 (5.0.0) Nov 27, 2020
Other Ready For Work automation moved this from To do to Done Dec 10, 2020
vNext+1 (5.0.0) automation moved this from In Progress to Done Dec 10, 2020
rmarinho pushed a commit that referenced this issue Dec 10, 2020
* Added repro sample

* Fixed SwipeViewItem size

* Fix the issue
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
a/scrollview a/swipeview blocker Issue blocks next stable release. Prioritize fixing and reviewing this issue. e/4 🕓 4 i/regression in-progress This issue has an associated pull request that may resolve it! t/bug 🐛
Projects
Development

Successfully merging a pull request may close this issue.

3 participants