Как применить свойство «Равномерное» растяжения к составному пути с градиентами в WPF / XAML?

Question

Народ

Я пытаюсь нарисовать логотип моей компании в векторе с помощью XAML, чтобы поместить его в контейнеры пользовательского интерфейса, когда это будет удобно.

Единственное условие - логотип выиграля должен быть обрезан или деформирован, поэтому мне нужно свойство растяжения "Uniform".

Пример кода "полуобработки" приведен ниже:

<Grid Width="160" Height="153" >
    <Rectangle Clip="M 80,0 c 41.793,0 75.879,34.086 75.879,75.878 0,0.75 -0.015,1.496 -0.036,2.24 l -33.846,-57.969 -42.204,80.387 -39.421,-68.175 -35.758,34.917 c 4.294,-37.769 36.501,-67.278 75.386,-67.278 z" Margin="0">
        <Rectangle.Fill>
            <RadialGradientBrush GradientOrigin="44,14" Center="44,44" RadiusX="125" RadiusY="125" MappingMode="Absolute">
                <GradientStop Color="#FF1C545C" Offset="0.63"/>
                <GradientStop Color="#FF3BB3C3" Offset="0.23"/>
            </RadialGradientBrush>              
         </Rectangle.Fill>
    </Rectangle>
    <Rectangle Clip="M 151,102 c -10.528,29.287 -38.601,50.33 -71.436,50.33 -36.935,0 -67.845,-26.625 -74.533,-61.662 l 32.586,-31.299 42.204,75.131 44.986,-84.096 26.193,51.596 z">
        <Rectangle.Fill>
            <RadialGradientBrush RadiusY="100" RadiusX="100" GradientOrigin="49,87" Center="49,87" MappingMode="Absolute">
                <GradientStop Color="{DynamicResource MarinhoMiotec}" Offset="0.27"/>
                <GradientStop Color="#FF003052" Offset="0.63"/>
            </RadialGradientBrush>
        </Rectangle.Fill>
    </Rectangle>
</Grid>

Проблема в том, когдаЯ поместил эту сетку в другую сетку размером с иконку, рисунок не сжимается, чтобы равномерно вписаться в нее.

Я думаю, это так, потому что сетка, в которой нарисованы прямоугольники, имеет фиксированную высоту и ширину.Я уже пытался создать один прерывистый путь, но тогда я не мог поместить разные цвета в каждую половину логотипа.

Должен ли я выбрать другой контейнер, или я должен сделать координаты относительными, или использовать преобразованиеили создай стиль, или сделай кисть ... Я запутался в стольких возможных направлениях деятельности ...

Буду признателен за любую помощь.

Спасибо за чтение

Answer 1

Попробуйте обернуть свой логотип в ViewBox : http://msdn.microsoft.com/en-us/library/system.windows.controls.viewbox.aspx

Вот пример:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="50" />
        <ColumnDefinition Width="150" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="50" />
        <RowDefinition Height="150" />
    </Grid.RowDefinitions>
    <Viewbox>
        <Grid Width="160" Height="153" >
            <Rectangle Clip="M 80,0 c 41.793,0 75.879,34.086 75.879,75.878 0,0.75 -0.015,1.496 -0.036,2.24 l -33.846,-57.969 -42.204,80.387 -39.421,-68.175 -35.758,34.917 c 4.294,-37.769 36.501,-67.278 75.386,-67.278 z" Margin="0">
                <Rectangle.Fill>
                    <RadialGradientBrush GradientOrigin="44,14" Center="44,44" RadiusX="125" RadiusY="125" MappingMode="Absolute">
                        <GradientStop Color="#FF1C545C" Offset="0.63"/>
                        <GradientStop Color="#FF3BB3C3" Offset="0.23"/>
                    </RadialGradientBrush>
                </Rectangle.Fill>
            </Rectangle>
            <Rectangle Clip="M 151,102 c -10.528,29.287 -38.601,50.33 -71.436,50.33 -36.935,0 -67.845,-26.625 -74.533,-61.662 l 32.586,-31.299 42.204,75.131 44.986,-84.096 26.193,51.596 z">
                <Rectangle.Fill>
                    <RadialGradientBrush RadiusY="100" RadiusX="100" GradientOrigin="49,87" Center="49,87" MappingMode="Absolute">
                        <GradientStop Color="{DynamicResource MarinhoMiotec}" Offset="0.27"/>
                        <GradientStop Color="#FF003052" Offset="0.63"/>
                    </RadialGradientBrush>
                </Rectangle.Fill>
            </Rectangle>
        </Grid>
    </Viewbox>
</Grid>

Это будет отображать логотип в ячейке сетки 50x50.