使用模型视图方法更改堆栈面板可见性答案

【问题标题】：Change stack panel visibility using Model view Approach使用模型视图方法更改堆栈面板可见性
【发布时间】：2011-06-20 14:47:30
【问题描述】：

我想在我的 WP 应用程序中使用视图模型方法更改堆栈面板的可见性，我遇到了问题，这是我的代码（示例）。

Xaml 页面：

<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>

代码背后：

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

转换器类：

 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;
    }
}

查看模型：

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;
    }
}

在 App.cs 中

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

            return tviewModel;
        }
    }

【问题讨论】：

标签： silverlight windows-phone-7

【解决方案1】：

问题是您绑定的属性不会在您的 ViewModel 中引发属性更改。

尝试在您的视图模型中像这样更改它：

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

【讨论】：

【解决方案2】：

这很简单，只需创建一个属性并将其与可见性属性绑定，就像哈迪的财产

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

【讨论】：