C＃の持つ透明性チュートリアル - パート3

前書き

以前のチュートリアルのように、私たちは「どのように」の前に「何」を検討してください。これは、議論は、コードの背後にある概念の提示され、その後、最後に、我々は概念の背後にあるコードを見てみましょう。

フェードの概念

フェードは、一般的にシーン間のスイッチを柔らかくするためにテレビや映画で画像間のトランジションとして使用されています。我々は、フォームの画像を積層し、最後の画像が表示されるまで、それらが消えるさせる各画像を順次のアルファ値を増加させることにより、この効果をシミュレートすることができます。図1は、寛大ケビンハルシー、www.khulsey.comによって提供される一般的な高級車のいくつかの優れたレンダリング（画像ではなく、高級車を使用して、この技術を示しますウィンク| ;）。

重要な注意点：

PNG画像は、それらが別々にzip圧縮された空間を節約するために、画素ごとにアルファ有し、大きいです。別々の画像を使ってプログラムの場合、画像はexeファイルと同じディレクトリにある必要があります。デモを実行するには、それを持つディレクトリにある画像を置きます。ソースコードを実行するには、画像はソースコードを実行する前に、\ビン\ debugディレクトリに置かなければなりません。

プロジェクトを開きます
\ bin \ Debugディレクトリに画像を入れて
コードを実行します。

図1の画像フェード

フォームの概念

あなたは、不透明度を使用して全体の形とフェードを行うことができます。ただ、0と1の間で財産をステップ透明、不透明に。図2は、フェードイン、タイマーベースのスプラッシュ画面を示しています。

Figure 2 Using Form Opacity to fade in a splash screen

スプラッシュ画面をフェードインするために、フォームの不透明度を使用した図2

Having areas of full transparency and full opacity takes a little more work. Figure 3 shows an irregular shaped form with a progress bar that could be used for a splash screen. We use a panel control to hold the image and set the panel’s backcolor property to transparent. The form’s transparency key is also set to the forms backcolor, which in this case is white. Since we aren’t doing much painting in this application, we don’t bother with the flicker-free additions and let C# do the painting for us.

Figure 3 Transparent Form Background With Image, example #1

Figure 4 carries the idea further by using an image and letting it start small and grow to full size. This requires lots of paints so we go back to using the flicker-free techniques. This application might make an interesting splash screen while your real application is doing something in the background. Then again, it might just be annoying.

Figure 4 Transparent Form Background With Image, expample #2

Now we step gingerly outside the safe world of C# and GDI+ into the truly dark and dangerous forest of the Win32 API. We previously visited the twilight shadows at the edge of this forest with the WhatColor demo, but now we plunge straight in and hope none of the low-level MS beasties gets us. Figure 5 is an implementation of the coding ideas that got me going down this muddy and rutted road in the first place. I’d read Rui Lope’s article on Per Pixel Alpha Blend in C#. That article gave just enough information to whet my appetite, but my skill level wasn’t advanced enough to make any real use of it. The studies documented in these tutorials led to my being able to use and somewhat understand his code. And I was able to modify it so that I could get a variable transparency form that responds to mouse events. I don’t know what I’ll do with this new knowledge, but I personally think the effect is pretty cool.

Figure 5 Perpixel Form Transparency With Image

The Code

As mentioned in the first tutorial, we’ll only look at code that introduces new concepts.

Image Fade

Figure 1 Image Fade, introduces a shortcut in the use of ColorMatrix. Each of the elements of the matrix are individually accessible as ColorMatrix.MatrixXY where XY is a number for the row and column.ColorMatrix.Matrix33 is the alpha diagonal member and is used in this code instead of the entire matrix.

Collapse | Copy Code

  //Set alpha in the ColorMatrix
  middleColorMatrix.Matrix33 = middleTransparency;

The middleTransparency variable is set by the timer to sequentially change the alpha for the entire image until the image becomes fully transparent. The other functions are as discussed before.

