Question

I want to change the visibility of a stack panel using the view model approach in my WP app , i am having problem , here is my code (sample).

Xaml Page:

<phone:PhoneApplicationPage 
x:Class="NextUKWindowsPhone.test"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:localHelpers="clr-namespace:NextUKWindowsPhone.Helpers"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
shell:SystemTray.IsVisible="True">
<phone:PhoneApplicationPage.Resources>
    <localHelpers:BooleanToVisibilityConverter x:Key="MyBooleanToVisibilityConverter" />
</phone:PhoneApplicationPage.Resources>
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <!--TitlePanel contains the name of the application and page title-->

    <StackPanel>


    </StackPanel>
    <!--ContentPanel - place additional content here-->
    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <StackPanel>
            <StackPanel  Name="prgrs"  Visibility="{Binding isVisible, Converter={StaticResource MyBooleanToVisibilityConverter}}" >
            <TextBlock Height="30" Name="textBlock1" Text="Hello...! show/hide me" />
        </StackPanel>
        <StackPanel>
            <Button Content="Hide" Height="72" Name="button2" Width="160" />
            <Button Content="Show" Height="72" Name="button1" Width="160" />
            </StackPanel>
        </StackPanel>
    </Grid>
</Grid>

Code Behind:

  public partial class test : PhoneApplicationPage
{
    public test()
    {
        InitializeComponent();
        DataContext = App.TviewModel;
    }
}

Converter Class:

 public  class BooleanToVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var flag = false;
        if (value is bool)
        {
            flag = (bool)value;
        }
        else if (value is bool?)
        {
            var nullable = (bool?)value;
            flag = nullable.GetValueOrDefault();
        }
        if (parameter != null)
        {
            if (bool.Parse((string)parameter))
            {
                flag = !flag;
            }
        }
        if (flag)
        {
            return Visibility.Visible;
        }
        else
        {
            return Visibility.Collapsed;
        }
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var back = ((value is Visibility) && (((Visibility)value) == Visibility.Visible));
        if (parameter != null)
        {
            if ((bool)parameter)
            {
                back = !back;
            }
        }
        return back;
    }
} 

View Model:

public class testviewModel : INotifyPropertyChanged
{
    public bool isVisible  {get;set;}
    public testviewModel()
    {
        this.isVisible = true;
    }
    public event PropertyChangedEventHandler PropertyChanged;
    private void NotifyPropertyChanged(String propertyName)
    {
        if (null != PropertyChanged)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
    public void show()
    {
        this.isVisible = true;
    }
    public void hide()
    {
        this.isVisible = false;
    }
}

in App.cs

 private static testviewModel tviewModel = null;
    public static testviewModel TviewModel
    {
        get
        {
            if (tviewModel == null)
                tviewModel = new testviewModel();

            return tviewModel;
        }
    }

Answer 1

The problem is that the property that you have bound to does not raise property change in your ViewModel.

Try to change it like this in you View Model:

public bool isVisible  
{
    get { return _isVisible; }
    set 
    {
        _isVisible = value;
        NotifyPropertyChanged("isVisible");
    }
}