XAML
<?xml version="1.0" encoding="UTF-8" ?>
<yummy:PancakeView
x:Class="Endeavor.App.Mobile.Controls.SearchControlWithDelay"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:effects="clr-namespace:Endeavor.App.Mobile.Effects"
xmlns:i18n="clr-namespace:JEndeavor.App.Mobile.Resources"
xmlns:yummy="clr-namespace:Xamarin.Forms.PancakeView;assembly=Xamarin.Forms.PancakeView"
x:Name="control"
Padding="0"
BackgroundColor="White"
CornerRadius="20"
VerticalOptions="Center"
AutomationId="searchControlView">
<SearchBar
x:Name="searchBar"
AutomationId="searchBar"
BackgroundColor="White"
HeightRequest="50"
Placeholder="{x:Static i18n:Translator.Header_Search}"
SearchCommand="{x:Binding Source={x:Reference control},
Path=SearchCommand}"
Text="{x:Binding Source={x:Reference control},
Path=Text,
Mode=TwoWay}">
<SearchBar.Effects>
<effects:SearchBarBackgroundEffect />
</SearchBar.Effects>
</SearchBar>
</yummy:PancakeView>
Code Behind
using System;
using System.Collections.Generic;
using System.Linq;
using System.Reactive.Linq;
using System.Text;
using System.Threading;
using System.Threading.Tasks;
using System.Windows.Input;
using Xamarin.Forms;
using Xamarin.Forms.PancakeView;
using Xamarin.Forms.Xaml;
namespace Endeavor.App.Mobile.Controls
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class SearchControlWithDelay : PancakeView
{
private readonly IDisposable searchPredicate;
public static BindableProperty TextProperty =
BindableProperty.Create(nameof(Text), typeof(string), typeof(SearchControlWithDelay), null, BindingMode.TwoWay);
public static BindableProperty SearchCommandProperty =
BindableProperty.Create(nameof(SearchCommand), typeof(ICommand), typeof(SearchControlWithDelay), null, BindingMode.TwoWay);
public ICommand SearchCommand
{
get { return (ICommand)GetValue(SearchCommandProperty); }
set { SetValue(SearchCommandProperty, value); }
}
public string Text
{
get { return (string)GetValue(TextProperty); }
set { SetValue(TextProperty, value); }
}
public SearchControlWithDelay()
{
searchPredicate = this.WhenAnyValue(x => x.Text)
.Throttle(TimeSpan.FromMilliseconds(500), RxApp.MainThreadScheduler)
.DistinctUntilChanged()
.Subscribe(x => SearchCommand?.Execute(x));
InitializeComponent();
}
}
}
The problem is that in every letter that I input, the command runs , but supposed to be the Command should run if there is a 500ms gap from typing the search
Did I do something wrong in my code? I am really new in using ReactiveUI and I am not yet familiar with it.
Can anyone help me correct my code? It would be greatly appreciated.