如何拉伸Callisto CustomDialog的内容？

Question

我很难弄清楚CustomDialog如何确定其内容的宽度。 Appended是从Callisto的测试应用程序复制的代码，其中包含两个Horizo​​ntalAlignment =＆＃34; Stretch＆＃34;添加。什么都没有。我想扩展内容（例如StackPanel）。我还尝试为StackPanel的Width属性赋值。似乎CustomDialog有一些算法来选择最大宽度。无论你做什么，它的内容都不会超过这个宽度。任何人都可以对此有所了解吗？

<!-- Example use of the CustomDialog control -->
<callisto:CustomDialog x:FieldModifier="public" x:Name="LoginDialog" 
                    Title="Bacon Terms and Conditions" 
                    Background="Teal" BackButtonVisibility="Visible" BackButtonClicked="LoginDialog_BackButtonClicked_1"
                    HorizontalAlignment="Stretch">
    <StackPanel HorizontalAlignment="Stretch">
        <TextBlock Margin="0,0,0,8" FontSize="14.6667" FontWeight="SemiLight" TextWrapping="Wrap">
        Bacon sausage frankfurter tenderloin turkey salami andouille bresaola. Venison salami prosciutto, pork belly turducken tri-tip spare ribs chicken strip steak fatback shankle tongue boudin andouille. Meatloaf salami pork ground round turkey jerky meatball ball tip, filet mignon fatback flank prosciutto shank. Turkey boudin ham hock, filet mignon tri-tip bresaola tongue venison spare ribs meatloaf flank beef pancetta. Leberkas turducken flank ground round biltong chuck bacon kielbasa. Beef pastrami meatball, short loin venison swine pork loin shank meatloaf spare ribs.
        </TextBlock>
        <CheckBox Margin="0,0,0,8" Foreground="White" Content="I agree to the Terms and Conditions of Bacon" />
        <TextBlock Margin="0,0,0,8" FontSize="14.6667" FontWeight="SemiLight" Text="Enter your name for acceptance" />
        <callisto:WatermarkTextBox HorizontalAlignment="Left" Watermark="Type your name" Width="400" Height="35" />
        <StackPanel Margin="0,20,0,0" HorizontalAlignment="Right" Orientation="Horizontal">
            <Button Content="OK" Width="90" Margin="0,0,20,0" />
            <Button Content="CANCEL" Width="190" Click="DialogCancelClicked" />
        </StackPanel>
    </StackPanel>
</callisto:CustomDialog>

Answer 1

