2010-05-14 4 views
1

막대 차트를 만들고 있는데 각 막대에 대해 두 개의 개별 그라디언트가 필요합니다. 먼저 그라디언트가 위쪽에서 아래쪽으로 고체 빨간색에서 투명 빨간색으로 바뀌기를 원합니다. 오른쪽에서 왼쪽으로, 검은 색에서 불투명하게가는 그라디언트의 맨 위에 페인트하고 싶습니다.커스텀 브러시 - 두 개의 그라디언트를 함께 연결하고자합니다.

그래서 왼쪽 하단에 있어야합니다.

  • 하단 왼쪽 - 알파 0
  • 오른쪽 아래 - 알파 0
  • 왼쪽 위 - 알파 255 색상 적색
  • 오른쪽 상단 - 알파 255 색상 블랙

그래서 효과에 내가 원하는 단색을 사용하려면 왼쪽에서 오른쪽으로 그래디언트를 검정색으로 추가 한 다음 그 결과물을 가져 와서 위쪽에서 아래쪽으로 그래디언트를 추가하여 투명도로 추가합니다.

이 모든 것들은 단일 브러시에 담기를 원합니다.

답변

4

예를 직면합니다. 시각적으로 테두리 안에 사각형이있는 VisualBrush를 사용하여 다른 두 브러쉬를 결합하십시오. 이 같은

뭔가 :

<LinearGradientBrush x:Key="UnderBrush" EndPoint="0,1"> 
    <GradientStop Color="#FFFF0000" Offset="0" /> 
    <GradientStop Color="#00FF0000" Offset="1" /> 
</LinearGradientBrush> 

<LinearGradientBrush x:Key="OverBrush" EndPoint="1,0"> 
    <GradientStop Color="#00000000" Offset="0" /> 
    <GradientStop Color="#FF000000" Offset="1" /> 
</LinearGradientBrush> 

<VisualBrush x:Key="CombinedBrush"> 
    <VisualBrush.Visual> 
    <Border Background="{StaticResource UnderBrush}"> 
     <Rectangle Fill="{StaticResource OverBrush}" Width="1" Height="1" /> 
    </Border> 
    </VisualBrush.Visual> 
</VisualBrush> 

CombinedBrush은 막대를 칠하는 데 사용할 수 있습니다, 당신은 당신이 설명하는 효과를 얻을 것이다.

실버 버전

실버 라이트는 어떤 비주얼 당신이 코드에서 WritableBitmap를 구축하고 ImageBrush와 함께 사용한다이 없기 때문에 :

여기
<ImageBrush x:Key="CombinedBrush"> 
    <my:VisualBrushSimulator.Visual> 
    <Border Background="{StaticResource UnderBrush}"> 
     <Rectangle Fill="{StaticResource OverBrush}" Width="1" Height="1" /> 
    </Border> 
    </my:VisualBrushSimulator.Visual> 
</ImageBrush> 

가 VisualBrushSimulator이 구현 될 수있는 방법은 다음과 같습니다

public class VisualBrushSimulator : DependencyObject 
{ 
    public Visual GetVisual(DependencyObject obj) { return (Visual)obj.GetValue(VisualProperty); } 
    public void SetVisual(DependencyObject obj, Visual value) { obj.SetValue(VisualProperty, value); } 
    public static readonly DependencyProperty VisualProperty = DependencyProperty.RegisterAttached("Visual", typeof(Visual), typeof(VisualBrushSimulator), new PropertyMetadata 
    { 
    PropertyChangedCallback = (obj, e) => 
    { 
     int width=1000; 
     int height=1000; 
     var bitmap = new WritableBitmap(width, height); 
     bitmap.Render((Visual)e.NewValue, new ScaleTransform { ScaleX = width, ScaleY = height }); 
     ((ImageBrush)obj).ImageSource = bitmap; 
    } 
    }); 
} 

사실 VisBrush 시뮬레이션은 Visua 나는 브러시에 영향을주지 않습니다.

+0

Silverlight에는 VisualBrush가 없습니다. –

+1

질문에 WPF 및 Silverlight 태그가 지정되었습니다. VisualBrush를 사용하지 않으면이 작업이 더 어려워 일부 코드 숨김이 필요하지만 여전히 수행 할 수 있습니다. Silverlight 지원에 대한 답변을 업데이트하겠습니다. –

0

바의 템플릿이 그리드를 기반으로하는 경우 다음과 같이 2 개의 그라데이션을 오버레이 할 수 있습니다. 나는 당신이 당신의 2 차 그라디언트에 대해 무엇을 원하는지 완전히 이해했는지 확신 할 수는 없지만, 왼쪽에서 오른쪽으로, 검은 색에서 검은 색으로 투명하다고 가정합니다. 내가 잘못 이해 한 경우 아래 XAML의 두 번째 그라디언트를 쉽게 변경할 수 있습니다.

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Grid Width="100" Height="300" > 
     <Grid> 
      <Grid.Background> 
       <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
        <GradientStop Color="#FFFF0000" Offset="0" /> 
        <GradientStop Color="#00FF0000" Offset="1" /> 
       </LinearGradientBrush> 
      </Grid.Background> 
     </Grid> 
     <Grid> 
      <Grid.Background> 
       <LinearGradientBrush StartPoint="0,0" EndPoint="1,0"> 
        <GradientStop Color="#00000000" Offset="0" /> 
        <GradientStop Color="#FF000000" Offset="1" /> 
       </LinearGradientBrush> 
      </Grid.Background> 
     </Grid> 
    </Grid> 
</UserControl> 

이 XAML을 Charles Petzold's XAML Cruncher에 붙여 넣어 결과를 확인하십시오.

행운을 빌어 요,
짐 맥 커디
얼굴은 소프트웨어 및 YinYangMoney

관련 문제