windows phone 8 longlistselector show and hide button based on recordid

Tag: windows-phone-7 , windows-phone-8 , windows-phone , windows-phone-7.1 Author: zhenghao88 Date: 2013-09-24

I have a books list displayed in my long list selector like this

   <DataTemplate x:Key="BooksItemTemplate">         
            <StackPanel Grid.Column="1" Grid.Row="0" VerticalAlignment="Top">
                <TextBlock Name="booktitle" Text="{Binding BookTitle,Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}" TextWrapping="Wrap" FontFamily="{StaticResource PhoneFontFamilySemiBold}"/>
                <TextBlock Text="{Binding AuthorName,Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}" TextWrapping="Wrap" FontFamily="{StaticResource PhoneFontFamilySemiLight}"/>
                <Button Content="Add To Favourites" Tag="{Binding BookId,Mode=OneWay}" Click="Button_Click_1" ></Button>

 <phone:LongListSelector x:Name="bookslist" Grid.Row="1" 
                                 ItemsSource="{Binding BooksList}"
                                 ListFooterTemplate ="{StaticResource booksListFooter}"                        
                                 ItemTemplate="{StaticResource BooksItemTemplate}"/>

so there is an add to favourites button beside every book in the list . pressing that button i am entering the pressed book's id in my isolatedstoragesetting like this

private void Button_Click_1(object sender, RoutedEventArgs e)
        Button bt = (Button)sender;
        IsolatedStorageSettings settings = IsolatedStorageSettings.ApplicationSettings;
        List<long> ListFavourites; 
        if (settings.Contains("ListFavourites"))
            ListFavourites = settings["ListFavourites"] as List<long>;
            ListFavourites = new List<long>();

        settings["ListFavourites"] = ListFavourites;


now when loading the above book list(longlistselector) when the page loads i want to show or hide the add to favorites button based on whether the bookid is present in the isolatedstoragesetting or not. what i have tried here is that i have tried to bind the converter to the add to favourite button and also bind the convertparameter with bookid. but the convertparameter doesn't support binding.

so what is the technique i can use to show or hide the add to favourite button based on the book id presence in the favourite list in the isolatedstoragesetting?

how can i hide the button based when clicking it based on the bookid?

Other Answer1

You are almost there in thinking to use a converter. The actual idea, when materialized, should look something like this.

First, you will need to implement a converter, in this case, you will need to convert the bookid to a Visibility value.

public class BookIdToVisibilityConverter : IValueConverter
        public object Convert(object value, Type targetType, object parameter, string language)
            //value is booking id here, which means that you just need to check against the isolatedStorageSettings
            return Visibility.Collapsed;

        public object ConvertBack(object value, Type targetType, object parameter, string language)
            return null;

In your DataTemplate, the binding should take place like this:

<Button Content="Add To Favourites" Tag="{Binding BookId,Mode=OneWay}" 
        Click="Button_Click_1" Visibility={Binding BookId,Converter={StaticResource TheConverterCreatedAbove}} >

That should do the trick.

Other Answer2

The MVVM way would be to expand your ViewModel. It would be much better to add an AddToFavoritesCommand to BookViewModel instead of putting the logic in code behind. If the button is bound to that Command it would automatically go disabled when the Command would properly (with CanExecuteChanged) switch CanExecute to false.

In your case, you can add a property IsFavourite or CanAddToFavoirtes and then use a standard BoolToVisibility converter (the Command execution would set this property and the BookViewModel would be initialized with the correct value read from IsolatedStorage).

All logic behind the presentation of Book and functionalities related to Book belong to BookViewModel.