Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
243 views
in Technique[技术] by (71.8m points)

c# - How to show a full screen Modal ContentDialog in Windows Phone 8.1

When a user is trying to login to my app, I am displaying a ContentDialog containing a few TextBlocks and a ProgressBar.

I choose ContentDialog because it is modal and blocks the user until the application collects required information and is ready to navigate to next page.

The following link shows the Content Dialog Class that is available for Windows Phone 8.1(Universal Apps).

The following code displays the code-behind that I have written to display the ContentDialog (I have temporarily put this in OnNavigatedTo for testing, will later move it to appropriate notification function)

//Progress Bar
ProgressBar bar = new ProgressBar();
bar.IsIndeterminate = true;

//Downloading Data text
TextBlock txt = new TextBlock();
txt.Text = "Downloading data...";
txt.FontSize = 17;
txt.Foreground = new SolidColorBrush(Colors.White);
txt.HorizontalAlignment = Windows.UI.Xaml.HorizontalAlignment.Center;

//This could take a few seconds
TextBlock txt2 = new TextBlock();
txt2.Text = "This could take a few seconds.";
txt2.FontSize = 17;
txt2.Foreground = new SolidColorBrush(Colors.White);
txt2.HorizontalAlignment = Windows.UI.Xaml.HorizontalAlignment.Center;

//Please do not close the application.
TextBlock txt3 = new TextBlock();
txt3.Text = "Please do not close the application.";
txt3.FontSize = 17;
txt3.Foreground = new SolidColorBrush(Colors.White);
txt3.HorizontalAlignment = Windows.UI.Xaml.HorizontalAlignment.Center;

StackPanel stk = new StackPanel();
stk.Children.Add(bar);
stk.Children.Add(txt);
stk.Children.Add(txt2);
stk.Children.Add(txt3);


ContentDialog dlg = new ContentDialog();
dlg.Content = stk;
SolidColorBrush color = new SolidColorBrush(Colors.Black);
color.Opacity = 0.7;
dlg.Background = color;
dlg.Margin = new Thickness(0, 250, 0, 0);
dlg.ShowAsync();

This is displayed as enter image description here Above you can see it is only covering part of the background

I want it to be displayed as enter image description here

by making the full screen modal.

I have tried changing the height and other properties but was unable to get it to work.

I would be glad if someone can point me in the right direction.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

I found a solution which eliminates the code behind. Not sure if this is more of a work around. But it allows me to easily use Binding to decide when to display this modal dialog and when to hide it.

This is my XAML

<Grid>
<Grid Visibility="{Binding IsDownloadingData}" Canvas.ZIndex="1" Background="{StaticResource PartiallyTransparentBlackColor}" HorizontalAlignment="Stretch">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <ProgressBar Grid.Row="1" IsIndeterminate="True"/>
    <TextBlock Grid.Row="2" Text="Downloading Data..." FontSize="17" Foreground="White" HorizontalAlignment="Center"/>
    <TextBlock Grid.Row="3" Text="This could take a few seconds." FontSize="17" Foreground="White" HorizontalAlignment="Center"/>
    <TextBlock Grid.Row="4" Text="Please do not close the application." FontSize="17" Foreground="White" HorizontalAlignment="Center"/>
</Grid>
<ScrollViewer Canvas.ZIndex="0" VerticalAlignment="Stretch" Margin="0,10,0,10">
    <!-- The XAML that should be hidden goes here (In my case LOGIN PAGE XAML) -->
</ScrollViewer>

I play around with the visibility of the Grid that has Canvas.ZIndex="1" using Binding and decide when to display the modal window.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

1.4m articles

1.4m replys

5 comments

57.0k users

...