2016-06-24 7 views
0

Я разрабатываю приложение WP8.1 с помощью xaml и C#. Я хочу иметь кнопку или эллипс, заполненный несколькими цветами, как показано на рисунке ниже. Как я могу достичь этого, кроме использования управления круговой диаграммой? Мне просто нужно это в максимальной высоте 80 и ширине 80 Может кто-то, пожалуйста, помогите мне? Заранее спасибо enter image description hereКак заполнить эллипс разными цветами в Windows Phone 8.1 XAML?

ответ

0

Вы можете преобразовать один эллипс в путь и затем удалить одну точку на пути, чтобы сделать ее полукруг. Поверните три полукруга под правильным углом, чтобы достичь чего-то похожего на изображение выше.

+0

Эй Чираг .. Я пробовал различные способы, но это не сработало. Можете ли вы поделиться примером кода? –

+0

вы должны использовать blend, щелкните правой кнопкой мыши по конвертированию эллипса в путь и щелкните по одной из четырех точек и нажмите delete. Вы получите полукруг. –

1

Для создания этой формы используется дугообразный элемент управления.

xmlns:es="clr-namespace:Microsoft.Expression.Shapes;assembly=Microsoft.Expression.Drawing" 
  <Grid> 
       <es:Arc ArcThickness="1" ArcThicknessUnit="Percent" EndAngle="360" Fill="#FF82ECDD" HorizontalAlignment="Left" Height="293" Margin="0,0,0,-100" Stretch="None" StartAngle="61" UseLayoutRounding="False" VerticalAlignment="Top" Width="294"/> 
       <es:Arc ArcThickness="1" ArcThicknessUnit="Percent" EndAngle="360" Fill="#FF38B5E4" HorizontalAlignment="Left" Height="293" Margin="0,0,0,-100" Stretch="None" StartAngle="298" UseLayoutRounding="False" VerticalAlignment="Top" Width="294" RenderTransformOrigin="0.5,0.5"> 
            <es:Arc.RenderTransform> 
             <CompositeTransform Rotation="61.609"/> 
       </es:Arc.RenderTransform> 
       </es:Arc> 
       <es:Arc ArcThickness="1" ArcThicknessUnit="Percent" EndAngle="360" Fill="#FF349AD4" HorizontalAlignment="Left" Height="293" Margin="0,0,0,-100" Stretch="None" StartAngle="179" UseLayoutRounding="False" VerticalAlignment="Top" Width="294" RenderTransformOrigin="0.5,0.5"> 
       <es:Arc.RenderTransform> 
             <CompositeTransform Rotation="-119.36"/> 
       </es:Arc.RenderTransform> 
       </es:Arc> 
      </Grid> 

enter image description here

+0

Спасибо за помощь .. Спасибо –

+0

Не забывайте отмечать это как ответ, если он решил вашу проблему, :) – asitis

 Смежные вопросы

  • Нет связанных вопросов^_^