2013-12-16 2 views
5

私はMS Paintのカラーピッカーに似たカラーピッカーを作成しようとしています。 残念ながら、私は飽和のアルゴリズムを理解することはできません。 飽和を実装しようとすると、正しく飽和しません。 私は、アルゴリズムの飽和効果のいくつかの理解を欠落している必要があります。虹色のピッカーが正しく飽和しないために、何が欠けている/間違っていますか?

enter image description here

これは私の現在のアルゴリズムが作成するものです。 Y軸上で飽和エフェクトを実行しようとするたびに、最初の行の後のすべてが完全に赤または黒になります。

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using SFML; 
using SFML.Graphics; 
using SFML.Window; 

namespace Source 
{ 
    public ColorWheel() 
    { 
     for (int y = 0; y < 255; y++) 
     { 
      for (int z = 0; z < 6; z++) 
      { 
       for (int x = 0; x < 255; x++) 
       { 
        uint ux = (uint)x; 
        uint uy = (uint)y; 
        uint uz = (uint)z; 
        ux = ux + (uz * 255); 
        image.SetPixel(ux, uy, color); 

        //Red 255 - Green 0-254 
        if (z == 0) 
        { 
         color.G += 1; 
        } 
        //Green 255 - Red 255-0 
        else if (z == 1) 
        { 
         color.R -= 1; 
        } 
        //Green 255 - Blue 0-255 
        else if (z == 2) 
        { 
         color.B += 1; 
        } 
        //Blue 255 - Green 255-0 
        else if (z == 3) 
        { 
         color.G -= 1; 

        } 
        //Blue 255 - Red 0-255 
        else if (z == 4) 
        { 
         color.R += 1; 
        } 
        //Red 255 - Blue 255-0 
        else if (z == 5) 
        { 
         color.B -= 1; 
        } 

     Texture texture = new Texture(image); 
     sprite.Texture = texture; 
    } 

    public void Update(double dt) 
    { 
    } 

    public void Render(RenderWindow rWindow) 
    { 
     rWindow.Draw(sprite); 
    } 

} 

}

+0

レインボーバーのアルゴリズムを簡略化しました。私が飽和しようとしたとき、それはその場所全体にグレーの渦を作りました、おっと! – uFootball8

答えて

2

私はこの非常に興味深い課題を発見しました。私はしばらくの間、私はそれを考え出したと思う。トリッキーな部分は、1行目の色が255から0の間になる間に、連続する行の色が少なくなることを明らかにしています。

こうして、10行目に255ピクセル、245色の色を塗りつぶすことができます。とにかく、ここのコードです:

for (int y = 0; y < 255; y++) 
     { 
      color = new Color((255), y, y); 
      for (int z = 0; z < 6; z++) 
      { 
       for (int x = 0; x < 255; x++) 
       { 
        float colorDif = (255/((float)255 - y)); 
        uint ux = (uint)x; 
        uint uy = (uint)y; 
        uint uz = (uint)z; 
        ux = ux + (uz * 255); 
        image.SetPixel(ux, uy, color); 

        if (x >= lastX + colorDif) 
        { 
         //Red 255 - Green 0-254 
         if (z == 0) 
         { 
          if (color.G < (255)) 
           color.G += 1; 
         } 
         //Green 255 - Red 255-0 
         else if (z == 1) 
         { 
          if (color.R > y) 
           color.R -= 1; 
         } 
         //Green 255 - Blue 0-255 
         else if (z == 2) 
         { 
          if (color.B < (255)) 
           color.B += 1; 
         } 
         //Blue 255 - Green 255-0 
         else if (z == 3) 
         { 
          if (color.G > y) 
           color.G -= 1; 
         } 
         //Blue 255 - Red 0-255 
         else if (z == 4) 
         { 
          if (color.R < (255)) 
           color.R += 1; 
         } 
         //Red 255 - Blue 255-0 
         else if (z == 5) 
         { 
          if (color.B > y) 
           color.B -= 1; 
         } 
         lastX += colorDif; 
        } 
       } 
       lastX = 0; 
      } 
     } 

は、私のためにかなりよく動作するように見えますが、すべての問題があるかどう、レムは知っていると私はそれをもう一度見てみましょう。それが役に立てば幸い!

EDIT:もう少し説明すると、ちょうどいいです。これが達成するのは、カラーをフルカラーからホワイトに変えることです(これが彩度を変えるものです)。しかし、それがあなたが意味するものではない場合に備えて、ちょうどうまくいくはずの別の2つのバリエーションがあります。あなたはそれがすべて黒にブレンドしたい場合は

は、変更する必要があるのはyから0に最小色と255-yから255から最大の色です。

また、あなたがycolorDif = (255/((float)255 - 2 * y));2 *に注意)として、255-yと分の両方の最大値が必要になります。その場合には、グレーにブレンドすることができます。しかし、グレーの場合、255の代わりに127行の色しか得られません。これが意味をなさない場合、私はさらに説明しようとします:P

+0

これは私が頑張ったものです!ありがとう! :) これはHSLに行く必要はありませんので、あなたはRGBに固執します! これは非常に興味深いことです。私は近くにいることは分かっていましたが、私はその最後の部分を理解できませんでした。ありがとう! – uFootball8

