Question

我一直绞尽脑汁试图找出如何动画效果。这与我在math.stackexchange.com上提出的问题有关。

https://math.stackexchange.com/questions/91120/equal-division-of-rectangles-to-make-total/

作为旁注，我没有实现上面问题中定义的绘图算法 - 而是使用我自己的算法来更改透视图以使其看起来更加精简。

我已经能够绘制一个固定的3D风格效果，但是我无法将我的大脑缠绕在逻辑上，使下面的线看起来像是朝向你。

enter image description here

我的代码如下，

        List<double> sizes = new List<double>();
        private void Form1_Load(object sender, EventArgs e)
        {
            for (int y = 1; y < 10; y++)
            {
                double s = ((240 / 2) / y) / 4;
                sizes.Add(s);
            }
            sizes.Add(0);
        }

        int offset = 0;
        private void button1_Click(object sender, EventArgs e)
        {
            Bitmap b = new Bitmap(320, 480);
            Graphics g = Graphics.FromImage(b);

            Color firstColor = Color.DarkGray;
            Color secondColor = Color.Gray;    
            Color c = firstColor;

            int yOffset = 0;
            for(int i = 0; i < sizes.Count; i++)
            {
                c = (i % 2 == 0) ? firstColor : secondColor;

                int y = (int)Math.Round(b.Height - yOffset - sizes[i]);
                int height = (int)Math.Round(sizes[i]);

                g.FillRectangle(new SolidBrush(c), new Rectangle(0, y + offset, b.Width, height + offset));
                yOffset += (int)sizes[i];
            }

            this.BackgroundImage = b;
            offset+=1;
        }

每次单击按钮都会导致矩形调整大小并靠近。但是，我的矩形并没有像它们应该的那样增长。我的逻辑很好，但就移动而言根本不起作用。

所以我的问题是：

是否存在我不知道的这种效果的现有算法，或者这是我认为过于简单的事情？任何帮助纠正我的逻辑或指导我正确的方向将非常感激。

Answer 1

...有趣

（答案视频：http://youtu.be/estq62yz7v0）

我会这样做：

首先，放弃所有RECTANGLE绘图并逐行绘制效果。像这样：

for (int y=start;y<end;y++) 
{
    color = DetermineColorFor(y-start);
    DrawLine(left, y, right, y, color);
}

这当然是伪代码，不会受到GDI +等问题的困扰。

除了如何编码DetermineColorFor()方法之外，这里的一切都很清楚。该方法必须返回指定PROJECTED高度的线条颜色。 projection diagram

现在，在图片上，你有：

你的观点（X） - 不知道如何引人注目
红线（这是你的屏幕 - 投影平面）
你的背景（底部交替的条纹）
并且几条投影线可以帮助您设计DetermineColorFor()方法

提示 - 使用三角形相似性从屏幕坐标到“条形”坐标下一个提示 - 当您处于'bar'坐标时，使用模运算符来确定颜色。

如果需要，我会添加更多提示，但如果你自己解决这个问题会很棒。

我在某种程度上受到了这个问题的启发，并为解决方案创建了一个代码。这是：

int _offset = 0;
double period = 20.0;
private void timer1_Tick(object sender, EventArgs e)
{
    for (int y = Height / 3; y < Height; y++)
    {
        using (Graphics g = CreateGraphics())
        {
            Pen p = new Pen(GetColorFor(y - Height / 3));
            g.DrawLine(p, 0, y, Width, y);
            p.Dispose();
        }
    }
    _offset++;
}

private Color GetColorFor(int y)
{
    double d = 10.0;
    double h = 20.0;
    double z = 0.0;
    if (y != 0)
    {
        z = d * h / (double)y + _offset;
    }
    double l = 128 + 127 * Math.Sin(z * 2.0 * Math.PI / period);
    return Color.FromArgb((int)l, (int)l, (int)l);
}

试验：

d - 从眼睛到投影屏幕的距离
h - 来自'bar'的眼睛高度
period - 'bar'上的条纹宽度

我在表单和事件上有一个计时器正确挂钩。定时器持续时间为20ms。

Answer 2

考虑到你在这里谈论的是2D渲染，就像我说的那样，对我而言，似乎你要重新开始轮子。因为你需要什么，恕我直言;是使用GDI +中已有的Matrix Transformations进行2D渲染。

在GDI +中应用它的示例：GDI+ and MatrixTranformations

为此，他们使用System.Drawing.Drawing2D.Matrix类，它位于Graphics内。

我用过的最好的2D渲染框架是Piccolo2D框架，我在大型实际生产项目中取得了巨大的成功。绝对将它用于2D渲染项目，但首先你需要对它进行一点研究。

希望这有帮助。

麻烦绘制3d风格的效果

2 个答案: