make a content Dialog movable like the one in the

问题:

I have created a ContentDialog to apply a Style (that I can't apply with a Message Dialog and a PopUp),but I am having problem with it,it's not movable or I can't close it like the Frame that appears when I click on the button "Connexion"in the Groove App

have you please any idea,which part I can modify in the ContentDialog style to get this ContentDialog movable and close it like the image on top

I work on a universal app

回答1:

have you please any idea,which part I can modify in the ContentDialog style to get this ContentDialog movable and close it like the image on top.

I'm afraid ContentDialog is not movable, and the image you showed in the Groove App or in the System's mail app is not a ContentDialog, actually, this “Dialog” is called by UserDataAccountManager.ShowAddAccountAsync. If we used the ProcessMonitor to track this UI, we will find that this is a system app C:\Windows\SystemApps\Microsoft.AccountsControl_cw5n1h2txyewy. You may see the pictures and information in the similar question on SO: UWP Modal Window.

For you problem, we can’t launch the system app like Microsoft.AccountsControl for result, we can only call it using API UserDataAccountManager.ShowAddAccountAsync. But you can create a UWP app, and launch this app for result from another app, to do this, please refer to Launch an app for results.

Or if you just want a movable UI, you can create a new window in your app, and change the size of this new window, make it popping behavior like a ContentDialog, but this new window will show your app's title which can't be removed.

How to create a new window? For example:

    private async void OnClick(object sender, RoutedEventArgs e)
    {
        var newCoreAppView = CoreApplication.CreateNewView();
        var appView = ApplicationView.GetForCurrentView();
        await newCoreAppView.Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Low, async () =>
        {
            var window = Window.Current;
            var newAppView = ApplicationView.GetForCurrentView();

            var frame = new Frame();
            window.Content = frame;

            frame.Navigate(typeof(BlankPage));            
            window.Activate();
            await ApplicationViewSwitcher.TryShowAsStandaloneAsync(newAppView.Id, ViewSizePreference.Default, appView.Id, ViewSizePreference.Default);

        });
    }

And how to change the size of the new Window? For example in the cs file of the page showed in the new window:

public BlankPage()
        {
            this.InitializeComponent();
            this.Loaded += Page_Loaded;
        }

        private void Page_Loaded(object sender, RoutedEventArgs e)
        {
            var s = ApplicationView.GetForCurrentView();
            s.TryResizeView(new Size { Width = 600, Height = 320 });
        }

This will make a 600 width and 320 height window.

回答2:

I think you can do it the other way:

1. Create a UserControl, define the UI like the pop up.
2. Set ManipulationMode to Translate.
3. Handle ManipulationDelta event to move
4. the UserControll (lets put a CompositeTransform as RenderTransform).
5. Implement animation as you want Use the UserControll in your Page