首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何用一些颜色填充矩形,使用渐变,但只作为工具(没有可见的渐变)?

如何用一些颜色填充矩形,使用渐变,但只作为工具(没有可见的渐变)?
EN

Stack Overflow用户
提问于 2018-12-22 13:13:25
回答 1查看 427关注 0票数 0

我正在为矩形的“填充”属性制作转换器,用不同的颜色填充它。

所以我有一个关于一个人不在的日期的信息清单。如果person在一个时间段中缺席,则矩形的不同部分必须填充color1,否则必须填充color2。对于每个人,我计算日期之间的差异并填充渐变停止,如:颜色1-边界-颜色2-边界-颜色1.我试着让边界几乎看不见。

转换器:

代码语言:javascript
复制
 double bufferOffset = 0.0;
 double taskPeriodInDays = (endDate.Value.Date - 
 startDate.Value.Date).TotalDays;
 List<double> timeSections = new List<double>();

 for (int i = 1; i < absencesDatesBetweenStartAndEnd.Count; i++)
    {
       IsAbsent = !IsAbsent;
       GradientStop color = new GradientStop();
       GradientStop border = new GradientStop();
       border.Color = Colors.Black;

   color.Color = IsAbsent ? Colors.Orange : Colors.Violet;


   color.Offset = i == 1 ? 0 : bufferOffset;
   gradient.GradientStops.Add(color);

   color.Offset = bufferOffset + (absencesDatesBetweenStartAndEnd[i].Date - absencesDatesBetweenStartAndEnd[i - 1].Date).TotalDays / taskPeriodInDays;
   gradient.GradientStops.Add(color);

  if(i == absencesDatesBetweenStartAndEnd.Count - 1)
   {
      break;
   }

        border.Offset = color.Offset + 0.00001;
        gradient.GradientStops.Add(border);

        border.Offset = border.Offset + 0.00001;
        gradient.GradientStops.Add(border);

        bufferOffset = border.Offset;
   }
   return gradient;

<Rectangle Fill="{Binding Converter={StaticResource TaskExecutorAbsenceColorConverter}}"/>

对尝试值的XAML进行硬编码:

代码语言:javascript
复制
<Rectangle.Fill>
   <LinearGradientBrush StartPoint="0 0" EndPoint="1 0">
      <GradientStop Color="red" Offset="0"/>
      <GradientStop Color="red" Offset="0.065573770491803282"/>
      <GradientStop Color="black" Offset="0.065583770491803278"/>
      <GradientStop Color="black" Offset="0.065593770491803274"/>
      <GradientStop Color="blue" Offset="0.065593770491803274"/>
      <GradientStop Color="blue" Offset="0.29510196721311477"/>
      <GradientStop Color="black" Offset="0.29511196721311478"/>
      <GradientStop Color="black" Offset="0.29512196721311479"/>
      <GradientStop Color="red" Offset="0.29512196721311479"/>
      <GradientStop Color="red" Offset="0.36069573770491808"/>
      <GradientStop Color="black" Offset="0.36070573770491809"/>
      <GradientStop Color="black" Offset="0.3607157377049181"/>
      <GradientStop Color="blue" Offset="0.3607157377049181"/>
      <GradientStop Color="blue" Offset="0.50825672131147548"/>
      <GradientStop Color="black" Offset="0.50826672131147543"/>
      <GradientStop Color="black" Offset="0.50827672131147539"/>
      <GradientStop Color="red" Offset="0.50827672131147539"/>
      <GradientStop Color="red" Offset="1.00008"/>
   </LinearGradientBrush>
</Rectangle.Fill>

转换器工作不正确。渐变是可见的。

正如您所看到的,我尝试将梯度停止的值放入XAML中,在这种情况下,它工作得很好。我不明白为什么。

XAML中的硬编码值 使用转换器

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-12-24 18:37:53

可能最合适的方法是使用带有彩色矩形的ItemsControl。但是,如果您仍然希望使用画笔,则可以使用可视画笔来代替如下所示:

代码语言:javascript
复制
public class Conv : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        VisualBrush result = new VisualBrush();
        result.Stretch = Stretch.Fill;
        StackPanel container = new StackPanel();
        container.Orientation = Orientation.Horizontal;

        //Generate a colored rectangle for each day.
        //I just use some random values for illustration.
        Random rnd = new Random();
        for (int i = 0; i < 10; i++)
        {
            Rectangle rect = new Rectangle();
            rect.Width = 20;
            rect.Height = 20;
            rect.Fill = rnd.Next() % 2 == 0 ? Brushes.Red : Brushes.Green;
            container.Children.Add(rect);
        }
        result.Visual = container;
        return result;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/53895939

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档