+0

それは黒やグレーにブレンドするためにそれを変更することについてはあまり確かではありません。 http://pastebin.com/sRevMDyrは黒を作成せず、奇数のカラーホイールを作成します。白とのブレンドは完璧に機能します。私はまだ自分自身を理解しようとしている、hehe。 – uFootball8

1

ありがとうSteven Mills。

これを行うもう1つの方法は、HSLを使用するコードです。

ここに答えがあります。 C#とSFML.netを使っている人のためのカラーピッカーを作成する作業クラスを投稿して嬉しく思いますが、C#用のカラーピッカーを作成したいと思っている人のためのロジックも提供していますので、のみ。

解決策は単純です: http://richnewman.wordpress.com/about/code-listings-and-diagrams/hslcolor-class/

1)上記のリンクからHSLColorクラスを追加します。

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 

using SFML; 
using SFML.Graphics; 
using SFML.Window; 

namespace Source 
{ 
class ColorWheel : IGameObject 
{ 
    Image image = new Image(240, 220); 
    HSLColor hslColor = new HSLColor(); 
    System.Drawing.Color systemColor = new System.Drawing.Color(); 
    Color pixelcolor = new Color(); 
    public Sprite sprite = new Sprite(); 

    public ColorWheel() 
    { 
     pixelcolor = Color.Red; 
     hslColor.SetRGB(pixelcolor.R, pixelcolor.G, pixelcolor.B); 

     for (int y = 0; y < 220; y++) 
     { 
      //pixelcolor = Color.Red; 
      //hslColor.SetRGB(pixelcolor.R, pixelcolor.G, pixelcolor.B); 
      hslColor.Hue = 0; 
       for (int x = 0; x < 240; x++) 
       { 
        systemColor = hslColor; 
        pixelcolor.R = systemColor.R; 
        pixelcolor.G = systemColor.G; 
        pixelcolor.B = systemColor.B; 
        image.SetPixel((uint)x, (uint)y, pixelcolor); 
        hslColor.Hue += 1; 
       } 
       hslColor.Saturation -= (y * 0.01); 

     } 

     Texture texture = new Texture(image); 
     sprite.Texture = texture; 
    } 


    public void Update(double dt) 
    { 
    } 

    public void Render(RenderWindow rWindow) 
    { 
     rWindow.Draw(sprite); 
    } 

} 
} 

ここに結果として得られる画像があります。自由に自由に使用できます。 ColorWheelクラスを使用する必要はありませんが、単純にこの画像を使用してマウスの位置にあるピクセルを取得して、ゲームオブジェクトを適切に染色してください。(スライダになります)の明るさを変更するには

enter image description here

は、式でhslColor.Luminosityを使用し、それはおそらくあなたが調整する自信がない限り、代わりに画像のカラーホイールのクラスを使用するのが最善だろう画像の明るさは、スライダに取り付けられた倍精度の整数に基づいています。 イメージ、マウスカーソル、スライダの両方を含む優れたカラーピッカーGUIは、わずか数行のコードでTGUIになります。当然のことながら、デフォルトイメージを使用している場合は、ColorWheelクラスを使用しているか、今まで提供したColorWheelイメージを使用して、デフォルトイメージを置き換えたいと思うでしょう。

すべての人が自由に使用することができます。

関連する問題