Ausblenden Flyout auf die Schaltfläche klicken (DelegateCommand)

Ich bin erstellen einer Windows Store-app, und ich habe ein flyout-Menü, das wie folgt aussieht:
Ausblenden Flyout auf die Schaltfläche klicken (DelegateCommand)

Den Flyout richtig funktioniert, und ich bin in der Lage, eine neue Adresse hinzufügen, wenn ich auf den "Hinzufügen" -Button. Das problem ist, ich möchte in der Lage sein zu verstecken Flyout als gut. Meine DelegateCommand ist in der ViewModel, so habe ich nicht einen Verweis auf die eigentliche View Elemente.

Ich habe versucht, die änderung der DelegateCommand zu nehmen, einen parameter, etwa so:

public DelegateCommand<object> AddAddressCommand
{
    get { return new DelegateCommand<object>(AddAddress, CanAddAddress); }
}

public void AddAddress(object parameter)
{
    if (_isEditing)
    {
        NewAddress.PayeeId = CurrentPayee.Id;
        _addressRepository.InsertAsync(NewAddress);
    }
    CurrentPayee.Addresses.Add(NewAddress);
    NewAddress = new Address();

    //TODO: hide Flyout
}

Und in meinem XAML, ich versuche zum bestehen einer CommandParameter zu den DelegateCommand etwa so:

<Button Content="Add" 
        Command="{Binding AddAddressCommand}"
        CommandParameter="{Binding RelativeSource={RelativeSource Self}}"
        HorizontalAlignment="Center" />

Wenn ich pass {RelativeSource Self} erhalte ich einen Verweis auf die Button wie erwartet, aber ich habe nicht in der Lage zu verweisen, etwas anderes auf den Baum. Die "Hinzufügen" - Button ist ein Kind der Flyout, die verbunden ist, um die "Adresse Hinzufügen" AppBarButton.

