WPF效果第二百三十五篇之模拟Led灯珠

最近都在和通讯协议打交道;好久没来玩耍WPF了;今天正好有时间翻了一下上次根据"专家"的设计实现的效果;直接二个ListBox内嵌实现的;现在再去看一眼发现这种呈现效果真low啊(没办法,专家喜欢),难道让人靠肉眼来找不同;

再来看看今天最终实现的效果吧:

①自定义一个控件先初始化:

private void InitializeLedDisplay()
{
    // 初始化 LED 显示屏，将背景设置为黑色
    int[] pixels = new int[_bitmap.PixelWidth * _bitmap.PixelHeight];
    for(int i = 0; i < pixels.Length; i++)
    {
        // 黑色的整数表示
        pixels[i] = unchecked((int) 0xFF000000);
    }
    _bitmap.WritePixels(new Int32Rect(0, 0, _bitmap.PixelWidth, _bitmap.PixelHeight), pixels, _bitmap.PixelWidth * 4, 0);
    // 在黑色背景上绘制白色 LED 灯珠
    for(int y = 0; y < _numLedsY; y++)
    {
        for(int x = 0; x < _numLedsX; x++)
        {
            //默认都是白色
            UpdateLed(x, y, Colors.White);
        }
    }
}

②更新每一个灯珠的默认颜色:

public void UpdateLed(int x, int y, Color color)
{
    // 计算灯珠在 WriteableBitmap 中的起始位置
    int startX = x * (_ledSize + _ledSpacing);
    int startY = y * (_ledSize + _ledSpacing);
    // 创建表示颜色的字节数组
    byte[] colorData = new byte[_ledSize * _ledSize * 4];
    for(int i = 0; i < colorData.Length; i += 4)
    {
        colorData[i] = color.B;
        colorData[i + 1] = color.G;
        colorData[i + 2] = color.R;
        colorData[i + 3] = color.A;
    }
    // 更新 WriteableBitmap 中的一个区域，而不是单个像素
    _bitmap.WritePixels(new Int32Rect(startX, startY, _ledSize, _ledSize), colorData, _ledSize * 4, 0);
}

③最后通过DrawingContext绘制:

protected override void OnRender(DrawingContext drawingContext)
{
    base.OnRender(drawingContext);
    drawingContext.DrawImage(_bitmap, new Rect(0, 0, _bitmap.PixelWidth, _bitmap.PixelHeight));
}

④前台调用:

<Grid Width="720" Height="640">
  <Cores:LedDisplay x:Name="ledDisplay"/>
</Grid>

⑤关于缩放参考如下:

https://www.codeproject.com/Articles/85603/A-WPF-custom-control-for-zooming-and-panning

最终简单效果就这么完事了;以后有时间的话,可以再去摸索一下更复杂的效果;编程不息、Bug不止、无Bug、无生活;改bug的冷静、编码的激情、完成后的喜悦、挖坑的激动 、填坑的兴奋;这也许就是屌丝程序员的乐趣吧;今天就到这里吧;希望自己有动力一步一步坚持下去;生命不息,代码不止;大家抽空可以看看今天分享的效果,有好的意见和想法,可以在留言板随意留言;我看到后会第一时间回复大家,多谢大家的一直默默的关注和支持!如果觉得不错,那就伸出您的小手点个赞并关注一下,多谢您的支持！