Fortes

Yesterday, I mentioned that you can use rounded corners on Border to do some silly things. The (admittedly poor) rendition of a rose above was created using only nested Border elements, along with a two-row Grid with a Viewbox wrapped around the entire thing. Clearly, this is not the way to make a drawing in Avalon (you should use Shapes), but I thought I’d share any way.

<Viewbox xmlns="http://schemas.microsoft.com/winfx/avalon/2005" xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005" Margin="10">
  <!-- Background -->
  <Border Background="VerticalGradient LightBlue White" Grid.RowSpan="2" Padding="10">
    <Grid HorizontalAlignment="Center" VerticalAlignment="Center" Background="RadialGradient #ff6 transparent">
      <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
      </Grid.RowDefinitions>

      <!-- Stem -->
      <Border BorderBrush="VerticalGradient #630 #191" BorderThickness="0,0,10,0" CornerRadius="50,300,50,50" Margin="30,50,80,10" Grid.RowSpan="2"/>

      <!-- Petals -->
      <Border Grid.Row="1" BorderBrush="HorizontalGradient #060 #353" BorderThickness="10,30" CornerRadius="10,50,10,50" Margin="20,20,80,0" />
      <Border Grid.Row="1" BorderBrush="VerticalGradient #262 #292" BorderThickness="10,30" CornerRadius="50,10,50,10" Margin="80,20,20,0"/>
      <Border Grid.Row="1" BorderBrush="HorizontalGradient #040 #492" BorderThickness="30, 10, 30, 10" CornerRadius="80, 10, 80, 10" Margin="80, 0, 40,0" />
      <Border Grid.Row="1" BorderBrush="VerticalGradient #040 #492" BorderThickness="30, 30, 30, 30" CornerRadius="10, 80, 10, 80" Margin="40, 0, 80, 0" />

      <!-- Rose -->
      <Border BorderBrush="RadialGradient #900 #a22" Background="HorizontalGradient #d22 #c00" BorderThickness="0, 0, 10, 10" CornerRadius="150, 250, 350, 300" HorizontalAlignment="Center" Margin="0,0,50,20">
        <Border BorderBrush="RadialGradient #900 #a22" Background="HorizontalGradient #d22 #c00" BorderThickness="15, 0, 0, 15" CornerRadius="300, 200, 200, 50" Opacity="1">
          <Border BorderBrush="RadialGradient #a00 #c33" Background="RadialGradient #a00 #d22" BorderThickness="0,20,20,0" CornerRadius="100, 40, 60, 200">
            <Border BorderBrush="RadialGradient #c33 #a00" Background="RadialGradient #a00 #c33" BorderThickness="0,0,10,20" CornerRadius="10,60,60,60">
              <Border BorderBrush="HorizontalGradient #f00 #a00" Background="#a00" BorderThickness="20, 10, 0, 0" CornerRadius="40, 20, 20, 20">
                <Border BorderBrush="VerticalGradient #f66 #a00" Background="#a00" BorderThickness="0,0,10,10" CornerRadius="20,20,10,30">
                  <Border BorderBrush="HorizontalGradient #a33 #d22" Background="#d03" BorderThickness="10,10,0,0" CornerRadius="30,30,20,20">
                    <Border BorderBrush="RadialGradient #a00 #d33" BorderThickness="10" CornerRadius="30, 20, 30, 20"/>
                  </Border>
                </Border>
              </Border>
            </Border>
          </Border>
        </Border>
      </Border>
    </Grid>
  </Border>
</Viewbox>