CODEWITHSUNDEEP
xamlmvvmwindows-phone-8.1windows-store-appsmvvm-light
Diego Louli
Diego Louli

Reputation: 13

TwoWay Data Binding with MVVM Light on Windows Phone 8.1

I'm trying to create a custom Button with ListPickerFlyout using MVVM. The result that i wanna reach is something like that:

custom Button with ListPickerFlyout

My problem is how to bind the SelectedItem from ListPickerFlyout to the content TextBlock.

I'm using MVVM Light Windows Phone 8.1 (Store Appp).

My Xaml code:

<Button Background="White"
    HorizontalAlignment="Stretch" 
    HorizontalContentAlignment="Stretch">
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="40" />
    </Grid.ColumnDefinitions>

    <!-- Content TextBlock -->
    <TextBlock Text="{Binding MyVM.SelectedItem, Mode=TwoWay}"
                Style="{StaticResource DefaultTextBlock}"
                FontSize="22"
                HorizontalAlignment="Left"
                VerticalAlignment="Center"
                Margin="10, 0, 0, 0"/>

    <Image Height="20"  Grid.Column="1"
            VerticalAlignment="Center" HorizontalAlignment="Center"
            Source="../Assets/icons/arrow_down.png"/>
</Grid>

<Button.Flyout>
    <ListPickerFlyout PickerFlyoutBase.Title="$Items$"
                        ItemsSource="{Binding MyVM.listItems}"
                        SelectedItem="{Binding MyVM.SelectedItem, Mode=TwoWay}" >
        <ListPickerFlyout.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Text="{Binding}"
                                Style="{StaticResource DefaultTextBlock}"
                                FontSize="22"/>
                </StackPanel>
            </DataTemplate>
        </ListPickerFlyout.ItemTemplate>
    </ListPickerFlyout>
</Button.Flyout>

And in MyVM i have

public string SelectedItem { get; set; }

Edit:

Solved the problem, i forgot to add RaisePropertyChanged("SelectedItem");.

So, in my MVVM class:

private string _selectedItem;
public string SelectedItem
{
    get { return _selectedItem; }
    set
    {
        if (_selectedItem != value)
        {
            _selectedItem = value;
            RaisePropertyChanged("SelectedItem");
        }
    }
}

Upvotes: 1

Views: 123

Answers (1)

Diego Louli
Diego Louli

Reputation: 13

Just need to add the RaisePropertyChanged("SelectedItem"); in MVVM class.

The complete code:

private string _selectedItem;
public string SelectedItem
{
    get { return _selectedItem; }
    set
    {
        if (_selectedItem != value)
        {
            _selectedItem = value;
            RaisePropertyChanged("SelectedItem");
        }
    }
}

Upvotes: 0

Related Questions