Question

我有一个带有＆＃34; width =＆＃39; auto＆＃39;＆＃34;的椭圆，我想要一个圆圈，所以它不可能设置＆＃34; height =＆＃ 39;自动＆＃39;＆＃34;因为如果用户调整窗口大小，则圆圈将是椭圆形。我已尝试过＆＃34; Height =＆＃39; {Binding ElementName = TheLeft，Path = Width}＆＃39;＆＃34;。

<Page
    x:Class="App2.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App2"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="White">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="3*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="3*" />
        </Grid.ColumnDefinitions>
        <!--<Ellipse x:Name="TheLeft" Fill="Pink" Grid.Column="0" Height="{Binding ElementName=TheLeft, Path=Width}" Width="auto" VerticalAlignment="Bottom"/>-->
        <!-- I've set Height="200" in the uncommented element -->
        <Ellipse x:Name="TheLeft" Fill="Pink" Grid.Column="0" Height="200" Width="auto" VerticalAlignment="Bottom"/>

        <Rectangle Fill="Red" Grid.Column="1" RadiusX="50" RadiusY="40"/>
        <Ellipse Fill="Pink" Grid.Column="2" Height="200" Width="auto" VerticalAlignment="Bottom"/>
    </Grid>
</Page>

Answer 1

首先，我肯定建议您取出内联样式，特别是因为您希望两个省略号的许多属性具有相同的值。

<Style x:Key="circularEllipse" TargetType="{x:Type Ellipse"}>
   <Setter Property="Fill" Value="Pink"/>
   <Setter Property="VerticalAlignment" Value="Bottom"/>
   <Setter Property="Height" Value="200"/>
   <Setter Property="Width" Value="{Binding Path=Height, RelativeSource={RelativeSource Self}}"/>
</Style>

然后在编码椭圆时 - 您只需要调用此样式，它就可以用于这两种样式，从而节省编码时间并减少布局上的代码量。

<Ellipse x:Name="TheLeft" Grid.Column="0" Style="{StaticResouce circularEllipse}"/>

因此，如果您需要更改圆的大小，则只需在一个位置更改属性。此外，如果您需要变体，可以使用BasedOn选项，而不必重做整个代码。如：

<Style x:Key="circularEllipse2" TargetType="{x:Type Ellipse}" BasedOn="{StaticResource circularEllipse}">
   <Setter Property="Height" Value="100"/>
</Style>

这将获取上一个样式中的所有其他属性，但更改高度（或您可能需要更改的任何其他属性）

将动态元素的值分配给另一个元素

1 个答案: