Liaison de la visibilité d'un bouton à 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 que AdvancedFormat soit 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 le ajouté Converter={StaticResource BoolToVis}.
Ceci est un modèle très courant lorsque vous travaillez avec MVVM. En théorie, vous pouvez effectuer la conversion vous-même sur la propriété ViewModel (par exemple, créez simplement la propriété elle-même de type Visibility) bien que je préfère ne pas le faire, car vous êtes jouer avec la séparation des préoccupations. La visibilité d'un élément devrait vraiment être à la hauteur de la vue.
Il existe un troisième moyen qui ne nécessite ni convertisseur ni 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ù je suis lié à not boolean - par exemple. afficher un élément uniquement si sa DataContext n'est pas null, ou implémenter des affichages multi-états dans lesquels différentes présentations apparaissent en fonction de la définition d'un enum 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 manières 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 la propriété s'il s'agit d'une conversion unique. Si vous voulez 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 renverrait une visibilité basée sur celle-ci. Assurez-vous d'implémenter INotifyPropertyChanged et appelez-le sur les propriétés booléenne et de visibilité pour être mis à jour correctement.
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 aurez besoin d'un événement de propriété modifié
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 le lier à un booléen, vous aurez besoin d'un convertisseur. Une autre méthode consiste à définir un booléen à l'extérieur. Lorsque vous cliquez sur ce bouton, définissez le paramètre property_advancedFormat sur la visibilité souhaitée.
Ceci peut être réalisé d'une manière très simple 1. Écrivez 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>
La propriété booléenne suivante contient la valeur true/false. Ce qui suit est 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"); } }C'est ainsi que la propriété IsHide obtient la valeur.
userNote.IsHide = userNote.IsNoteDeleted;