目前，默认样式似乎不支持此功能。 Here is the current default style (based on the GitHub).

    <Style TargetType="local:CustomDialog">
    <Setter Property="IsOpen" Value="False" />
    <Setter Property="BorderThickness" Value="{ThemeResource CustomDialogBorderThemeThickness}"/>
    <Setter Property="BorderBrush" Value="{ThemeResource CustomDialogBorderThemeBrush}" />
    <Setter Property="BackButtonVisibility" Value="Collapsed" />
    <Setter Property="Background" Value="{ThemeResource CustomDialogBackgroundThemeBrush}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:CustomDialog">
                <Popup x:Name="PART_RootPopup" IsLightDismissEnabled="False" IsOpen="{TemplateBinding IsOpen}">
                    <Grid x:Name="PART_RootGrid" Background="#72000000">
                        <Border x:Name="PART_BannerBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" VerticalAlignment="Center">
                            <Grid x:Name="PART_DialogGrid" Background="{TemplateBinding Background}" VerticalAlignment="Center">
                                <Grid.Resources>
                                    <Style x:Key="DialogBackButtonStyle" TargetType="Button">
                                        <Setter Property="MinWidth" Value="0"/>
                                        <Setter Property="FontFamily" Value="Segoe UI Symbol"/>
                                        <Setter Property="FontWeight" Value="Normal"/>
                                        <Setter Property="FontSize" Value="26.66667"/>
                                        <Setter Property="AutomationProperties.AutomationId" Value="BackButton"/>
                                        <Setter Property="AutomationProperties.Name" Value="Back"/>
                                        <Setter Property="AutomationProperties.ItemType" Value="Navigation Button"/>
                                        <Setter Property="Template">
                                            <Setter.Value>
                                                <ControlTemplate TargetType="Button">
                                                    <Grid x:Name="RootGrid" Width="30" Height="30">
                                                        <Grid Margin="-3,-5,0,0">
                                                            <TextBlock x:Name="BackgroundGlyph" Text="&#xE0D4;" Foreground="{Binding ElementName=PART_DialogGrid, Path=Background}"/>
                                                            <TextBlock x:Name="NormalGlyph" Text="{ThemeResource SettingsFlyoutBackButtonGlyph}" Foreground="{Binding ElementName=PART_DialogGrid, Path=Background, Converter={StaticResource ColorContrast}}"/>
                                                            <TextBlock x:Name="ArrowGlyph" Text="&#xE0C4;" Foreground="{Binding ElementName=PART_DialogGrid, Path=Background}" Opacity="0"/>
                                                        </Grid>
                                                        <Rectangle
                        x:Name="FocusVisualWhite"
                        IsHitTestVisible="False"
                        Stroke="{ThemeResource FocusVisualWhiteStrokeThemeBrush}"
                        StrokeEndLineCap="Square"
                        StrokeDashArray="1,1"
                        Opacity="0"
                        StrokeDashOffset="1.5"/>
                                                        <Rectangle
                        x:Name="FocusVisualBlack"
                        IsHitTestVisible="False"
                        Stroke="{ThemeResource FocusVisualBlackStrokeThemeBrush}"
                        StrokeEndLineCap="Square"
                        StrokeDashArray="1,1"
                        Opacity="0"
                        StrokeDashOffset="0.5"/>

                                                        <VisualStateManager.VisualStateGroups>
                                                            <VisualStateGroup x:Name="CommonStates">
                                                                <VisualState x:Name="Normal" />
                                                                <VisualState x:Name="PointerOver">
                                                                    <Storyboard>
                                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground">
                                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource BackButtonPointerOverBackgroundThemeBrush}"/>
                                                                        </ObjectAnimationUsingKeyFrames>
                                                                    </Storyboard>
                                                                </VisualState>
                                                                <VisualState x:Name="Pressed">
                                                                    <Storyboard>
                                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground">
                                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding ElementName=PART_DialogGrid, Path=Background, Converter={StaticResource ColorContrast}}"/>
                                                                        </ObjectAnimationUsingKeyFrames>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="ArrowGlyph"
                                        Storyboard.TargetProperty="Opacity"
                                        To="1"
                                        Duration="0"/>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="NormalGlyph"
                                        Storyboard.TargetProperty="Opacity"
                                        To="0"
                                        Duration="0"/>
                                                                    </Storyboard>
                                                                </VisualState>
                                                                <VisualState x:Name="Disabled">
                                                                    <Storyboard>
                                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="Visibility">
                                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                                                                        </ObjectAnimationUsingKeyFrames>
                                                                    </Storyboard>
                                                                </VisualState>
                                                            </VisualStateGroup>
                                                            <VisualStateGroup x:Name="FocusStates">
                                                                <VisualState x:Name="Focused">
                                                                    <Storyboard>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="FocusVisualWhite"
                                        Storyboard.TargetProperty="Opacity"
                                        To="1"
                                        Duration="0"/>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="FocusVisualBlack"
                                        Storyboard.TargetProperty="Opacity"
                                        To="1"
                                        Duration="0"/>
                                                                    </Storyboard>
                                                                </VisualState>
                                                                <VisualState x:Name="Unfocused" />
                                                                <VisualState x:Name="PointerFocused" />
                                                            </VisualStateGroup>
                                                        </VisualStateManager.VisualStateGroups>
                                                    </Grid>
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </Style>
                                </Grid.Resources>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <Border Grid.Column="1" VerticalAlignment="Center">
                                    <StackPanel Margin="13,19,13,25" HorizontalAlignment="Center" Width="{TemplateBinding Width}" MaxWidth="680">
                                        <local:DynamicTextBlock Foreground="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Background, Converter={StaticResource ColorContrast}}" x:Name="PART_Title" Text="{TemplateBinding Title}" FontFamily="Segoe UI" FontSize="26.6667" FontWeight="Light" Margin="0,0,0,8" />
                                        <ContentPresenter Margin="0" x:Name="PART_Content" Foreground="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Background, Converter={StaticResource ColorContrast}}" />
                                    </StackPanel>
                                </Border>
                                <Button x:Name="PART_BackButton" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,24,0,0"
                                    Style="{StaticResource DialogBackButtonStyle}" Command="{TemplateBinding BackButtonCommand}" CommandParameter="{TemplateBinding BackButtonCommandParameter}" Visibility="{TemplateBinding BackButtonVisibility}"/>
                            </Grid>
                        </Border>
                    </Grid>
                </Popup>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

