Selected Member path

Hi,

I do not want to setup the selected items with the property selecteditems but with a property in my model object.

I then created a custom sfchipgroup with a CheckmemberPath.

But it's not working.

Can you pklease help?

I added my test project attached.

Thanks,

Attachment: TestChip_1065d6d9.zip

7 Replies 1 reply marked as answer

SM Saravanan Madheswaran Syncfusion Team March 17, 2021 12:14 PM UTC

Hi Alexis, 
 
Greetings from Syncfusion support.  
 
We would like to let you know that due to some internal architecture, we have limited the binding context of in-build chips. As a solution, we recommend setting the binding value from the internal "DataContext" property. 
 
Please check the code snippet below. 
 
private void Child_ChildAdded(object sender, ElementEventArgs e) 
    var sfChip = e.Element as SfChip; 
    if (sfChip != null
   
. . . 
        var dataContext = GetInternalProperty(typeof(SfChip), sfChip, "DataContext"); 
        sfChip.SetBinding(SfChip.ShowSelectionIndicatorProperty, 
            new Binding() 
           
                Path = CheckMemberPath
                Mode = BindingMode.TwoWay, 
                Source = dataContext 
            }); 
   
. . . 
. . . 
public static object GetInternalProperty(Type type, object obj, string propertyName) 
    var property = type.GetTypeInfo().GetDeclaredProperty(propertyName); 
    if (property != null
   
        return property.GetValue(obj); 
   
 
    return null
 
 
 
 
Regards, 
Saravanan. 



AL Alexis March 20, 2021 09:05 PM UTC

Thanks a lot. It works but not for the SelectedChipBackgroundColor. When I set selected on my model it doesn't change the SelectedChipBackgroundColor.

How can I fix this?


SM Saravanan Madheswaran Syncfusion Team March 22, 2021 08:51 AM UTC

Hi Alexis, 
 
Setting “ShowSelectionIndicator” enables the chip indicator not selected the chip of ChipGroup. So, maintaining the SelectedItems is the best practice to enable the selected items.  
 
If not need to maintain selected items at view model, try maintaining at your extended class like below.  
 
public class CustomChipGroup : SfChipGroup 
    public CustomChipGroup() : base() 
   
        SelectedItems = new ObservableCollection<object>(); 
   
 
private void Child_ChildAdded(object sender, ElementEventArgs e) 
    var sfChip = e.Element as SfChip; 
    if (sfChip != null
   
        var dataContext = GetInternalProperty(typeof(SfChip), sfChip, "DataContext") as Word; 
        if (dataContext.IsSelected) 
            SelectedItems.Add(dataContext); 
 
   
} 
 
 
 
 
Regards, 
Saravanan.  



AL Alexis March 22, 2021 09:42 AM UTC

I cannot bind the color background color SelectedChipBackgroundColor in the chip child added?


SM Saravanan Madheswaran Syncfusion Team March 23, 2021 11:46 AM UTC

Hi Alexis, 
 
From your update, we understand like that is not possible to bind selected chip color to chip?, if so it will be achieved like below.  
 
private void Child_ChildAdded(object sender, ElementEventArgs e) 
    var sfChip = e.Element as SfChip; 
    if (sfChip != null
   
        sfChip.SetBinding(SfChip.CornerRadiusProperty, new Binding() { Path = "CornerRadius", Source = this, Mode = BindingMode.TwoWay }); 
        var dataContext = GetInternalProperty(typeof(SfChip), sfChip, "DataContext") as Word; 
        sfChip.SetBinding(SfChip.ShowSelectionIndicatorProperty, 
         new Binding() 
        
             Path = CheckMemberPath, 
             Mode = BindingMode.TwoWay, 
             Source = dataContext 
         }); 
 
        sfChip.SetBinding(SfChip.BackgroundColorProperty, new Binding() 
       
            Path = "SelectedChipBackgroundColor"
            Source = this
        }); 
   
} 
 
 
  
This binding will be replaced, when we select or deselect the chip at touch interaction. So, please share your exact use case scenario and what is the actual problem faced while maintaining SelectedItems collection. It will help us to assist you earlier.  
 
Regards, 
Saravanan.  



AL Alexis March 24, 2021 12:25 AM UTC

Thanks,

I have a list of languages as a sflistview.

Then in the bindingcontext I setup my custom sfchipgroup whith the list of books. 

So I request my API and get a list of languages which has a list of books with the property isselected

So then I just would like to bind my model as List of languages and everything is setup.

Then what I want to provide is the way for the user to select or deselect the books by touching the chip.

I have been able to do everything the only issue I have is the color of selection color of the chip. 

If I have to use selecteditems it means that I have to complexify my model by doing:

List<Language>
   List<Book>
             |-> SelectedBooks

Not the best scenario. 

This why I need a binding on the selectionbackgroundcolor based on the isselected model path.

Can you help on this?




SM Saravanan Madheswaran Syncfusion Team March 24, 2021 08:34 AM UTC

Hi Alexis, 
 
Query: This why I need a binding on the selectionbackgroundcolor based on the isselected model path. 
 
We have achieved this requirement by setting the background color based on the isSelected member path using IValueConverter.  
 
Converter: 
public class SelectedColorConverter : IValueConverter 
{ 
 
    public Color SelectedBackgroundColor { get; set; } 
    public Color BackgroundColor { get; set; } 
 
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
        if(value != null) 
        { 
            if ((bool)value) 
                return SelectedBackgroundColor; 
        } 
 
        return BackgroundColor; 
    } 
 
    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
        return value; 
    } 
} 
 
At item added: 
public class CustomChipGroup : SfChipGroup 
    private static SelectedColorConverter colorConverter; 
    public CustomChipGroup() : base() 
   
        colorConverter = new SelectedColorConverter(); 
   
 
private void Child_ChildAdded(object sender, ElementEventArgs e) 
    var sfChip = e.Element as SfChip; 
    if (sfChip != null
   
         
        var dataContext = GetInternalProperty(typeof(SfChip), sfChip, "DataContext") as Word; 
        sfChip.SetBinding(SfChip.BackgroundColorProperty, new Binding() 
       
            Path = CheckMemberPath, 
            Source = dataContext, 
            Converter = colorConverter, 
        }); 
   
 
But we are wondering that setting indicator and background color that’s not meant that the chip was selected until its not added to SelectedItems collection. if not able to maintain the collection at view model, then possible maintain collection inside chip group like below. 
 
private void Child_ChildAdded(object sender, ElementEventArgs e) 
{ 
    var sfChip = e.Element as SfChip; 
    if (sfChip != null) 
    { 
. . . 
        if (dataContext.IsSelected) 
            SelectedItems.Add(dataContext); 
    } 
} 
 
We hope the above information help you to achieve your requirement.  
 
Regards, 
Saravanan.  


Marked as answer
Loader.
Up arrow icon