XAML 椭圆相对大小答案

【问题标题】：XAML Ellipse relative sizeXAML 椭圆相对大小
【发布时间】：2015-02-15 14:11:17
【问题描述】：

我想使椭圆的大小相对于其保持网格的列和行大小。

因此，椭圆的大小应该相对于给定硬件的页面（设备）的大小而改变..

类似于从 css 中继承的东西。

这可能吗？

 <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="1*" />
        <RowDefinition Height="10*" />
        <RowDefinition Height="10*" />
        <RowDefinition Height="1*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="3*" />
        <ColumnDefinition Width="4*" />
        <ColumnDefinition Width="4*" />
        <ColumnDefinition Width="3*" />
    </Grid.ColumnDefinitions>

    <Ellipse Fill="DarkGray" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" Width="200" Height="200" />
    <Ellipse Fill="DarkGray" Height="200" Width="200" Grid.Row="2" Grid.Column="1" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" />
    <Ellipse Fill="DarkGray" Height="200" Width="200" Grid.Row="2" Grid.Column="2" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" />
    <TextBlock Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="2" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Center"  HorizontalAlignment="Center"/>
    <TextBlock Grid.Column="1" Grid.Row="2" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Center"  HorizontalAlignment="Center"/>
    <TextBlock Grid.Column="2" Grid.Row="2" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Center"  HorizontalAlignment="Center"/>

</Grid>

【问题讨论】：

标签： c# xaml

【解决方案1】：

为此目的使用ViewBox。例如，将第 3 个椭圆替换为以下代码。它会随着包含的 Grid 增大/缩小。

<Viewbox Grid.Row="2" Grid.Column="2">
    <Ellipse Fill="DarkGray" Height="200" Width="200" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" />
</Viewbox>

【讨论】：