Lier la visibilité d'un Button à une valeur booléenne dans ViewModel

Comment lier la visibilité d'un bouton à une valeur booléenne dans mon ViewModel?

<Button Height="50" Width="50" Style="{StaticResource MyButtonStyle}"
    Command="{Binding SmallDisp}" CommandParameter="{Binding}" Cursor="Hand"
    Visibility="{Binding Path=AdvancedFormat}" />

En supposant qu'il AdvancedFormats'agit d'un bool, vous devez déclarer et utiliser un BooleanToVisibilityConverter:

<!-- In your resources section of the XAML -->
<BooleanToVisibilityConverter x:Key="BoolToVis" />

<!-- In your Button declaration -->
<Button
 Height="50" Width="50"
 Style="{StaticResource MyButtonStyle}"
 Command="{Binding SmallDisp}" CommandParameter="{Binding}" 
Cursor="Hand" Visibility="{Binding Path=AdvancedFormat, Converter={StaticResource BoolToVis}}"/>

Notez l'ajout Converter={StaticResource BoolToVis}.

Il s'agit d'un modèle très courant lorsque vous travaillez avec MVVM. En théorie , vous pourriez faire la conversion vous - même sur la propriété ViewModel (soit juste faire le bien immobilier de type Visibility) mais je préférerais ne pas le faire, puisque maintenant vous êtes déconner avec la séparation des préoccupations. La visibilité d'un élément doit vraiment être à la hauteur de la vue.

Il existe une troisième méthode qui ne nécessite pas de convertisseur ou de modification de votre modèle de vue: utilisez un style:

<Style TargetType="Button">
   <Setter Property="Visibility" Value="Collapsed"/>
   <Style.Triggers>
      <DataTrigger Binding="{Binding IsVisible}" Value="True">
         <Setter Property="Visibility" Value="Visible"/>
      </DataTrigger>
   </Style.Triggers>
</Style>

J'ai tendance à préférer cette technique car je l'utilise dans de nombreux cas où ce à quoi je me lie n'est pas booléen - par exemple, afficher un élément uniquement s'il DataContextn'est pas nul, ou implémenter des affichages multi-états où différentes mises en page apparaissent en fonction du définition d'une énumération dans le modèle de vue.

Conversion bidirectionnelle en c # de booléen à visibilité

using System;
using System.Windows;
using System.Windows.Data;

namespace FaceTheWall.converters
{
    class BooleanToVisibilityConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value is Boolean && (bool)value)
            {
                return Visibility.Visible;
            }
            return Visibility.Collapsed;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value is Visibility && (Visibility)value == Visibility.Visible)
            {
                return true;
            }
            return false;
        }
    }
}

En règle générale, il existe deux façons de le faire, une classe de convertisseur ou une propriété dans le Viewmodel qui convertit essentiellement la valeur pour vous.

J'ai tendance à utiliser l'approche de propriété s'il s'agit d'une conversion unique. Si vous souhaitez le réutiliser, utilisez le convertisseur. Ci-dessous, trouvez un exemple du convertisseur:

<ValueConversion(GetType(Boolean), GetType(Visibility))> _
Public Class BoolToVisibilityConverter
    Implements IValueConverter

    Public Function Convert(ByVal value As Object, ByVal targetType As System.Type, ByVal parameter As Object, ByVal culture As System.Globalization.CultureInfo) As Object Implements System.Windows.Data.IValueConverter.Convert

        If value IsNot Nothing Then
            If value = True Then 
                Return Visibility.Visible
            Else
                Return Visibility.Collapsed
            End If
        Else
            Return Visibility.Collapsed
        End If
    End Function

    Public Function ConvertBack(ByVal value As Object, ByVal targetType As System.Type, ByVal parameter As Object, ByVal culture As System.Globalization.CultureInfo) As Object Implements System.Windows.Data.IValueConverter.ConvertBack
        Throw New NotImplementedException
    End Function
End Class

Une méthode de propriété ViewModel vérifierait simplement la valeur de la propriété booléenne et retournerait une visibilité basée sur cela. Veillez à implémenter INotifyPropertyChanged et à l'appeler sur les propriétés Boolean et Visibility pour être mis à jour correctement.

Ceci peut être réalisé d'une manière très simple 1. Ecrivez ceci dans la vue.

<Button HorizontalAlignment="Center" VerticalAlignment="Center" Width="50" Height="30">
<Button.Style>
        <Style TargetType="Button">
                <Setter Property="Visibility" Value="Collapsed"/>
                        <Style.Triggers>
                                <DataTrigger Binding="{Binding IsHide}" Value="True">
                                        <Setter Property="Visibility" Value="Visible"/>
                                    </DataTrigger>
                            </Style.Triggers>
            </Style>
    </Button.Style>

2. Voici la propriété booléenne qui contient la valeur vrai / faux. Voici l'extrait de code. Dans mon exemple, cette propriété est dans la classe UserNote.

   public bool _isHide = false;
   
   public bool IsHide
   {
   
   get { return _isHide; }
   
   set
       {
           _isHide = value;
               OnPropertyChanged("IsHide");
       }
   } 

3. C'est ainsi que la propriété IsHide obtient la valeur.

   userNote.IsHide = userNote.IsNoteDeleted;

En vue:

<Button
 Height="50" Width="50"
 Style="{StaticResource MyButtonStyle}"
 Command="{Binding SmallDisp}" CommandParameter="{Binding}" 
Cursor="Hand" Visibility="{Binding Path=AdvancedFormat}"/>

En vue Modèle:

public _advancedFormat = Visibility.visible (whatever you start with)

public Visibility AdvancedFormat
{
 get{return _advancedFormat;}
 set{
   _advancedFormat = value;
   //raise property changed here
}

Vous devrez avoir un événement de changement de propriété

 protected virtual void OnPropertyChanged(PropertyChangedEventArgs e) 
    { 
        PropertyChanged.Raise(this, e); 
    } 

    protected void OnPropertyChanged(string propertyName) 
    { 
        OnPropertyChanged(new PropertyChangedEventArgs(propertyName)); 
    } 

Voici comment ils utilisent Model-view-viewmodel

Mais puisque vous voulez qu'il soit lié à un booléen, vous aurez besoin d'un convertisseur. Une autre méthode consiste à définir un booléen à l'extérieur et, lorsque vous cliquez sur ce bouton, définissez property_advancedFormat sur la visibilité souhaitée.

Depuis Windows 10 15063 et plus

Depuis Windows 10 build 15063, il existe une nouvelle fonctionnalité appelée «Conversion de visibilité implicite» qui lie la visibilité à la valeur booléenne de manière native - Il n'est plus nécessaire d'utiliser un convertisseur.

(voir https://social.technet.microsoft.com/wiki/contents/articles/34846.uwp-compiled-binding-windows-10-anniversary-update.aspx#Implicit_Visibility_conversion ).

Mon code (qui suppose que MVVM est utilisé, et le modèle 10 également):

<!-- In XAML -->
<StackPanel x:Name="Msg_StackPanel" Visibility="{x:Bind ViewModel.ShowInlineHelp}" Orientation="Horizontal" Margin="0,24,0,0">
    <TextBlock Text="Frosty the snowman was a jolly happy soul" Margin="0,0,8,0"/>
    <SymbolIcon Symbol="OutlineStar "/>
    <TextBlock Text="With a corncob pipe and a button nose" Margin="8,0,0,0"/>
</StackPanel>

<!-- in companion View-Model -->
public bool ShowInlineHelp // using T10 SettingsService
{ 
    get { return (_settings.ShowInlineHelp); }
    set { _settings.ShowInlineHelp = !value; base.RaisePropertyChanged(); }
}