Input Enhancements in 2018v2 ComponentOne Studio for Xamarin

Our ComponentOne input (C1Input) controls are very popular for Xamarin, and we've recently added several quality of life enhancements in 2018v2. All C1Input controls have received updates, and we have made significant additions to our AutoComplete control.

AutoComplete

We’ve added a new AutoCompleteMode property for the AutoComplete control. We’ve always supported custom filtering for these controls, but this property makes it much easier to switch between your filtering between Contains, StartsWith, and EndsWith. It also lets you set a flag to MatchCase or MatchWholeWord (also new in this release).

This new mode has been implemented as enumerated flags. This allows you to combine them for new behaviors:

autoComplete.AutoCompleteMode = AutoCompleteMode.Contains | AutoCompleteMode.MatchCase;

AutoCompleteMode effects both the filtering that happens in the CollectionView behind the scenes, as well as the highlighting matching substrings in the DropDown suggestion list of the control. Custom filtering and formatting in the DropDown is also supported, and a user can create their own solution using Filtering and ItemLoading events. For instance, a user can also implement a similar StartsWith filter, with bold text:

private async void OnCustomFiltering(object sender, AutoCompleteFilteringEventArgs e)
{
    var autoComplete = sender as C1AutoComplete;
    var deferal = e.GetDeferral();
    try
    {
        await autoComplete.CollectionView.FilterAsync("Name", FilterOperation.StartsWith, e.FilterString);
        e.Cancel = true;
    }
    finally
    {
        deferal.Complete();
    }
}

private void OnItemLoading(object sender, ComboBoxItemLoadingEventArgs e)
{
    var autoComplete = sender as C1AutoComplete;
    var label = new Label();
    var name = (e.Item as Country).Name;
    var formattedString = new FormattedString();
    formattedString.Spans.Add(new Span() { Text = name.Substring(0, autoComplete.FilterString.Length), FontAttributes = FontAttributes.Bold });
    formattedString.Spans.Add(new Span() { Text = name.Substring(autoComplete.FilterString.Length) });
    label.FormattedText = formattedString;
    e.ItemView = label;
}

General C1 input changes

We’ve also added the ability to display a clear button with our controls. This feature will make text deletion much faster, and it can easily be toggled on and off by setting the ShowClearButton property on any of the Input controls:

A user only needs to perform a simple tap to clear all user entered data from one of our input controls. This will enable much faster corrections re-entry with AutoComplete, ComboBox, DropDown, and MaskedEntry.

This will enable much faster corrections re-entry with AutoComplete, ComboBox, DropDown, and MaskedEntry. Also we’ve added a Completed event to our Input controls which has the same behavior as the Xamarin.Forms Entry control. This event should make using the Input controls more like the out-of-the-box Xamarin.Forms controls. The event can be used for data collection, validation, or any other actions you’d like to perform once a user has finished entering data.

As part of this release, we’ve also improved the animations for input controls. This includes some touch-ups to the animations available on iOS and UWP. The animations can be toggled by setting the IsAnimated property.

Improving user experience

These new features add a significant amount of usability to our control and improve the developer and end-user experience. We've added many new control features at the request of our customers, and we're excited to see these features fill in the gaps in development for Xamarin and the native platforms. Be sure to check out the release and let us know what you think!