Xamarin.Forms: Access layout individually when it has a binding context - xamarin.forms

Question

I have a layout with a few elements that get layout binding:
<Grid Grid.Column="1" RowSpacing="0">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Label
HorizontalOptions="Start"
VerticalOptions="End"
FontFamily="arial"
FontSize="18"
TextColor="#151515"
FontAttributes="Bold"
Grid.Row="0"
Text="{Binding title}"
/>
<Label
HorizontalOptions="Start"
VerticalOptions="Start"
FontFamily="arial"
FontSize="13"
TextColor="#151515"
Grid.Row="1"
Text="{Binding subtitle}"
/>
</Grid>
So I am giving it mulitple objects with different contents set on a variable with the same name and the result is that all layout get inflated with different contents. That works fine.
However, there is a little notification icon to the right of each layout:
<Grid Grid.Column="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<ImageButton
VerticalOptions="Center"
HorizontalOptions="Center"
Source="img_notify.png"
Grid.Column="1"/>
<!-- BackgroundColor="#00000000"-->
<Label
HorizontalOptions="Center"
VerticalOptions="Center"
FontFamily="arial"
FontSize="18"
TextColor="#ffffff"
FontAttributes="Bold"
Grid.Column="1"
Text="!"
/>
</Grid>
It looks like this:
Now, once the user clicked on one of those elements, the notify button is just supposed to dissapear, since the user has already seen it.
Therefor I set up a database that stores the name and the subtitle of the ad if clicked and the next time the list becomes visible, each object is checked:
private async void ReturnDataBaseToListAndUpdateNotifyButton(List<ListView_Matches> contentOfListView)
{
List<db_MatchesNotify_Type> contentOfDatabase = await Database.GetIDsAlreadyClickedOn();
foreach (var o in contentOfListView) // for each match in our list...
{
for(var i = 0; i < contentOfDatabase.Count; i++) //... check every object in our database if they match
{
if (o.title == contentOfDatabase[i].titleOfAd && o.userID == contentOfDatabase[i].userID) // check if matches then delete icon
{
}
}
}
}
.. by using nested looping.
Now I know that my database is working fine and that my logic is OK, but u see that in within the last "if" statement, nothing is happening since I dont know how to adress the notification button now.
Bascially, in within the IF (if a match between the data from the list and the data from the database is found) i would need to set the notifybutton to invisible.
But 1.) I cannot access the object by name since the property from a list is not transported to the class but most:
2.) even if I just set it to invisible then ALL the notifybuttons in my list would become insivible. Ofc I only want this particular object on which a match was found to become invisible.
I need to access the layout that has been inflated individually and decided for each new button now wheater it is visible or not.
How can I achieve that?
Thank you!

Answer 1

You do it the same way you have set your Labels' bindings. The idea is that this ImageButton will always be in the layout and you will simply toggle its IsVisible property with a binding.
<ImageButton
IsVisible="{Binding IsNotifyIconVisible}"
VerticalOptions="Center"
HorizontalOptions="Center"
Source="img_notify.png"
Grid.Column="1"/>
You haven't specified anywhere what your collection's binding context is, but I assume it is some sort of an IEnumerable<YourItemViewModel>. In YourItemViewModel.cs, besides title & subtitle, you will have a property IsNotifyIconVisible and that way you will be able set it to true/false on demand.