2009-05-05 2 views
6

WPF로 게임을 시작했고 양식에 color wheel을 그려야했습니다.WPF 응용 프로그램에서 색상환을 그리는 방법은 무엇입니까?

은 우선은이 같은 ArcSegment에 LinearGradientBrush를 사용하는 tryed :

<Path StrokeThickness="35" Height="150" Width="150"> 
    <Path.Stroke> 
     <LinearGradientBrush StartPoint="0,0" EndPoint="1,0"> 
      <GradientStop Color="Red" Offset="0.15" /> 
      <GradientStop Color="Orange" Offset="0.2" /> 
      <GradientStop Color="Yellow" Offset="0.35" /> 
      <GradientStop Color="Green" Offset="0.5" /> 
      <GradientStop Color="Blue" Offset="0.65" /> 
      <GradientStop Color="Indigo" Offset="0.75" /> 
      <GradientStop Color="Violet" Offset="0.9" /> 
     </LinearGradientBrush> 
    </Path.Stroke> 
    <Path.Data> 
     <PathGeometry > 
      <PathFigure IsClosed="True" StartPoint="25,70"> 
       <ArcSegment Point="25,71" IsLargeArc="True" 
        Size="50,50" SweepDirection="Clockwise" /> 
      </PathFigure> 
     </PathGeometry> 
    </Path.Data> 
</Path> 

실패, 그라데이션 여전히 가로 때문에.

다른 아이디어는 그래디언트를 적용한 후에 어떻게 든 구부려 야합니다. 그러나 나는 적절한 변형을 발견 할 수 없다.

표준 변환이없는 경우 사용자 정의 변환을 수행 할 수 있습니까? 아니면 픽셀 단위로 컬러 휠을 그려야합니까?

아이디어가 있으시면

답변

1

This library has pixel shaders that draw color wheels

샘플 XAML : 타원이 작동하지 Fill 설정 브러시가 있어야

<Ellipse Width="300" 
     Height="300" 
     Fill="White"> 
    <Ellipse.Effect> 
     <effects:HsvWheelEffect /> 
    </Ellipse.Effect> 
</Ellipse> 

주, 어떤 색상이 될 수 있습니다.

2

당신이 찾고있는 것은 Path Gradient Brush입니다. 안타깝게도 아직 WPF에서는 사용할 수 없습니다 (하지만 GDI +에 있음). 아마 미래 버전에서 ...

나는 대략적인 컬러 휠을 얻는 방법에 대한 아이디어가 있습니다.

높은 수준의 설명은 원하는 반지 너비보다 훨씬 넓은 두께를 가진 규칙적인 다각형을 만들기 위해 회전되고 변환되는 선형 그래디언트 (직사각형)를 사용합니다. 그런 다음 링 모양을 "잘라내어"색상환으로 사용합니다.

색상환은 여러 주요 색상 (빨강, 초록, 파랑, 노랑 등)을 가지고 있습니다. 먼저 임의의 기본 선에서 각도 측정을 정의해야합니다. 예를 들어 빨간색은 0 라디안이고 파란색은 pi 라디안입니다. 링의 내부 및 외부 반지름도 정의 할 수 있습니다. trig를 사용하면 시작하는 색상에서 다음 인접 색상까지 선형 그래디언트로 링 드로잉 사각형 주위를 걸을 수 있습니다. 사각형의 너비는 반지의 너비보다 커야합니다 (너는 나중에 이유를 보게 될 것입니다). 그리고 사각형은 그 중간 점에서 원에 접하도록 회전해야합니다.

일단 완료되면 "색상 다각형"(방금 작성한 용어)이 표시됩니다. 그런 다음 반죽으로 쿠키 커터처럼이 다각형에서 반지 모양을 추출합니다. 이를 수행하는 방법은 여러 가지가 있습니다. 중앙에서 내부 반경까지 채워진 원을 배경으로 그리기 만하면 중간 부분이 제거됩니다. 바깥 쪽 부분이 더 어려울 것입니다. WPF에서이 작업을 수행 할 수 있는지 여부는 알 수 없지만 중심에서 반지의 바깥 쪽 가장자리까지 마스크를 생성해야합니다. 검은 색 바탕에 흰색 원이 있습니다. 그런 다음 이미지와 "AND"하여 다각형 외부를 제거합니다.

완벽하지는 않지만 나는 의심 스럽습니다. 많은 trig!

3

실버 라이트의 또 다른 예가 http://asyrovprog.host22.com/colorwheel.html입니다. 소스 코드는 여기에 있습니다 : timeline.codeplex.com under bsd license.

+0

많은 감사! 불행히도 Silverlight 5가 베타 버전이기 때문에 데모를 볼 수 없지만 귀하의 대답은 곧 받아 들여질 것 같습니다. –

관련 문제