Xamarin.forms: [Bug] Shell SearchHandler blocks touch to view

Created on 29 Mar 2020  路  5Comments  路  Source: xamarin/Xamarin.Forms

Description

I have the following ContentPage that implements a SearchHandler to filter the CollectionView items source on the page. I set the ShowsResults to false, however there's still a view being displayed over the page preventing touches from getting to my CollectionView.

Steps to Reproduce

public partial class PapersPage : ContentPage
    {
        public PapersPage()
        {
            InitializeComponent();

            BindingContext = new PapersViewModel();

            Shell.SetSearchHandler(this,
                new PaperSearchHandler() { VM = (BindingContext as PapersViewModel) });
        }

    }

    class PaperSearchHandler : SearchHandler
    {
        public PapersViewModel VM { get; set; }

        public PaperSearchHandler()
        {
            SearchBoxVisibility = SearchBoxVisibility.Expanded;
            ShowsResults = false;
        }

        protected override void OnQueryChanged(string oldValue, string newValue)
        {
            base.OnQueryChanged(oldValue, newValue);
            if (string.IsNullOrEmpty(newValue))
            {
                //ItemsSource = null;
                VM.FilterPapers(string.Empty);
            }
            else
            {
                VM.FilterPapers(newValue);
            }
        }
    }
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:d="http://xamarin.com/schemas/2014/forms/design"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:vm="clr-namespace:WhitePaperBible.ViewModels"
    mc:Ignorable="d"
    x:Class="WhitePaperBible.Views.PapersPage"
    Title="Papers">
    <CollectionView
        x:Name="cv"
        ItemsSource="{Binding Papers}">
        <CollectionView.ItemsLayout>
            <GridItemsLayout
                Orientation="Vertical"
                Span="1" />
        </CollectionView.ItemsLayout>
        <CollectionView.EmptyView>
            <StackLayout>
                <Label
                    HorizontalOptions="CenterAndExpand"
                    VerticalOptions="CenterAndExpand"
                    Text="Loading Papers" />
            </StackLayout>
        </CollectionView.EmptyView>
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <ContentView
                    Padding="10">
                    <Frame
                        HasShadow="false"
                        BackgroundColor="#f1f1f1"
                        OutlineColor="#f2f2f2"
                        Padding="15,8"
                        CornerRadius="4">
                        <StackLayout
                            Padding="0">
                            <Label
                                FontSize="15"
                                MaxLines="1"
                                TextColor="Black"
                                d:Text="{Binding .}"
                                Text="{Binding title}" />
                            <Label
                                FontSize="11"
                                TextColor="Gray"
                                d:Text="Sally Someone"
                                Text="{Binding Author.Name}" />
                        </StackLayout>
                    </Frame>
                    <ContentView.GestureRecognizers>
                        <TapGestureRecognizer
                            Command="{Binding PaperSelectedCommand,
                                Source={RelativeSource AncestorType={x:Type vm:PapersViewModel}}}"
                            CommandParameter="{Binding .}"/>
                    </ContentView.GestureRecognizers>
                </ContentView>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Expected Behavior

Everything works as it does not, but the content of the page isn't behind a partially transparent view that blocks my touches.

Actual Behavior

Touches are blocked.

Basic Information

  • Version with issue: 4.6-pre2
  • Platform Target Frameworks:

    • iOS: 13.x

Screenshots

https://www.screencast.com/t/hciTVvHnU

Reproduction Link

https://github.com/davidortinau/wpbf/tree/bugs/search/WhitePaperBible

collectionview 4 bug

All 5 comments

@davidortinau did you find a workaround? For example a way of dismissing the transparent view when the query is confirmed? I am trying to accomplish the same thing and am experiencing the same issue on iOS.

For the moment I abandoned the SearchHandler and added a SearchBar. https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/searchbar

Running into the same issue. Calling Unfocus() in OnQueryConfirmed doesn't seem to do anything

Looking at ShellPageRendererTracker.AttachSearchController(), if we were to set _searchController.ObscuresBackgroundDuringPresentation = false; then the main view seems to stay in focus since there is no longer a dimmed view overlaying on top of it. Although, the search bar seems to be stuck in "search mode" where you can no longer see the page title but the search term stays:

Screen Recording 2020-11-01 at 8 16 57 AM

Looks like we need to set SearchController.Active = false when losing focus, I can make a PR

Was this page helpful?
0 / 5 - 0 ratings