SearchBar

[Marius]

How can i add a SearchBar so it Search in the template page that shows all the templates i have added in TemplateList?

[Sakthivel Palaniyappan]

Hi Marius,

Greetings from Syncfusion.

We have analyzed your query and  we can achieve your requirement by using SfAutoComplete control as like below code snippet.

XAML: 

   <autocomplete:SfAutoComplete x:Name="autoComplete"  

                                     HeightRequest="40" 

                                     DisplayMemberPath="Name"  

                                     DataSource="{Binding EmployeeCollection}"> 

            <autocomplete:SfAutoComplete.ItemTemplate> 

                <DataTemplate> 

                    <StackLayout Orientation="Horizontal"  

                                 Padding="2,0,0,0">                   

                        <Label Text="{Binding Name}"  

                               VerticalOptions="Center"  

                               WidthRequest="500"/> 

                    </StackLayout> 

                </DataTemplate> 

            </autocomplete:SfAutoComplete.ItemTemplate> 

        </autocomplete:SfAutoComplete> 

Please let us know if you have any other queries.

Regards,
Sakthivel P. 

[Marius]

i added it but how will that do so i can Search in the template list to find what i search for in the list to it only shows that?

[Ruba Shanmugam]

Hi Marius,

Thanks for the update.

We are not clear with your recent query and we suspected that you may misunderstand with previously provided code snippet, for better clearance, we have prepared sample and please find the sample from below link

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/AutoComplete384617591  

Please refer the help document from below link
https://help.syncfusion.com/xamarin/autocomplete/overview

We hope this sample will clarify your doubts and still if you are facing the problem , Can you please explain with more details or provide any video /pictorial representation for this.

Regards,
Ruba Shanmugam 

[Marius]

I mean something like this example i found on the internet: https://www.youtube.com/watch?v=nFYwvZnDrcY

But only that it search in the list i you have that show all the pages in the group you have made in the xml file and that you get less in the list when you search so you more easy can find what you looking for. and then when you find what you search fore you can click on it and it shows the right page

[Sakthivel Palaniyappan]

Hi Marius,

Thanks for the update.

We have analyzed your query and by using FilterCollectionChanged event we can achieve your requirement as like below code snippet.

XAML: 

<StackLayout VerticalOptions="Start"  

                 HorizontalOptions="Start"  

                 Padding="30"> 

    <autocomplete:SfAutoComplete HeightRequest="40" Watermark="Search name" 

                             x:Name="autoComplete"  

                             SuggestionMode="Contains" 

                             SuggestionBoxPlacement="None" 

                             DisplayMemberPath="Name" FilterCollectionChanged="ComboBox_FilterCollectionChanged" 

                             DataSource="{Binding EmployeeCollection}" 

                             FilteredItems="{Binding Items,Mode=TwoWay}"/> 

    <StackLayout Orientation="Vertical" Margin="0,50,0,0"> 

        <Label Text="Filtered Items"  

               FontSize="20"  

               FontAttributes="Bold"  

               TextColor="Green"/> 

        <ListView  

            x:Name="MainListView"  

            RowHeight="30"> 

            <ListView.ItemTemplate> 

                <DataTemplate> 

                    <ViewCell> 

                        <StackLayout Orientation="Horizontal"> 

                            <Label Text="{Binding Name}" /> 

                        </StackLayout> 

                    </ViewCell> 

                </DataTemplate> 

            </ListView.ItemTemplate> 

        </ListView> 

    </StackLayout> 

C#:

 

private void ComboBox_FilterCollectionChanged(object sender, FilterCollectionChangedEventArgs e) 

{ 

    MainListView.ItemsSource = (IEnumerable)e.Value; 

} 

Sample:
https://www.syncfusion.com/downloads/support/directtrac/general/ze/AutocompleteSearch-2092540687.zip

Please let us know if you have aby other queries.

Regards,
Sakthivel P.