Applying filtering to ObservableCollection items without allocating additional memory for each filtered item - xamarin.forms

.Net Maui app. I want to have a SearchBar where user is able to enter search text and ListView or any other view with ItemsSource to react immediately by filtering out any not matched item. I do not want to re-create ObservableCollection of items each time user changes one single symbol in the search bar since it re-allocates memory for the filtered list of items, and the list could be long.
I've found how this handled by syncfuntion list control: https://help.syncfusion.com/maui/listview/filtering. Filter there applied "on the run" to each item in the list while binding it to the ItemsSource of a View, so no new collection is created for the search params, same collection is used but with different param on "per item" bases. You can achieve similar effect if you use IEnumerable with custom Where statement, but then you lost benefits of your collection being "observable". Any ideas on how to resolve this without syncfusion's listview control?

"Filter" by binding IsVisible of ItemTemplates view to a bool that you set.
<ListView.ItemTemplate>
<DataTemplate>
<SomeLayoutOrViewHere IsVisible="{Binding Show}" ...
...
public ObservableCollection<MyItem> MyItems ...
void ApplyFilter(...)
{
foreach (MyItem item in MyItems)
{
item.Show = ...;
}
}
public class MyItem : ObservableObject
{
public bool Show { get => show; set => SetProperty(ref show, value); }
private bool show;
...
}

Related

I am trying to add DataTemplate XAML code dynamically for CarouselView from View Model in MAUI. I am getting error. Please refer the attached images

Refer the below code snippets,
I am having Frame observable collection in View Model and it is binding to the UI.
In UI, I have CarouselView and assigning the DataTemplate values with ViewModel Property.
**ViewModel Property:**
public ObservableCollection<Frame> CarouselViewItemSource
{
get => carouselViewItemSource;
set
{
SetProperty(ref carouselViewItemSource, value);
}
}

How to change property value of a view inside CarouselView's ItemTemplate?

I have a CarouselView with ItemTemplate containing a Label and a Grid. Outside of that CarouselView, I want to make a button to modify Carousel's current item's Grid's visibility. Because it's inside ItemTemplate, I can't use x:Name to refer to that specific Grid, so how can I refer to the current item's Grid so I can change its property value? Thank you.
You will want to do that through databinding. As you already mentioned, you can't use x:Name. This is because you're inside of a template. The value in x:Name would be duplicated for each time that template is applied to a concrete item in your list, in this case a CarouselView. Moreover; if you use virtualization for that list, a template might not even exist at all at that point in time. All reasons why you can't use x:Name to reference anything inside of a template.
I don't have any info about the code you want to use this with, so I'll make something up.
If the backing collection for your CarouselView is a ObservableCollection<MyItem>, then your CarouselView might look something like this:
<!-- Databinding scope here is MyViewModel -->
<CarouselView ItemsSource="{Binding MyItemsCollection}">
<CarouselView.ItemTemplate>
<!-- Databinding scope here is MyItem -->
<DataTemplate>
<Button Text="Delete" IsVisible="{Binding CanDelete}" />
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
So you will have a backing view model which has a MyItemsCollection, and your page (that holds the CarouselView) has set the BindingContext to a new instance of MyViewModel:
public class MyViewModel
{
public ObservableCollection<MyItem> MyItemsCollection { get; set; } = new ObservableCollection<MyItem>();
private void LoadData()
{
var items = _myItemService.GetItems();
foreach (var item in items)
{
MyItemsCollection.Add(item);
}
}
}
Whenever you want to influence the IsVisible you will want to set the CanDelete of the MyItem that it's about to false. Let's assume MyItem looks like this:
public class MyItem
{
public bool CanDelete { get; set; }
}
You will need to implement the INotifyPropertyChanged interface on it so that the UI will pick up on any changes that are made to property values.
Now whenever you set the CanDelete of a certain instance of MyItem to false, that will change your UI. E.g.: MyItemsCollection[3].CanDelete = false;
On my YouTube channel I added a playlist with videos about data binding which might help in cases like these.
PS. At the time of writing IsVisible is bugged in .NET MAUI

Xamarin.Forms.EntryCell: How to trigger the event while input any key

