欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

WPF实现背景灯光随鼠标闪动效果

程序员文章站 2022-06-16 10:05:54
本文实例为大家分享了wpf实现背景灯光随鼠标闪动的具体代码,供大家参考,具体内容如下实现效果如下:思路:将容器分割成组合三角形path,鼠标移动时更新每个三角形的填充颜色。步骤:1、窗体xaml只需放...

本文实例为大家分享了wpf实现背景灯光随鼠标闪动的具体代码,供大家参考,具体内容如下

实现效果如下:

WPF实现背景灯光随鼠标闪动效果

思路:将容器分割成组合三角形path,鼠标移动时更新每个三角形的填充颜色。

步骤:

1、窗体xaml

只需放置一个canvas。

<canvas x:name="container" width="400" height="400"></canvas>

2、交互逻辑

/// <summary>
/// mainwindow.xaml 的交互逻辑
/// </summary>
 public partial class mainwindow : window
 {
  private point lastmouseposition = new point(0, 0);//鼠标位置
  private int trianglelength = 100;//三角形边长
 
  public mainwindow()
  {
   initializecomponent();
   this.loaded += mainwindow_loaded;
   compositiontarget.rendering += updatetriangle;
   this.container.previewmousemove += updatelastmouseposition;
  }
 
  private void mainwindow_loaded(object sender, routedeventargs e)
  {
   //将长方形容易划分成组合三角形
   int horizontalcount = (int)(this.container.actualwidth / trianglelength);
   int verticalcount = (int)(this.container.actualheight / trianglelength);
   for (int i = 0; i < horizontalcount; i++)
   {
    for (int j = 0; j < verticalcount; j++)
    {
     path trianglepath1 = new path();
     var g1 = new streamgeometry();
     using (streamgeometrycontext context = g1.open())
     {
      context.beginfigure(new point(i * trianglelength, j * trianglelength), true, true);
      context.lineto(new point(i * trianglelength, (j + 1) * trianglelength), true, false);
      context.lineto(new point((i + 1) * trianglelength, (j + 1) * trianglelength), true, false);
     }
     trianglepath1.data = g1;
     trianglepath1.fill = new solidcolorbrush(color.fromargb(255, 247, 18, 65));
     this.container.children.add(trianglepath1);
 
     path trianglepath2 = new path();
     var g2 = new streamgeometry();
     using (streamgeometrycontext context = g2.open())
     {
      context.beginfigure(new point(i * trianglelength, j * trianglelength), true, true);
      context.lineto(new point((i + 1) * trianglelength, j * trianglelength), true, false);
      context.lineto(new point((i + 1) * trianglelength, (j + 1) * trianglelength), true, false);
     }
     trianglepath2.data = g2;
     trianglepath2.fill = new solidcolorbrush(color.fromargb(255, 247, 18, 65));
     this.container.children.add(trianglepath2);
    }
   }
  }
 
  private void updatetriangle(object sender, eventargs e)
  {
   //获取子控件
   list<path> childlist = getchildobjects<path>(this.container);
   for (int i = 0; i < childlist.count; i++)
   {
    for (int j = 1; j < childlist.count; j++)
    {
     string si = childlist[i].data.tostring();
     string si1 = midstrex(si, "m", "l");
     string si2 = midstrex(si, "l", " ");
     string si3 = midstrex(si, " ", "z");
     string sj = childlist[j].data.tostring();
     string sj1 = midstrex(sj, "m", "l");
     string sj2 = midstrex(sj, "l", " ");
     string sj3 = midstrex(sj, " ", "z");
     //左右三角形判断
     if (si1 == sj1 && si3 == sj3)
     {
      double x = childlist[i].data.bounds.x + (1 - math.pow(2, 0.5) / 2) * trianglelength - lastmouseposition.x;
      double y = childlist[i].data.bounds.y + (1 - math.pow(2, 0.5) / 2) * trianglelength - lastmouseposition.y;
      double rradio = 1 - math.pow(x * x + y * y, 0.5) / math.pow(this.container.actualwidth * this.container.actualwidth + this.container.actualheight * this.container.actualheight, 0.5);
      childlist[j].fill = new solidcolorbrush(color.fromargb((byte)(255 * rradio), 247, 18, 65));
      x = childlist[j].data.bounds.topright.x - (1 - math.pow(2, 0.5) / 2) * trianglelength - lastmouseposition.x;
      rradio = 1 - math.pow(x * x + y * y, 0.5) / math.pow(this.container.actualwidth * this.container.actualwidth + this.container.actualheight * this.container.actualheight, 0.5);
      childlist[i].fill = new solidcolorbrush(color.fromargb((byte)(255 * rradio), 247, 18, 65));
      break;
     }
    }
   }
  }
 
  private void updatelastmouseposition(object sender, mouseeventargs e)
  {
   lastmouseposition = e.getposition(this.container);
  }
 
  /// <summary>
  /// 获得所有子控件
  /// </summary>
  private list<t> getchildobjects<t>(system.windows.dependencyobject obj) where t : system.windows.frameworkelement
  {
   system.windows.dependencyobject child = null;
   list<t> childlist = new list<t>();
   for (int i = 0; i < visualtreehelper.getchildrencount(obj); i++)
   {
    child = visualtreehelper.getchild(obj, i);
    if (child is t)
    {
     childlist.add((t)child);
    }
    childlist.addrange(getchildobjects<t>(child));
   }
   return childlist;
  }
 
  /// <summary>
  /// 截取两个指定字符中间的字符串
  /// </summary>
  public static string midstrex(string sourse, string startstr, string endstr)
  {
   string result = string.empty;
   int startindex, endindex;
   try
   {
    startindex = sourse.indexof(startstr);
    if (startindex == -1)
     return result;
    string tmpstr = sourse.substring(startindex + startstr.length);
    endindex = tmpstr.indexof(endstr);
    if (endindex == -1)
     return result;
    result = tmpstr.remove(endindex);
   }
   catch (exception ex)
   {
   }
   return result;
  }
}

说明:当组合三角形过多时,会有明显卡顿,需要优化色彩更新方法。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。