psetpsetpset 发表于 2013-6-19 10:25:08

【转】170行代码的俄罗斯方块 C#制作动画效果

PPT 以动画方式显示幻灯片是其一个很重要的特点,相信里边一定有您喜欢的动画方式,今天我就带大家认识几款以动画方式显示幻灯片的制作方法,由于是GDI+编程, 这里以图像代替幻灯片(其实原理是相通的)来演示如何制作以动画方式显示图像。

说明: 由于是以动画方式显示图像, 这里没办法直接贴静态截图, 因此决定给园友开源, 将所有的可运行代码附在案例后面, 由于所有的动画处理图像的对象放在都pictureBox控件中, 同时定义的类都大同小异, 因此这里先把下面案例中要用到的所有类及装载图像的代码给大家, 运行时用这里的代码加下面任意一个实例的代码即可运行程序! 同时楼主保证每个案例代码都编译通过, 绝不忽悠!

绘图类定义及打开图像文件代码

[*]private Bitmap SourceBitmap;
[*]private Bitmap MyBitmap;
[*]private void button2_Click(object sender, EventArgs e)
[*]{
[*]//打开图像文件
[*]OpenFileDialog openFileDialog = new OpenFileDialog();
[*]openFileDialog.Filter = "图像文件(JPeg, Gif, Bmp, etc.)
[*]|*.jpg;*.jpeg;*.gif;*.bmp;*.tif; *.tiff; *.png| JPeg 图像文件(*.jpg;*.jpeg)
[*]|*.jpg;*.jpeg |GIF 图像文件(*.gif)|*.gif |BMP图像文件(*.bmp)|*.bmp
[*]|Tiff图像文件(*.tif;*.tiff)|*.tif;*.tiff|Png图像文件(*.png)| *.png |所有文件(*.*)|*.*";
[*]if (openFileDialog.ShowDialog() == DialogResult.OK)
[*]{
[*]//得到原始大小的图像
[*]SourceBitmap = new Bitmap(openFileDialog.FileName);
[*]//得到缩放后的图像
[*]MyBitmap = new Bitmap(SourceBitmap, this.pictureBox1.Width, this.pictureBox1.Height);
[*]this.pictureBox1.Image = MyBitmap;
[*]}
[*]}

复制代码
一. 以上下反转的方式显示图像.

原理: 计算图像位置和高度后以高度的一半为轴进行对换上下半边的图像.

代码:

以上下反转方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]
[*]try
[*]{
[*]int width = this.MyBitmap.Width; //图像宽度
[*]int height = this.MyBitmap.Height; //图像高度
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray);
[*]for (int i = -width / 2; i <= width / 2; i++)
[*]{
[*]g.Clear(Color.Gray);
[*]int j = Convert.ToInt32(i * (Convert.ToSingle(height) / Convert.ToSingle(width)));
[*]Rectangle DestRect = new Rectangle(0, height / 2 -j, width, 2 * j);
[*]Rectangle SrcRect = new Rectangle(0, 0, MyBitmap.Width, MyBitmap.Height);
[*]g.DrawImage(MyBitmap, DestRect, SrcRect, GraphicsUnit.Pixel);
[*]System.Threading.Thread.Sleep(10);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
二. 以上下对接的方式显示图像

原理: 首先将图像分为上下两部分, 然后分别显示.

代码:

以上下对接方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]
[*]try
[*]{
[*]int width = this.pictureBox1.Width; //图像宽度
[*]int height = this.pictureBox1.Height; //图像高度
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray);
[*]Bitmap bitmap = new Bitmap(width, height);
[*]int x = 0;
[*]while (x <= height / 2)
[*]{
[*]for (int i = 0; i <= width - 1; i++)
[*]{
[*]bitmap.SetPixel(i, x, MyBitmap.GetPixel(i, x));
[*]}
[*]for (int i = 0; i <= width - 1; i++)
[*]{
[*]bitmap.SetPixel(i, height - x - 1, MyBitmap.GetPixel(i, height - x - 1));
[*]}
[*]x++;
[*]this.panel1.Refresh();
[*]g.DrawImage (bitmap,0,0);
[*]System.Threading.Thread.Sleep(10);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
三. 以四周扩散的方式显示图像

原理: 首先设置图像显示的位置, 然后按高度和宽度的比例循环输出, 直到高度和宽度为原始大小.

代码:

以四周扩散方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]
[*]try
[*]{
[*]int width = this.MyBitmap.Width; //图像宽度
[*]int height = this.MyBitmap.Height; //图像高度
[*]//取得Graphics对象
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray); //初始为全灰色
[*]for (int i = 0; i <= width / 2; i++)
[*]{
[*]int j = Convert.ToInt32 (i*(Convert.ToSingle(height) / Convert.ToSingle(width)));
[*]Rectangle DestRect = new Rectangle(width / 2 - i, height/2-j, 2 * i, 2*j);
[*]Rectangle SrcRect = new Rectangle(0, 0, MyBitmap.Width, MyBitmap.Height);
[*]g.DrawImage(MyBitmap, DestRect, SrcRect, GraphicsUnit.Pixel);
[*]System.Threading.Thread.Sleep(10);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
四. 以分块效果显示图像

原理: 首先将图分为几块, 再使用 Bitmap 类的 Clone方法从原图指定的块中复制图像, 最后将这些块依次显示出来便可

代码:

以分块效果显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.White);
[*]int width = MyBitmap.Width;
[*]int height = MyBitmap.Height;
[*]//定义将图片切分成四个部分的区域
[*]RectangleF[] block ={
[*]new RectangleF(0,0,width/2,height/2),
[*]new RectangleF(width/2,0,width/2,height/2),
[*]new RectangleF(0,height/2,width/2,height/2),
[*]new RectangleF(width/2,height/2,width/2,height/2)};
[*]//分别克隆图片的四个部分
[*]Bitmap[] MyBitmapBlack ={
[*]MyBitmap.Clone(block,System.Drawing.Imaging.PixelFormat.DontCare),
[*]MyBitmap.Clone(block,System.Drawing.Imaging.PixelFormat.DontCare),
[*]MyBitmap.Clone(block,System.Drawing.Imaging.PixelFormat.DontCare),
[*]MyBitmap.Clone(block,System.Drawing.Imaging.PixelFormat.DontCare)};
[*]//绘制图片的四个部分,各部分绘制时间间隔为0.5秒
[*]g.DrawImage(MyBitmapBlack, 0, 0);
[*]System.Threading.Thread.Sleep(1000);
[*]g.DrawImage(MyBitmapBlack, width / 2, 0);
[*]System.Threading.Thread.Sleep(1000);
[*]g.DrawImage(MyBitmapBlack, width / 2, height / 2);
[*]System.Threading.Thread.Sleep(1000);
[*]g.DrawImage(MyBitmapBlack, 0, height / 2);
[*]}

复制代码
五. 以淡入淡出效果显示图像

原理: 使用 ImageAttrributes 类的 SetColorMatrix() 方法设置颜色, 调整矩阵实现淡出的效果. 此类还可以对颜色进行校正, 调暗, 调亮和移除等.

代码:

淡入显示效果

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]
[*]try
[*]{
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray);
[*]int width = MyBitmap.Width;
[*]int height = MyBitmap.Height;
[*]ImageAttributes attributes = new ImageAttributes();
[*]ColorMatrix matrix = new ColorMatrix();
[*]//创建淡入颜色矩阵
[*]matrix.Matrix00 = (float)0.0;
[*]matrix.Matrix01 = (float)0.0;
[*]matrix.Matrix02 = (float)0.0;
[*]matrix.Matrix03 = (float)0.0;
[*]matrix.Matrix04 = (float)0.0;
[*]matrix.Matrix10 = (float)0.0;
[*]matrix.Matrix11 = (float)0.0;
[*]matrix.Matrix12 = (float)0.0;
[*]matrix.Matrix13 = (float)0.0;
[*]matrix.Matrix14 = (float)0.0;
[*]matrix.Matrix20 = (float)0.0;
[*]matrix.Matrix21 = (float)0.0;
[*]matrix.Matrix22 = (float)0.0;
[*]matrix.Matrix23 = (float)0.0;
[*]matrix.Matrix24 = (float)0.0;
[*]matrix.Matrix30 = (float)0.0;
[*]matrix.Matrix31 = (float)0.0;
[*]matrix.Matrix32 = (float)0.0;
[*]matrix.Matrix33 = (float)0.0;
[*]matrix.Matrix34 = (float)0.0;
[*]matrix.Matrix40 = (float)0.0;
[*]matrix.Matrix41 = (float)0.0;
[*]matrix.Matrix42 = (float)0.0;
[*]matrix.Matrix43 = (float)0.0;
[*]matrix.Matrix44 = (float)0.0;
[*]matrix.Matrix33 = (float)1.0;
[*]matrix.Matrix44 = (float)1.0;
[*]//从0到1进行修改色彩变换矩阵主对角线上的数值
[*]//使三种基准色的饱和度渐增
[*]Single count = (float)0.0;
[*]while (count < 1.0)
[*]{
[*]matrix.Matrix00 = count;
[*]matrix.Matrix11 = count;
[*]matrix.Matrix22 = count;
[*]matrix.Matrix33 = count;
[*]attributes.SetColorMatrix(matrix, ColorMatrixFlag.Default, ColorAdjustType.Bitmap);
[*]g.DrawImage(MyBitmap, new Rectangle(0, 0, width, height),
[*]0, 0, width, height, GraphicsUnit.Pixel, attributes);
[*]System.Threading.Thread.Sleep(200);
[*]count = (float)(count + 0.02);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}
[*]
[*]淡出显示图像
[*]private void button3_Click(object sender, EventArgs e)
[*]{
[*]
[*]try
[*]{
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray);
[*]int width = MyBitmap.Width;
[*]int height = MyBitmap.Height;
[*]ImageAttributes attributes = new ImageAttributes();
[*]ColorMatrix matrix = new ColorMatrix();
[*]//创建淡出颜色矩阵
[*]matrix.Matrix00 = (float)0.0;
[*]matrix.Matrix01 = (float)0.0;
[*]matrix.Matrix02 = (float)0.0;
[*]matrix.Matrix03 = (float)0.0;
[*]matrix.Matrix04 = (float)0.0;
[*]matrix.Matrix10 = (float)0.0;
[*]matrix.Matrix11 = (float)0.0;
[*]matrix.Matrix12 = (float)0.0;
[*]matrix.Matrix13 = (float)0.0;
[*]matrix.Matrix14 = (float)0.0;
[*]matrix.Matrix20 = (float)0.0;
[*]matrix.Matrix21 = (float)0.0;
[*]matrix.Matrix22 = (float)0.0;
[*]matrix.Matrix23 = (float)0.0;
[*]matrix.Matrix24 = (float)0.0;
[*]matrix.Matrix30 = (float)0.0;
[*]matrix.Matrix31 = (float)0.0;
[*]matrix.Matrix32 = (float)0.0;
[*]matrix.Matrix33 = (float)0.0;
[*]matrix.Matrix34 = (float)0.0;
[*]matrix.Matrix40 = (float)0.0;
[*]matrix.Matrix41 = (float)0.0;
[*]matrix.Matrix42 = (float)0.0;
[*]matrix.Matrix43 = (float)0.0;
[*]matrix.Matrix44 = (float)0.0;
[*]matrix.Matrix33 = (float)1.0;
[*]matrix.Matrix44 = (float)1.0;
[*]//从1到0进行修改色彩变换矩阵主对角线上的数值
[*]//依次减少每种色彩分量
[*]Single count = (float)1.0;
[*]while (count > 0.0)
[*]{
[*]matrix.Matrix00 = (float)count;
[*]matrix.Matrix11 = (float)count;
[*]matrix.Matrix22 = (float)count;
[*]matrix.Matrix33 = (float)count;
[*]attributes.SetColorMatrix(matrix, ColorMatrixFlag.Default, ColorAdjustType.Bitmap);
[*]g.DrawImage(MyBitmap, new Rectangle(0, 0, width, height),
[*]0, 0, width, height, GraphicsUnit.Pixel, attributes);
[*]System.Threading.Thread.Sleep(20);
[*]count = (float)(count - 0.01);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
六. 以左右对接的方式显示图像

原理: 首先将图像分为左右两部分, 然后分别显示.

代码:

以左右对接方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//以左右对接方式显示图像
[*]try
[*]{
[*]int width = this.MyBitmap.Width; //图像宽度
[*]int height = this.MyBitmap.Height; //图像高度
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray); //初始为全灰色
[*]Bitmap bitmap = new Bitmap(width, height);
[*]int x = 0;
[*]while (x <= width / 2)
[*]{
[*]for (int i = 0; i <= height - 1; i++)
[*]{
[*]bitmap.SetPixel(x, i, MyBitmap.GetPixel(x, i));
[*]}
[*]for (int i = 0; i <= height - 1; i++)
[*]{
[*]bitmap.SetPixel(width - x - 1, i,
[*]MyBitmap.GetPixel(width - x - 1, i));
[*]}
[*]x++;
[*]this.panel1.Refresh();
[*]g.DrawImage (bitmap,0,0);
[*]System.Threading.Thread.Sleep(10);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
七. 以左右反转的方式显示图像

原理: 计算图像位置和高度后以宽度的一半为轴进行对换左右半边的图像.\

代码:

以左右反转方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//以左右反转方式显示图像
[*]try
[*]{
[*]int width = this.MyBitmap.Width; //图像宽度
[*]int height = this.MyBitmap.Height; //图像高度
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray); //初始为全灰色
[*]for (int j = -height / 2; j <= height / 2; j++)
[*]{
[*]g.Clear(Color.Gray); //初始为全灰色
[*]int i = Convert.ToInt32(j * (Convert.ToSingle(width) / Convert.ToSingle(height)));
[*]Rectangle DestRect = new Rectangle(width / 2 - i, 0, 2 * i, height);
[*]Rectangle SrcRect = new Rectangle(0, 0, MyBitmap.Width, MyBitmap.Height);
[*]g.DrawImage(MyBitmap, DestRect, SrcRect, GraphicsUnit.Pixel);
[*]System.Threading.Thread.Sleep(10);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
八. 以从上向下拉伸的方式显示图像

原理: 将图像的宽度不变每次显示图像的一部分, 直到将图片完全显示.

代码:

以从上向下拉伸方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//以从上向下拉伸方式显示图像
[*]try
[*]{
[*]int width = this.MyBitmap.Width; //图像宽度
[*]int height = this.MyBitmap.Height; //图像高度
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.Clear(Color.Gray); //初始为全灰色
[*]for (int y = 1; y <= height; y++)
[*]{
[*]Bitmap bitmap=MyBitmap.Clone (new Rectangle(0,0,width ,y),
[*]System.Drawing .Imaging.PixelFormat .Format24bppRgb );
[*]g.DrawImage (bitmap,0,0);
[*]System.Threading.Thread.Sleep(10);
[*]}
[*]}
[*]catch (Exception ex)
[*]{
[*]MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
九. 以从左向右拉伸的方式显示图像

原理:将图像的高度不变每次显示图像的一部分, 直到将图片完全显示

代码:

以从左向右拉伸方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{//以从左向右拉伸方式显示图像try
[*]{
[*]int width = this.MyBitmap.Width; //图像宽度
[*]int height = this.MyBitmap.Height; //图像高度
[*]Graphics g = this.panel1.CreateGraphics();g.Clear(Color.Gray); //初始为全灰色
[*]for (int x = 1; x <= width; x++)
[*]{
[*]Bitmap bitmap=MyBitmap.Clone (new Rectangle
[*](0,0,x ,height),
[*]System.Drawing .Imaging.PixelFormat .Format24bppRgb );
[*]g.DrawImage (bitmap,0,0);
[*]System.Threading.Thread.Sleep(10);
[*]}
[*]}
[*]catch (Exception ex){MessageBox.Show(ex.Message, "信息提示");
[*]}
[*]}

复制代码
十. 以任意角度旋转图像

原理: 主要使用了 Graphics 类提供的 RotateTransform() 方法对图像进行旋转.

代码:

以任意角度旋转显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//以任意角度旋转显示图像
[*]Graphics g = this.panel1.CreateGraphics();
[*]float MyAngle = 0;//旋转的角度
[*]while (MyAngle < 360)
[*]{
[*]TextureBrush MyBrush = new TextureBrush(MyBitmap);
[*]this.panel1.Refresh();
[*]MyBrush.RotateTransform(MyAngle);
[*]g.FillRectangle(MyBrush, 0, 0, this.ClientRectangle.Width, this.ClientRectangle.Height);
[*]MyAngle += 0.5f;
[*]System.Threading.Thread.Sleep(50);
[*]}
[*]}

复制代码
十一. 以椭圆的方式显示图像

原理: 主要使用了 Graphics 类提供的 FillEllipse() 方法和 TextureBrush() 方法.

代码:

椭圆显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//椭圆显示图像
[*]this.panel1.Refresh();
[*]Graphics g = this.panel1.CreateGraphics();
[*]TextureBrush MyBrush = new TextureBrush(MyBitmap);
[*]g.FillEllipse(MyBrush, this.panel1.ClientRectangle);
[*]}

复制代码
十二. 以不同的透明度显示图像.

原理: Graphics 类的 FromArgb() 方法

代码:

以不同的透明度显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//以不同的透明度显示图像
[*]Graphics g = this.panel1.CreateGraphics();
[*]g.SmoothingMode = SmoothingMode.AntiAlias;
[*]TextureBrush MyBrush = new TextureBrush(MyBitmap);
[*]g.FillRectangle(MyBrush, this.panel1.ClientRectangle);
[*]for (int i = 0; i < 255; i++)
[*]{//由透明变为不透明
[*]g.FillRectangle(new SolidBrush(Color.FromArgb(i,Color.DarkSlateGray)), this.panel1.ClientRectangle);
[*]System.Threading.Thread.Sleep(100);
[*]}
[*]}

复制代码
十三. 以不同分辨率显示图像

原理: Bitmap 类的 SetResolution 方法

代码:

以不同的分辨率显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//以不同的分辨率显示图像
[*]Graphics g = this.panel1.CreateGraphics();
[*]for (int i = 10; i < this.panel1.Height; i += 2)
[*]{
[*]g.Clear(Color.Gray);
[*]MyBitmap.SetResolution(i, i);
[*]g.DrawImage(MyBitmap, 0, 0);
[*]System.Threading.Thread.Sleep(100);
[*]}
[*]}

复制代码
十四. 以不同翻转方式显示图像.

原理: Bitmap 类的 RotateFip()方法

代码:

以不同翻转方式显示图像

[*]private void button1_Click(object sender, EventArgs e)
[*]{
[*]//以不同翻转方式显示图像
[*]Graphics g = this.panel1.CreateGraphics();
[*]for (int i = 0; i < 17; i++)
[*]{
[*]switch (i)
[*]{
[*]case 0:
[*]MyBitmap.RotateFlip(RotateFlipType.RotateNoneFlipX);
[*]break;
[*]case 1:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate180FlipNone);
[*]break;
[*]case 2:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate180FlipX);
[*]break;
[*]case 3:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate180FlipXY);
[*]break;
[*]case 4:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate180FlipY);
[*]break;
[*]case 5:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate270FlipNone);
[*]break;
[*]case 6:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate270FlipX);
[*]break;
[*]case 7:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate270FlipXY);
[*]break;
[*]case 8:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate270FlipY);
[*]break;
[*]case 9:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate90FlipNone);
[*]break;
[*]case 10:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate90FlipX);
[*]break;
[*]case 11:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate90FlipXY);
[*]break;
[*]case 12:
[*]MyBitmap.RotateFlip(RotateFlipType.Rotate90FlipY);
[*]break;
[*]case 13:
[*]MyBitmap.RotateFlip(RotateFlipType.RotateNoneFlipNone);
[*]break;
[*]case 14:
[*]MyBitmap.RotateFlip(RotateFlipType.RotateNoneFlipX);
[*]break;
[*]case 15:
[*]MyBitmap.RotateFlip(RotateFlipType.RotateNoneFlipXY);
[*]break;
[*]case 16:
[*]MyBitmap.RotateFlip(RotateFlipType.RotateNoneFlipY);
[*]break;
[*]}
[*]g.Clear(Color.White);
[*]g.DrawImage(MyBitmap, 0, 0);
[*]System.Threading.Thread.Sleep(1000);
[*]}
[*]}

复制代码
十五. ...............

太多了, 大多都是一些GDI+类的常用方法, 如果感兴趣的可以把几个常用类熟悉一下.

自己也能实现很多个性化的以动画方式显示图像.

羽叶 发表于 2013-6-19 10:39:22

感谢楼主分享,不过不要简单的粘贴复制。简单排个版,去掉这些行号谢谢

hngs 发表于 2013-6-19 21:07:19

学习下,谢谢楼主.

l0711 发表于 2013-6-19 23:17:55

慢慢理解吧,谢谢分享.

szy0syz 发表于 2013-11-4 22:30:41

学习了,就是有点难懂哦。
页: [1]
查看完整版本: 【转】170行代码的俄罗斯方块 C#制作动画效果