I have a problem with Xamarin.Forms.EntryCell. I want to know how to trigger an event if the text of the EntryCell has changed. Not the event 'Completed', it is just triggered when I press Enter after inputting anything.
<EntryCell
Label="User Id"
x:Name="UserIdEntryCell"
HorizontalTextAlignment="End"
Completed="UserIdCompleted"/>
Obviously there is no event that is fired when the text is changed (see the docs). Anyway, this does not mean that you can't achieve what you want, by means of Text property. Since you are using the event I do not assume that you use MVVM (you should really give it a try, though), hence we'll have to create a property we will bind the EntryCell.Text to in your view (I'm assuming a view, but for a page it would be quite similar)
In your code behind add a property Text that calls HandleTextChanged from its setter:
class MyView : ContentView
{
string _text;
public string Text
{
get => _text;
set
{
_text = value;
HandleTextChanged();
}
}
private void HandleTextChange()
{
// do whatever you need to do
}
}
You can bind this property to EntryCell.Text from your XAML
Now MyView.Text will be set every time the text in your EntryCell changes.

How to extend the context menu inside the rehosted workflow designer?

We are using a rehosted designer (currently WF 4.0) with a lot of custom activities, all of them have custom designers. For a bunch of them, I would like to add entries to the context menu of the designer when in design mode. I'm talking about this menu:
E.g. for a XAML coded activity I would like to have an "Open source..." entry which will load the XAML source of that specific activity into a new designer. To do that I must add the entry to the menu, and when clicked figure out on which activity it was clicked. Both parts are unclear to me. How can I achieve that?
In WF 3 there was the ActivityDesignerVerb class to do that. In WF 4 there seems to be workflowDesigner.Context.Services.Publish<ICommandService>(...), but I can't figure out how to use that to add a custom action to the context menu. How can I do that?
This SO entry shows something for internal debugger commands, but I want to add a completely new command.
Solving it in the host
If you want to solve this on the workflow designer host, and not in the individual activities, it's quite simple and straightforward to do this.
When you host the workflow designer and create the workflow designer, you can simply access its ContextMenu property and modify its Items collection.
var wfd = new WorkflowDesigner();
wfd.ContextMenu.Items.Add(new MenuItem() { Header = "Hello", Command = yourCommand, });
If you want different menu items for each activity, you can subscribe to the SelectionChanged event:
wfd.Context.Items.Subscribe<Selection>(SelectionChanged);
And then implement your own logic:
private void SelectionChanged(Selection selection)
{
// Remove old menu item
if (oldMenuItem != null)
{
wfd.ContextMenu.Items.Remove(oldMenuItem);
oldMenuItem = null;
}
var modelItem = selection.PrimarySelection;
if (selection.SelectionCount == 1 && modelItem != null)
{
// Get activity type
var activityType = modelItem.ItemType;
var menuItem = new MenuItem() { /* ... */ };
wfd.ContextMenu.Items.Add(menuItem);
oldMenuItem = menuItem;
}
}
Solving it in the activity designer
If you want to always show a specific context menu item regardless of where your workflow designer UI is hosted, you can create a custom item in your activity designer XAML:
<sap:ActivityDesigner.ContextMenu>
<ContextMenu>
<MenuItem Header="Show" Command="{Binding YourCommand}"/>
</ContextMenu>
</sap:ActivityDesigner.ContextMenu>
OK so all you need to do is implement the ICommand interface on your custom activity.
So, for example - expose a custom command property from the customer activity class, then in the constructor apply a delegate event to the command handler -
/// <summary>
/// Custom activity
/// </summary>
public partial class CustomActivityDesigner
{
/// <summary>
/// Command used to display a dialog at design time
/// </summary>
public ICommand ShowCustomDialog{ get; set; }
public CustomSchedulerDesigner()
{
InitializeComponent();
ShowCustomDialog= new DelegateCommand(x =>
//Do some stuff here that will display your dialog
//you may want to consider passing the `this.ModelItem`
//to your dialog so it can then interact with the ModelTrees etc
//for example
var dialog = new MyDialog(this.ModelItem);
dialog.ShowDialog();
);
}
}
Finally,
hook the new command up to the UI via the activity designer xaml.
<sap:ActivityDesigner.ContextMenu>
<ContextMenu>
<MenuItem Header="Show" Command="{Binding ShowCustomDialog}"/>
</ContextMenu>
</sap:ActivityDesigner.ContextMenu>

DevExpress XtraGrid FocusedRowChanged event problem when changing datasource

This problem has bugged me for several years and maybe someone here knows a simple solution, since I just ran into it again.
QUESTION: Is there any way to get the XtraGrid to "forget" the current focused row index before a new (different) datasource is assigned to the grid?
BACKGROUND
We use the XtraGrid as a kind of controller for what is displayed in another panel of a multipane Winform.
Now imagine a hypothetical scenario where the datasource of the XtraGrid keeps changing according to menu selections. Menu item 1 populates the grid with a list of today's entrees in the cafeteria: Id, Name. Menu item 2 populates the grid with a list of Customers the user must phone that day: ID, Name. Important thing is that these are separate distinct datasources, and the grid's datasource is being assigned and reassigned.
CRITICAL FACT FOR THIS QUESTION:
We want the grid's FocusedRowChanged event to be the single place where we trap the user's selection in the controller grid. We are a "no spaghetti code" shop. FocusedRowChanged is better than a click event because it handles keyboard navigation too. The row with the focus contains the ID of the detail record we need to fetch from the database for display in Panel #2. This works--most of the time.
Here's how it doesn't work: let's say that on a given day, the list of customers the user must contact contains only one row. So the first (and only) row in the grid is the focused row. Now let's say that the user goes up to the menu and selects the menu item to display the day's cafeteria entrees. When the user clicks on the first item in the Entrees list, the FocusedRowChanged event does NOT fire because the grid has retained a memory of the focused row index from the previous datasource. The focused row index has not changed. And thus the user's selection doesn't trigger anything.
I tried to get DevExpress to offer a second more row-object-oriented mode (as distinct from row-index-oriented approach) whereby each row in the grid would have a GUID, and the FocusedRowChanged event would fire whenever the GUID of the currently focused row differed from the GUID of the previously focused row, regardless of whether the focused row index happened to be the same. This would allow dynamic changes of datasource and enable the desired behavior. But they demurred.
So I'll ask my question again, Is there any way to get the XtraGrid to "forget" the current focused row index before a new datasource is assigned to the grid?
Tim, I had the exact same problem when the grid only had one row of data in it and then changed data sources. I solved it by setting the gridview.FocusedRowHandle = -1 after setting the new datasource.
In a similar situation, I am subscribing to the
FocusedRowObjectChanged
event (using DevExpress 16.1).
I think that the best solution to this problem is to create a new GridView object and override its DoChangeFocusedRowInternal method. Below you will find the default implementation of this method. All you need to do is to change the marked row just as your needs dictate. Also, take a look at the How to create a GridView descendant class and register it for design-time use article, it contains some useful information.
public class MyGridView : GridView {
protected override void DoChangeFocusedRowInternal(int newRowHandle, bool updateCurrentRow) {
if(this.lockFocusedRowChange != 0) return;
if(!IsValidRowHandle(newRowHandle))
newRowHandle = DevExpress.Data.DataController.InvalidRow;
if(FocusedRowHandle == newRowHandle) return; // <<<<<<
int currentRowHandle = FocusedRowHandle;
BeginLockFocusedRowChange();
try {
DoChangeFocusedRow(FocusedRowHandle, newRowHandle, updateCurrentRow);
}
finally {
EndLockFocusedRowChange();
}
RaiseFocusedRowChanged(currentRowHandle, newRowHandle);
}
}
UPDATE
My code:
namespace MyXtraGrid {
public class MyGridControl : GridControl {
protected override BaseView CreateDefaultView() {
return CreateView("MyGridView");
}
protected override void RegisterAvailableViewsCore(InfoCollection collection) {
base.RegisterAvailableViewsCore(collection);
collection.Add(new MyGridViewInfoRegistrator());
}
}
public class MyGridViewInfoRegistrator : GridInfoRegistrator {
public override string ViewName { get { return "MyGridView"; } }
public override BaseView CreateView(GridControl grid) {
return new MyGridView(grid as GridControl);
}
}
public class MyGridView : GridView {
public MyGridView(GridControl ownerGrid) : base(ownerGrid) { }
public MyGridView() { }
protected virtual bool RowEqual(int focusedRowHandle, int newRowHandle) {
if(IsDesignMode)
return focusedRowHandle == newRowHandle;
DataRow row1 = GetDataRow(focusedRowHandle);
DataRow row2 = GetDataRow(newRowHandle);
return row1 == row2;
}
protected override void DoChangeFocusedRowInternal(int newRowHandle, bool updateCurrentRow) {
if(this.lockFocusedRowChange != 0) return;
if(!IsValidRowHandle(newRowHandle))
newRowHandle = DevExpress.Data.DataController.InvalidRow;
if(RowEqual(FocusedRowHandle, newRowHandle))
return;
int currentRowHandle = FocusedRowHandle;
BeginLockFocusedRowChange();
try {
DoChangeFocusedRow(FocusedRowHandle, newRowHandle, updateCurrentRow);
}
finally {
EndLockFocusedRowChange();
}
RaiseFocusedRowChanged(currentRowHandle, newRowHandle);
}
}
}
You can subscribe on the DataSourceChanged event which will fire when Data source changes (you guessed it!) so then you can get using GetFocusedObject() the object and display the relevant items for the other grid...

Resources