以下是我对解决方案的想法。我已将它作为CustomDialog的显式声明属性包含在内。您可以直接将它添加到项目中，以便在所有实例中覆盖它，或者静态声明它并在所有CustomDialog中引用它。

我还更改了名称空间引用以模仿你的名字。 （local - ＆gt; callisto）

<callisto:CustomDialog ...>

....

    <callisto:CustomDialog.Style>
            <Style TargetType="callisto:CustomDialog">
                <Setter Property="IsOpen" Value="False" />
                <Setter Property="BorderThickness" Value="{ThemeResource CustomDialogBorderThemeThickness}"/>
                <Setter Property="BorderBrush" Value="{ThemeResource CustomDialogBorderThemeBrush}" />
                <Setter Property="BackButtonVisibility" Value="Collapsed" />
                <Setter Property="Background" Value="{ThemeResource CustomDialogBackgroundThemeBrush}" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="callisto:CustomDialog">
                            <Popup x:Name="PART_RootPopup" IsLightDismissEnabled="False" IsOpen="{TemplateBinding IsOpen}">
                                <Grid x:Name="PART_RootGrid" Background="#72000000">
                                    <Border x:Name="PART_BannerBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" VerticalAlignment="Center">
                                        <Grid x:Name="PART_DialogGrid" Background="{TemplateBinding Background}" VerticalAlignment="Center">
                                            <Grid.Resources>
                                                <Style x:Key="DialogBackButtonStyle" TargetType="Button">
                                                    <Setter Property="MinWidth" Value="0"/>
                                                    <Setter Property="FontFamily" Value="Segoe UI Symbol"/>
                                                    <Setter Property="FontWeight" Value="Normal"/>
                                                    <Setter Property="FontSize" Value="26.66667"/>
                                                    <Setter Property="AutomationProperties.AutomationId" Value="BackButton"/>
                                                    <Setter Property="AutomationProperties.Name" Value="Back"/>
                                                    <Setter Property="AutomationProperties.ItemType" Value="Navigation Button"/>
                                                    <Setter Property="Template">
                                                        <Setter.Value>
                                                            <ControlTemplate TargetType="Button">
                                                                <Grid x:Name="RootGrid" Width="30" Height="30">
                                                                    <Grid Margin="-3,-5,0,0">
                                                                        <TextBlock x:Name="BackgroundGlyph" Text="&#xE0D4;" Foreground="{Binding ElementName=PART_DialogGrid, Path=Background}"/>
                                                                        <TextBlock x:Name="NormalGlyph" Text="{ThemeResource SettingsFlyoutBackButtonGlyph}" Foreground="{Binding ElementName=PART_DialogGrid, Path=Background, Converter={StaticResource ColorContrast}}"/>
                                                                        <TextBlock x:Name="ArrowGlyph" Text="&#xE0C4;" Foreground="{Binding ElementName=PART_DialogGrid, Path=Background}" Opacity="0"/>
                                                                    </Grid>
                                                                    <Rectangle
                                    x:Name="FocusVisualWhite"
                                    IsHitTestVisible="False"
                                    Stroke="{ThemeResource FocusVisualWhiteStrokeThemeBrush}"
                                    StrokeEndLineCap="Square"
                                    StrokeDashArray="1,1"
                                    Opacity="0"
                                    StrokeDashOffset="1.5"/>
                                                                    <Rectangle
                                    x:Name="FocusVisualBlack"
                                    IsHitTestVisible="False"
                                    Stroke="{ThemeResource FocusVisualBlackStrokeThemeBrush}"
                                    StrokeEndLineCap="Square"
                                    StrokeDashArray="1,1"
                                    Opacity="0"
                                    StrokeDashOffset="0.5"/>

                                                                    <VisualStateManager.VisualStateGroups>
                                                            <VisualStateGroup x:Name="CommonStates">
                                                                <VisualState x:Name="Normal" />
                                                                <VisualState x:Name="PointerOver">
                                                                    <Storyboard>
                                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground">
                                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource BackButtonPointerOverBackgroundThemeBrush}"/>
                                                                        </ObjectAnimationUsingKeyFrames>
                                                                    </Storyboard>
                                                                </VisualState>
                                                                <VisualState x:Name="Pressed">
                                                                    <Storyboard>
                                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground">
                                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding ElementName=PART_DialogGrid, Path=Background, Converter={StaticResource ColorContrast}}"/>
                                                                        </ObjectAnimationUsingKeyFrames>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="ArrowGlyph"
                                        Storyboard.TargetProperty="Opacity"
                                        To="1"
                                        Duration="0"/>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="NormalGlyph"
                                        Storyboard.TargetProperty="Opacity"
                                        To="0"
                                        Duration="0"/>
                                                                    </Storyboard>
                                                                </VisualState>
                                                                <VisualState x:Name="Disabled">
                                                                    <Storyboard>
                                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="Visibility">
                                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                                                                        </ObjectAnimationUsingKeyFrames>
                                                                    </Storyboard>
                                                                </VisualState>
                                                            </VisualStateGroup>
                                                            <VisualStateGroup x:Name="FocusStates">
                                                                <VisualState x:Name="Focused">
                                                                    <Storyboard>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="FocusVisualWhite"
                                        Storyboard.TargetProperty="Opacity"
                                        To="1"
                                        Duration="0"/>
                                                                        <DoubleAnimation
                                        Storyboard.TargetName="FocusVisualBlack"
                                        Storyboard.TargetProperty="Opacity"
                                        To="1"
                                        Duration="0"/>
                                                                    </Storyboard>
                                                                </VisualState>
                                                                <VisualState x:Name="Unfocused" />
                                                                <VisualState x:Name="PointerFocused" />
                                                            </VisualStateGroup>
                                                        </VisualStateManager.VisualStateGroups>
                                                    </Grid>
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </Style>
                                </Grid.Resources>
                                <Border VerticalAlignment="Center">
                                    <StackPanel Margin="13,19,13,25" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Width="{TemplateBinding Width}" MaxWidth="680">
                                        <callisto:DynamicTextBlock Foreground="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Background, Converter={StaticResource ColorContrast}}" x:Name="PART_Title" Text="{TemplateBinding Title}" FontFamily="Segoe UI" FontSize="26.6667" FontWeight="Light" Margin="0,0,0,8" />
                                        <ContentPresenter Margin="0" x:Name="PART_Content" Foreground="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Background, Converter={StaticResource ColorContrast}}" HorizontalAllignment="{TemplateBinding HorizontalContentAlignment}"/>
                                    </StackPanel>
                                </Border>
                                <Button x:Name="PART_BackButton" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,24,0,0"
                                    Style="{StaticResource DialogBackButtonStyle}" Command="{TemplateBinding BackButtonCommand}" CommandParameter="{TemplateBinding BackButtonCommandParameter}" Visibility="{TemplateBinding BackButtonVisibility}"/>
                            </Grid>
                        </Border>
                    </Grid>
                </Popup>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

....

</callisto:CustomDialog>

希望这有助于编码！

编辑：错误的风格！修好了，抱歉。

编辑：最后一件事要尝试，从内容定义中删除列定义。这可能会对标题定位产生影响，因此您可能需要在底部使用它。