Changing Label which is nested inside a CollectionView

0
votes

In my RecentProductsCV CollectionView, I have two <Label>s named PPriceLabel and PLastPriceLabel:

<CollectionView x:Name="RecentProductsCv" SelectionMode="Single">
    <CollectionView.ItemsLayout>
        <GridItemsLayout Orientation="Vertical" Span="2"/>
    </CollectionView.ItemsLayout>
    <CollectionView.EmptyView>
        <Label Text="No Product found." HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand"/>
    </CollectionView.EmptyView>
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <Frame CornerRadius="10" HeightRequest="90" WidthRequest="90" Grid.Row="0">
                    <Image Source="{Binding ProductImage}" Aspect="AspectFit" HeightRequest="90" WidthRequest="90"/>
                </Frame>
                <Label Text="{Binding ProductName}" TextColor="Black" FontSize="Subtitle" Grid.Row="1"/>
                <Label x:Name="PPriceLabel" Text="{Binding ProductPrice, StringFormat='BDT {0}'}" TextColor="#e67e22" FontSize="Caption" Grid.Row="2"/>
                <Label x:Name="PLastPriceLabel" Text="{Binding ProductLastPrice, StringFormat='BDT {0}'}" TextDecorations="Strikethrough" FontSize="Micro" Grid.Row="3"/>
                <StackLayout Orientation="Horizontal" Grid.Row="4">
                    <Label Text="{Binding ProductRatings, StringFormat='({0}/5)'}" TextColor="LightGray" FontSize="Caption"/>
                    <Image Source="ratingStar.png" Aspect="AspectFit" HeightRequest="25" WidthRequest="25"/>
                </StackLayout>
            </Grid>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

I want to disable PLastPriceLabel if the values of PPriceLabel and PLastPriceLabel are the same.

2
c#xamlxamarin.forms
create a bool property in your model that will return false if the two values are the same, and use it to set the visibility of the label – Jason
yeah, based on that you can bind the IsVisible property of the PLastPriceLabel. Another solution is also to the bind the IsVisible property of PLastPriceLabel but not with a bool in the model but with a IValueConverter and the value of PPriceLabel as parameter. – ThomasL
@Jason thank you for your suggestion, But I'm kind of new in this. Can you help me with the demo code. – Tanvir Hossen Rihab

2 Answers

0
votes

Xamarin Community Toolkit has a NotEqualConverter you can use to do this

<Label Text="{Binding ProductLastPrice, StringFormat='BDT {0}'}"
       TextDecorations="Strikethrough" FontSize="Micro" Grid.Row="3"
       IsVisible="{Binding ProductLastPrice, Converter={StaticResource NotEqualConverter}, 
       ConverterParameter={Binding ProductPrice}}" />
0
votes

In your ViewModel, you can add a new property to control whether the PLastPriceLabel is visible or not:

public class myViewModel
{
    public bool isAvailable { get; set; }
    public string ProductPrice { get; set; }
    public string ProductLastPrice { get; set; }

    public myViewModel()
    {
        isAvailable = true;
        getData();
    }

    void getData()
    {
        if (ProductPrice == ProductLastPrice)
        {
            isAvailable = false;
        }
    }
}

In your collectionView, bind the isAvailable to the isVisible property in the Xaml:

<Label x:Name="PLastPriceLabel" IsVisible="{Binding isAvailable}" Text="{Binding ProductLastPrice, StringFormat='BDT {0}'}" TextDecorations="Strikethrough" FontSize="Micro" Grid.Row="3"/>

Then PLastPriceLabel will not be visible when PPriceLabel & PLastPriceLabel value is the same.