1

Win 8 Store XAML アプリでダイアログのような効果を実現する方法はありますか? ダイアログのコンテンツがユーザー入力を収集するためのカスタム コントロールであるこの投稿で示されているものと同様です。

上記の投稿で示したものと同様に、中央に表示したい XAML コンテンツのサンプルを次に示します。

<common:LayoutAwarePage
x:Class="App1.UserControls.Control1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"   
mc:Ignorable="d"
>

<Grid HorizontalAlignment="Stretch" Background="Gold" VerticalAlignment="Center">
    <StackPanel  VerticalAlignment="Center" HorizontalAlignment="Center" AreScrollSnapPointsRegular="True" Margin="20">
        <TextBlock Text="This is sample text" FontSize="20" Style="{StaticResource HeaderTextStyle}"/>            
        <Button Content="Close" Click="btnClose_Click" Margin="0,20,0,0" HorizontalAlignment="Right"/>
    </StackPanel>
</Grid></common:LayoutAwarePage>

ポップアップ コントロールを使用して、次のようにメイン ページからこれを表示しています。

<common:LayoutAwarepage>
<Grid Style="{StaticResource LayoutRootStyle}">
   <Popup x:Name="ParentedPopup" VerticalOffset="300" HorizontalOffset="200" 
    HorizontalAlignment="Stretch">
            <usercontrols:CreateCategory/>
   </Popup>
 </Grid>
<Page.BottomAppBar>
    <AppBar x:Name="bottomAppBar" Padding="10,0,10,0">
        <Grid>
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
                <Button Style="{StaticResource AddAppBarButtonStyle}" Click="AddButton_Click"/>

            </StackPanel>
        </Grid>
    </AppBar>
</Page.BottomAppBar></common:LayoutAwarePage>

private void AddButton_Click(object sender, RoutedEventArgs e)
{
    if (!ParentedPopup.IsOpen) { ParentedPopup.IsOpen = true; }
}

ただし、これは意図したとおりに表示されず、ポップアップには xaml コンテンツが中央に表示されず、上部に表示され、中央に配置されず、希望どおりに引き伸ばされません。

これを達成する簡単な方法はありますか？注: どのライブラリにも依存したくありません。

4

2 に答える 2

0

画面の高さに垂直オフセットを割り当てます

popup.VerticalOffset = (Window.Current.Bounds.Height / 2) - popup.ActualHeight / 2;
Width = Window.Current.Bounds.Width;

VerticalAlignment="Center";

また

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" x:Name="ContentColumn"/>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>

//Place content in "ContentColumn" to center it
<Grid>

コンテンツContentColumnを中央に配置します。

于 2012-11-18T03:12:46.843 に答える