Ideal, ich könnte passieren in einem Verweis auf die Flyout direkt, oder die AppBarButton, so dass ich anrufen kann Flyout.Hide() wenn ich auf die Schaltfläche "Hinzufügen"`.

Ich habe versucht Einstellung der x:Name des AppBarButton und die Flyout und referenzieren Sie diese in der CommandParameter etwa so:

CommandParameter="{Binding ElementName=AddAddressFlyout}"

und in beiden Fällen, mein parameter ist null. Ist es möglich, dies zu erreichen, mit gerade Datenbindung, oder werde ich hinzufügen, eine Art von Behaviors?

InformationsquelleAutor dub stylee | 2015-02-26

c#mvvm windows-8.1 winrt-xaml xaml

0

Finden Sie vielleicht dieser Artikel interessant, es zeigt, wie mithilfe einer Abhängigkeitseigenschaft zu kontrollieren, wenn das Fliegen aus geöffnet oder geschlossen ist. Sie können dann binden die Abhängigkeit Eigenschaft einer Eigenschaft auf Ihrem view-Modell: https://marcominerva.wordpress.com/2013/07/30/using-windows-8-1-flyout-xaml-control-with-mvvm/

Ich habe eigentlich nur versucht, es in meinem eigenen app und es funktioniert einwandfrei.
- Danke für die info, die ich hatte, markiert dieser Artikel selbst ausprobieren später. Ich hatte gehofft, in der Lage sein, um es arbeiten, die direkt die Bindung an die Flyout oder AppBarButton wenn möglich, als ich versuchte in der ursprünglichen Frage, aber es scheint, dass ich werde wahrscheinlich auch an die dependency property route. Froh zu hören, dass es bei Ihnen funktioniert hat, wie es scheint, es sollte den trick tun!
- In der Tat, es hat am Ende funktioniert wie ein Charme. Nun, um zu bestimmen, ob es funktioniert mit mehreren flyouts in der gleichen View. Ich es vorstellen sollte, denn mehr als ein nicht sichtbar, zu einer Zeit,...
InformationsquelleAutor Roger Hartley

Vielleicht fehlt mir eine Feinheit in deine Anforderungen, aber ich war in der Lage, in der Nähe ein flyout-Menü ganz einfach mit x:Name und .Hide()

use x:Name="MyFlyout" in Ihrem <Flyout> tag und schließen Sie es dann in Ihrem C# - klicken Sie auf Ereignis-by-doing-MyFlyout.Hide()

XAML-CODE:

<Page.BottomAppBar>
    <CommandBar>
        <AppBarButton Icon="Add">
            <AppBarButton.Flyout>
                <Flyout x:Name="MyFlyout">
                    <StackPanel>
                        <Button HorizontalAlignment="Right" Click="CancelButton_Click" Margin="0,-10,-10,0">
                                <SymbolIcon Symbol="Cancel"/>
                        </Button>
                            <TextBlock>Hello World</TextBlock>
                            <TextBox></TextBox>
                    </StackPanel>
                </Flyout>
            </AppBarButton.Flyout>
        </AppBarButton>
    </CommandBar>
</Page.BottomAppBar>

C# - CODE

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
    }


    private void CancelButton_Click(object sender, RoutedEventArgs e)
    {
        MyFlyout.Hide();
    }
}

Ich bin nicht mehr mit der Flyout Methode für diese, aber ich habe versucht zu vermeiden, mit code-behind in der Zeit, in kleben mit dem MVVM-Muster.
Arbeitete für mich, vielen Dank
+1 mehr Sinn Macht, fügen Sie eine quick-Ereignis, und blenden Sie es, anstelle der Zugabe ein paar Klassen und dann eine Menge von boiler plate code für somethings so klein.

InformationsquelleAutor user6457623

Schlage ich vor, mit AttachableProperties. Ich schicke zwei, die ich geschrieben habe, dass sind einfach zu verwenden und dieses Ziel zu erreichen. Der erste misst die Flyout-und verweist auf eine Schaltfläche. Wenn auf die Schaltfläche geklickt wird, schließt es die Flyout.

Die Sekunde misst, um die Schaltfläche und auf die Flyout (nützlich, wenn Sie die Tasten in der Flyout-sind Teil einer Daten-Vorlage). Der gleiche Effekt tritt nur in diesem Fall können Sie mehrere buttons, schließen Sie das flyout-Menü, wenn Sie gedrückt werden.

Zuerst habe ich die benutzerdefinierte Erweiterung Methode in meinem Projekt, welches ich in dem Beispiel:

public static class XAMLExtensions
{
    public static T GetParent<T>(this DependencyObject dependencyObject) where T : DependencyObject
    {
        var parentDependencyObject = VisualTreeHelper.GetParent(dependencyObject);

        switch (parentDependencyObject)
        {
            case null:
                return null;
            case T parent:
                return parent;
            default:
                return GetParent<T>(parentDependencyObject);
        }        
    }
}

Dann die haftenden Eigenschaften...
Haftenden Eigenschaften

public class FlyoutAttach : DependencyObject
{
    private const string CloseButtonPropertyName = "CloseButton";
    private const string CanCloseFlyoutPropertyName = "CanCloseFlyout";
    private const string ClosedCommandPropertyName = "ClosedCommand";
    private const string ClosedCommandParameterPropertyName = "ClosedCommandParameter";

    public static Button GetCloseButton(Flyout flyout) => (Button)flyout.GetValue(CloseButtonProperty);
    public static void SetCloseButton(Flyout flyout, Button value) => flyout.SetValue(CloseButtonProperty, value);
    public static readonly DependencyProperty CloseButtonProperty =
        DependencyProperty.RegisterAttached(CloseButtonPropertyName,
                                            typeof(Button),
                                            typeof(FlyoutAttach),
                                            new PropertyMetadata(null,
                                            new PropertyChangedCallback((s, e) =>
                                            {
                                                if (s is Flyout flyout && e.NewValue is Button button)
                                                {
                                                    button.Click -= buttonClick;
                                                    button.Click += buttonClick;
                                                }
                                                void buttonClick(object sender, RoutedEventArgs routedEventArgs) => flyout.Hide();
                                            })));


    public static bool GetCanCloseFlyout(Button button) => (bool)button.GetValue(CanCloseFlyoutProperty);
    public static void SetCanCloseFlyout(Button button, bool value) => button.SetValue(CanCloseFlyoutProperty, value);
    public static readonly DependencyProperty CanCloseFlyoutProperty =
        DependencyProperty.RegisterAttached(CanCloseFlyoutPropertyName,
                                            typeof(bool),
                                            typeof(FlyoutAttach),
                                            new PropertyMetadata(false,
                                            new PropertyChangedCallback((s, e) =>
                                            {
                                                if (s is Button button && e.NewValue is bool canCloseFlyout)
                                                {
                                                    button.Click -= buttonClick;
                                                    if (canCloseFlyout) button.Click += buttonClick;
                                                }

                                                void buttonClick(object sender, RoutedEventArgs routedEventArgs)
                                                {
                                                    var flyoutPresenter = button.GetParent<FlyoutPresenter>();
                                                    if (flyoutPresenter?.Parent is Popup popup)
                                                        popup.IsOpen = false;
                                                }
                                            })));


    public static ICommand GetClosedCommand(Flyout flyout) => (ICommand)flyout.GetValue(ClosedCommandProperty);
    public static void SetClosedCommand(Flyout flyout, ICommand value) => flyout.SetValue(ClosedCommandProperty, value);
    public static readonly DependencyProperty ClosedCommandProperty =
        DependencyProperty.RegisterAttached(ClosedCommandPropertyName, 
                                            typeof(ICommand), 
                                            typeof(FlyoutAttach), 
                                            new PropertyMetadata(null,
                                            new PropertyChangedCallback((s, e) =>
                                            {
                                                if (s is Flyout flyout && e.NewValue is ICommand command)
                                                {
                                                    flyout.Closed -= flyoutClosed;
                                                    flyout.Closed += flyoutClosed;

                                                    void flyoutClosed(object sender, object ee)
                                                    {
                                                        var commandParameter = flyout.GetValue(ClosedCommandParameterProperty);
                                                        if (command.CanExecute(commandParameter))
                                                            command.Execute(commandParameter);
                                                    }
                                                }
                                            })));


    public static object GetClosedCommandParameter(Flyout flyout) => flyout.GetValue(ClosedCommandParameterProperty);
    public static void SetClosedCommandParameter(Flyout flyout, object value) => flyout.SetValue(ClosedCommandParameterProperty, value);
    public static readonly DependencyProperty ClosedCommandParameterProperty =
        DependencyProperty.RegisterAttached(ClosedCommandParameterPropertyName, typeof(object), typeof(FlyoutAttach), new PropertyMetadata(null));
}

In der Ansicht

<Flyout Attachable:FlyoutAttach.CloseButton="{Binding ElementName=button}">
     <Button x:Name="button" />
</Flyout>

ODER

<Flyout>
     <Button Attachable:FlyoutAttach.CanCloseFlyout="True" />
</Flyout>

InformationsquelleAutor Michael Puckett II

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.