Form Fade

Figure 2, shows a splash screen fading up from fully transparent to fully opaque. This is very easy to accomplish in C# using the form’s Opacity property. We us a timer to change it from 0.0f to 1.0f in 0.03f steps

Collapse | Copy Code

  private float opacity = 0;
  private void timer1_Tick(object sender, System.EventArgs e)
  {
    opacity += 0.03f;
    this.Opacity = opacity;
    if(opacity > 1.0)
    {
      timer1.Enabled = false;
      buttonAgain.Show();
      buttonQuit.Show();
    }
    Invalidate();
  }

And we use DrawImage in the OnPaint override, as before.

We also add a useful bit of code that has nothing to do with transparency, but allows us to grab the form and drag it around.

Collapse | Copy Code

  // Drag it around the screen
  private const int WM_NCHITTEST = 0x84;
  private const int HTCAPTION = 0x2;
  protected override void WndProc(ref Message m)
  {
    if(m.Msg == WM_NCHITTEST)
      m.Result = new IntPtr(HTCAPTION);
    else
      base.WndProc(ref m);
  }

Form Transparency

Figure’s 3 and 4 Transparent Form Background With Image #1 and #2 show two hypothetical splash screens with full transparency allowing a non rectangular shape. The first has a progress bar and the second grows the image to mark time. The first doesn’t do much painting so no flicker-free techniques are used. The second does a lot of painting so the flicker-free techniques are used.

This code may be a bit of a kludge in that a panel is docked to the center of the form, it’s backcolor is set totransparent and it’s backgroundimage is set to the stump. The form itself has it’s transparency key set to its backcolor. It might seem that it would be eaiser to dispense with the panel and use the form’s backgroundimage property, but for some reason I didn’t fathom, I couldn’t get that to work. Kludges?

Maybe, but it works. The Lunatics, Inc demo had an annoying flash at the start that I never figured out how to get rid of (anybody know how?) so I decided to start the thing minimized, then maximize it before starting the animation.

Collapse | Copy Code

// Starting minimized is hacking crap done to get rid of the initial
// flashing of garbage when the program first starts. We still see a
// bit of a title bar zipping around, 
// odd since this form border style is none.
// ANYBODY KNOW HOW TO DO THIS CORRECTLY?

  private void Form1_Load(object sender, System.EventArgs e)
  {
    this.WindowState = FormWindowState.Normal;
  }

I still got a bit of a title bar flying about at the start, but that is much less annoying than the other way.

Per pixel form transparency

Figure 5 Shows a demo splash screen for Aqua Mala (guaranteed 90% pure water). The base software is entirely a rip of Rui Lopes’ article, but with enough extra added so that I could understand it and actually make something that I consider potentially useful out of it. We have now left the cuddly world of proper C# and are using the win32 API via COM interoperability. And, yes, I do believe that there are actually people who fully understand that concept. I, however, am content to hack it and hope.

私は、Win32のものとC＃のようなものを持つクラスを持つクラスに元を分割しました。私は、フォームのサイズを設定するためのアクセサを追加しましたが、ホットスポットサイズをハードワイヤード。私はこの上でさらに作業を行うとしたら、私は地域にホットスポットを変更したいとちょうど2つのほとんど同じビットマップ内のすべての冗長な画像データではなく、そのビットマップをロードします。私は、コードについてはこちらのドキュメントの多くを行う必要がありますが、私はソースがそれ自身の話をして、私はより徹底した仕事をするために、後で時間を得ることを期待できるようにするつもりです。

つまり、これらのチュートリアルの終わりです。私はそれは読者が私が働いていたよりも、私と一緒に、より良い方法や符号化技術を共有することをいとわないだろう、私はに落ちた落とし穴と、おそらくいくつかの読者のいくつかを回避するのに役立ちます願っています。

転送：http://www.codeproject.com/Articles/6505/Transparency-Tutorial-with-C-Part