ContentDialog Windows 10 移动 XAML - 全屏 - 填充 [英] ContentDialog Windows 10 Mobile XAML - FullScreen - Padding

问题描述

我在我的项目中放置了一个 ContentDialog 用于 Windows 10 上的登录弹出窗口.当我在移动设备上运行这个项目时，ContentDialog 没有全屏显示并且在这个元素周围有一个最小的填充.在键盘上是可见的(例如在焦点元素文本框上)在键盘和内容对话框之间存在边距

I put an ContentDialog in my project to use for Login Popup on Windows 10. When I run this project on mobile, ContentDialog not shown in full screen and have a minimal padding around this element.On keyboard is visible (on focus element textbox for example) exist margin between keyboard and content dialog

对于如何在全屏上显示此问题有任何解决方案吗?我将属性FullSizeDesired"设置为true，问题是否相同?

Have any solution to how this on FullScreen? I set the property "FullSizeDesired" true, mas the problem is the same?

有人帮助删除这个:- 填充，- 全屏

Someone help to remove this: - Padding, - Full Screen

我的代码是:

<ContentDialog
    x:Class="ExampleApp.SignInContentDialog"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ExampleApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="SIGN IN">

    <Grid x:Name="GridMobile" VerticalAlignment="Center" HorizontalAlignment="Center">

            <Button x:Name="MakeOff" 
            Height="32" BorderThickness="1" 
            HorizontalAlignment="Center"
            Foreground="Red" Background="Black"
            Style="{StaticResource ButtonStyle}"
            Margin="0">

            <HyperlinkButton x:Name="btnRegister"
            Height="32" BorderThickness="1" 
            HorizontalAlignment="Center"
            Foreground="Red" Background="Black"
            Margin="0"
            NavigateUri="www.google.pt"
            Style="{StaticResource HyperLinkButtonStyleMobile}"
            Content="Register">
                <HyperlinkButton.ContentTemplate>
                    <DataTemplate>
                    <TextBlock Text="{Binding}" />
                    </DataTemplate>
                </HyperlinkButton.ContentTemplate>
            </HyperlinkButton>
    </Grid>

我认为页面按钮中的边距/空间是为PrimaryButton"和SecondaryButton"保留的但我需要更多按钮，而且这个边距/空间不适合我.我想删除它.

The margin/space have in button of page is reserved for the "PrimaryButton" and "SecondaryButton" I think but I need more buttons and this margin/space is not appropriated for me. I want to remove this.

谢谢.

推荐答案

你看到两者之间的差距不是因为任何特定的 Padding 值，而是因为在 ContentDialog 的默认样式，高度和宽度设置为 Auto，这意味着您的内容只会被赋予所需的大小.

The reason that you see the gaps in between is not because of any specific Padding values but because in ContentDialog's default style, the height and width are set to Auto which means your content will only be given the size it needs to.

因此，让内容拉伸以适合其父级，您只需要通过应用您自己的 local:SignInContentDialog 的默认样式来覆盖默认样式并将其放入您的 App.xaml.

So make the content stretch to fit its parent, you just need to override the default style by applying your own default style of the local:SignInContentDialog and put it inside your App.xaml.

<Style TargetType="local:SignInContentDialog">
    <Setter Property="Foreground" Value="{ThemeResource SystemControlPageTextBaseHighBrush}" />
    <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}" />
    <Setter Property="HorizontalAlignment" Value="Center" />
    <Setter Property="VerticalAlignment" Value="Top" />
    <Setter Property="IsTabStop" Value="False" />
    <Setter Property="MaxHeight" Value="{ThemeResource ContentDialogMaxHeight}" />
    <Setter Property="MinHeight" Value="{ThemeResource ContentDialogMinHeight}" />
    <Setter Property="MaxWidth" Value="{ThemeResource ContentDialogMaxWidth}" />
    <Setter Property="MinWidth" Value="{ThemeResource ContentDialogMinWidth}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:SignInContentDialog">
                <Border x:Name="Container">
                    <Grid x:Name="LayoutRoot">                                                     
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>

                        <!-- COMMENT OUT THESE FOLLOWING LINES -->

                        <!--<Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>-->
                        <Border x:Name="BackgroundElement" Background="{TemplateBinding Background}" FlowDirection="{TemplateBinding FlowDirection}" MaxWidth="{TemplateBinding MaxWidth}" MaxHeight="{TemplateBinding MaxHeight}" MinWidth="{TemplateBinding MinWidth}" MinHeight="{TemplateBinding MinHeight}">
                            <Grid x:Name="DialogSpace" VerticalAlignment="Stretch">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition Height="*" />
                                    <RowDefinition Height="Auto" />
                                </Grid.RowDefinitions>
                                <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Disabled" ZoomMode="Disabled" Margin="{ThemeResource ContentDialogContentScrollViewerMargin}" IsTabStop="False">
                                    <Grid>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="Auto" />
                                        </Grid.RowDefinitions>
                                        <ContentControl x:Name="Title" Margin="{ThemeResource ContentDialogTitleMargin}" Content="{TemplateBinding Title}" ContentTemplate="{TemplateBinding TitleTemplate}" FontSize="20" FontFamily="Segoe UI" FontWeight="Normal" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Left" VerticalAlignment="Top" IsTabStop="False" MaxHeight="{ThemeResource ContentDialogTitleMaxHeight}">
                                            <ContentControl.Template>
                                                <ControlTemplate TargetType="ContentControl">
                                                    <ContentPresenter Content="{TemplateBinding Content}" MaxLines="2" TextWrapping="Wrap" ContentTemplate="{TemplateBinding ContentTemplate}" Margin="{TemplateBinding Padding}" ContentTransitions="{TemplateBinding ContentTransitions}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                                                </ControlTemplate>
                                            </ContentControl.Template>
                                        </ContentControl>
                                        <ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" FontSize="{ThemeResource ControlContentThemeFontSize}" FontFamily="{ThemeResource ContentControlThemeFontFamily}" Margin="{ThemeResource ContentDialogContentMargin}" Foreground="{TemplateBinding Foreground}" Grid.Row="1" TextWrapping="Wrap" />
                                    </Grid>
                                </ScrollViewer>
                                <Grid x:Name="CommandSpace" Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Bottom">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition />
                                        <ColumnDefinition />
                                    </Grid.ColumnDefinitions>
                                    <Border x:Name="Button1Host" Margin="{ThemeResource ContentDialogButton1HostMargin}" MinWidth="{ThemeResource ContentDialogButtonMinWidth}" MaxWidth="{ThemeResource ContentDialogButtonMaxWidth}" Height="{ThemeResource ContentDialogButtonHeight}" HorizontalAlignment="Stretch" />
                                    <Border x:Name="Button2Host" Margin="{ThemeResource ContentDialogButton2HostMargin}" MinWidth="{ThemeResource ContentDialogButtonMinWidth}" MaxWidth="{ThemeResource ContentDialogButtonMaxWidth}" Height="{ThemeResource ContentDialogButtonHeight}" Grid.Column="1" HorizontalAlignment="Stretch" />
                                </Grid>
                            </Grid>
                        </Border>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这篇关于ContentDialog Windows 10 移动 XAML - 全屏 - 填充的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！