CODEWITHSUNDEEP
c#xamlmvvmwin-universal-app
RenegadeWildlife32
RenegadeWildlife32

Reputation: 1

Windows 10 App using MVVM - Use button to set IsLocked property of another control on different View/Page

I am new to XAML and Universal app development on Windows 10. I am learning MVVM and would like to do the following:

I have a View called Shell that houses a SplitView control. I would like to use a ToggleButton on the SplitView pane that when clicked, sets the IsLocked property of a Pivot control in another view called MainPage.

My question is what are some techniques to do this?

Upvotes: 0

Views: 187

Answers (3)

Vincent
Vincent

Reputation: 3746

Using the new compiled binding, you can simply bound the IsLocked property from your pivot to the IsChecked property from the ToggleButton.

<SplitView DisplayMode="Inline" IsPaneOpen="True">
    <SplitView.Pane>
        <StackPanel>
            <ToggleButton Content="Lock/Unlock" x:Name="toggle" />
        </StackPanel>
    </SplitView.Pane>

    <Pivot x:Name="pivot" IsLocked="{x:Bind toggle.IsChecked, Mode=OneWay, Converter={StaticResource NullableBoolToBoolConverter}}">
    <PivotItem Header="item 1">

        </PivotItem>
        <PivotItem Header="item 2">

        </PivotItem>
    </Pivot>
</SplitView>

The only caveat is that the IsChecked property is a bool? and the IsLocked is a bool so you will have to use a converter:

public class NullableBoolToBoolConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        var nullableValue = (value as bool?);
        return nullableValue.HasValue && nullableValue.Value;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

That will have to be declared in your app resources:

<Application
  x:Class="xbindcontrol.App"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="using:xbindcontrol"
  RequestedTheme="Light">

  <Application.Resources>
        <ResourceDictionary>
            <local:NullableBoolToBoolConverter x:Key="NullableBoolToBoolConverter" />
       </ResourceDictionary>
    </Application.Resources>
</Application>

Upvotes: 0

atomaras
atomaras

Reputation: 2568

Use a TwoWay Databinding on the ToggleButton's IsChecked property and bind it to a property named IsPivotLocked on your ShellViewModel.

ToggleButton IsChecked="{Binding IsPivotLocked, Mode=TwoWay}"

Then pass a reference to ShellViewModel in your MainPageViewModel and expose it as a property named Shell. Then go inside your MainPage view and use an OneWay databinding on the Pivot's IsLocked property like so:

Pivot IsLocked="{Binding Shell.IsPivotLocked}"

Note that the IsPivotLocked property needs to invoke the PropertyChanged event for this to work.

Upvotes: 0

Silv&#233;rio Miranda
Silv&#233;rio Miranda

Reputation: 61

To communicate between ViewModels you should use a Messenger like MVVM Light Messenger

Like this : 

class ViewModel1
{
    private void sendMessage()
    {
        Messenger.Default.Send<InputStringMessage>(msg);
    }
}

.

class ViewModel2
{
    public ViewModel2()
    {
         Messenger.Default.Register<InputStringMessage>(this, (action) => ReceiveInputMessage(action));
    }
    protected void ReceiveInputMessage(InputStringMessagemessage)
    {
        ...
    }

Upvotes: 1

Related Questions