圆盘形调色板绘制方法

 

圆盘形调色板绘制方法
绘画应用软件都有一个漂亮的调色板,用于画笔取色,如Photoshop, AutoCad, 3DS,Painter等。矩形的16m色全色谱真彩的调色板比较容易绘制,我曾看到过圆盘形的调色板,此样式的调色板较难绘制。我想这没几个人会制作。好多时间我潜心研究,经验积累,现在我已能绘制出漂亮的圆盘调色板。我感觉这漂亮的东西应该分享给大家,对于要编制绘图绘画程序的同行们,以及喜欢色彩的朋友们总会有些帮助。希望大家喜欢。

全色谱真彩是24位色,还有早期电脑颜色256色和基本标准的16色。电脑早期的颜色是16色基准颜色,著名的IBM电脑编程起先是基本16色,后来发展为8位的256色,另有16位色的调色板是512色。现在的电脑内存和存储都很大,图片色彩24位机器处理都很快。所以现在大家不太注意图片大小色彩多少位。图片色彩一般都是全色谱真彩的。24位色意为红绿蓝都是0-255色阶,RGB色系256的3次方,即16,777,216色,故也称为16m色。

曾看到一类圆盘形的调色板,很有艺术感。今给大家提供此类调色板的绘制方法与大家分享。我设计了二种画法,一是六分画法,二是八分画法。

3a69bafb9df745c889bd2ccdb0443c3a.png 

下面是绘制方法的源码:
colorpad3 (){
        cs.ClearDraw (0,src);
 //绘制圆形调色板:关键在于每分色块的色过渡
//下面是顺时针和逆时针二种画法
       cs.SetStrokeWidth(2);    //线宽        
       cs.SetColor (255,0,0,250);
       cs.DrawRect (10,10,710,460);
 //*********全色谱真彩调色板(1)八分画法
    dx=180 ;  dy=180 ;   r=110 ;
       for (i= 0; i<=90 ; i++ ){  //red-orange
                a=pi/360*i ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;      
            cr=250 ;  cg=i+110 ;  cb=0 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (x1,y1,x0,y0) ;  }

       for (i= 0; i<=90 ; i++ ){  //orange-yellow
                a=pi/360*(i+90) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;     
            cr=250 ;  cg=200+i/2 ;  cb=0 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (x1,y1,x0,y0) ;  }

      for (i= 0; i<=90 ; i++ ){  //yellow-green
                a=pi/360*(i+180) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;      
            cr=250-i*2 ;  cg=250 ;  cb=0 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (x1,y1,x0,y0) ;  }

      for (i= 0; i<=90 ; i++ ){  //green-blue
                a=pi/360*(i+270) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;      
            cr=i/2+20 ;  cg=255-i/2 ;  cb=i*2+75 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (x1,y1,x0,y0) ;  }

     for (i= 0; i<=90 ; i++ ){  //blue-purple
                a=pi/360*(i+360) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;     
            cr=i;  cg=210-i*2 ;  cb=255-i/4;
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (x1,y1,x0,y0) ;  }

    for (i= 0; i<=90 ; i++ ){  //purple-magenta
                a=pi/360*(i+450) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;      
            cr=90+i ;  cg=30-i/3 ;  cb=230   ;  
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (x1,y1,x0,y0) ;  }

    for (i= 0; i<=90 ; i++ ){  //magenta-red
                a=pi/360*(i+540) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;     
            cr=180+i/2+i/4 ;  cg=0 ;  cb=230-i*2   ;   
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (x1,y1,x0,y0) ;  }

   for (i= 0; i<=90 ; i++ ){  //red-orange
                a=pi/360*(i+630) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            x1=(float)((r-90)*cos (a))+dx ;     
            y1=(float)(-(r-90)*sin (a))+dy ;     
            cr=250;  cg=20+i ;  cb=0   ;   
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (x1,y1,x0,y0) ;  }

        cs.SetStrokeWidth(1);    //线 , print " 60° "
          cs.SetFillMode (1) ; 
          cs.SetTextSize (16);
       for (n=0; n<=7; n++){  //line
               a=pi/360*n*90;  r=120;  
              x0=(float)(r*cos (a))+dx ;    
              y0=(float)(-r*sin (a))+dy ;      
              x1=(float)((r-40)*cos (a))+dx ;    
              y1=(float)(-(r-40)*sin (a))+dy ;      
               cs.SetColor(255, 120, 120, 120 );
               cs.DrawLine (x1,y1, x0,y0) ; 
               x2=(float)((r+20)*cos (a))+dx ;   
               y2=(float)(-(r+10)*sin (a))+dy ;      
               kn=n*45 ;
               ss=intToString (kn)+"° " ;
                  cs.SetColor(255,0, 0, 250 );
               cs.DrawText (ss, x2-15,y2+5) ;          }

       cs.SetTextSize (46);    
       cs.SetTextStyle (1) ; 
       cs.SetFillMode (1) ; 
    ss="圆形 真彩调色板 示例 3 " ;
    cs.SetColor (255,0,50,0);
    cs.DrawText (ss,134,404);
    cs.SetColor (255,0,250,0);
    cs.DrawText (ss,130,400);
       cs.SetFillMode (0) ; 
    cs.SetColor (255,250,150,0);
    cs.DrawText (ss,130,400);
 cs.Update ();

//*********全色谱真彩调色板(2)六分画法
           cs.SetStrokeWidth(2);    //线          
           dx=540 ;  dy=180 ;   r=110 ;
          for (i= 0; i<=120 ; i++ ){  //red-orange
                a=pi/360*i ; 
            x0=(float)(r*cos (a))+dx ;    
            y0=(float)(r*sin (a))+dy ;      
            cr=250 ;  cg=i*2-i/3 ;  cb=0 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;    }

         for (i= 0; i<=120 ; i++ ){   //yellow-green
                a=pi/360*(i+120) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(r*sin (a))+dy ;      
            cr=250-i ;  cg=210+i/3;  cb=0 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }

        for (i= 0; i<=120 ; i++ ){  //green-blue
                a=pi/360*(i+240) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(r*sin (a))+dy ;      
            cr=130-i ;  cg=250 ;  cb=i*2 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }

      for (i= 0; i<=120 ; i++ ){  //blue-purple
                a=pi/360*(i+360) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(r*sin (a))+dy ;      
            cr=60-i/2 ;  cg=240-i-i/2-i/3 ;  cb=250 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }

        for (i= 0; i<=120 ; i++ ){  //purple-magenta
                a=pi/360*(i+480) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(r*sin (a))+dy ;      
            cr=i*2 ;  cg=30-i/4;  cb=250 ;
            cs.SetColor(255,cr, cg, cb );
              cs.DrawLine (dx,dy,x0,y0) ;    }

       for (i= 0; i<=120 ; i++ ){  //magenta-red
                a=pi/360*(i+600) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(r*sin (a))+dy ;      
            cr=250;  cg=0 ;  cb=230-i*2+10;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }
  
         cs.SetStrokeWidth(1);    //线          
           cs.SetFillMode (1) ; 
           cs.SetTextSize (16);
       for (n=0; n<=5; n++){      //六分线
               a=pi/360*n*120;  r=130;  
              x0=(float)(r*cos (a))+dx ;     
              y0=(float)(r*sin (a))+dy ;      
              x1=(float)((r-40)*cos (a))+dx ;     
              y1=(float)((r-40)*sin (a))+dy ;      
               cs.SetColor(255, 120, 120, 120 );
               cs.DrawLine (x1,y1, x0,y0) ; 
               x2=(float)((r+20)*cos (a))+dx ;  
               y2=(float)((r+10)*sin (a))+dy ;      
               kn=n*60 ;
               ss=intToString (kn)+"° " ;
                  cs.SetColor(255,0, 0, 250 );
               cs.DrawText (ss, x2-12,y2+5) ;          }
           
     cs.Update () ;
  } //colorpad3 ()

d7acb684a9294c1d8d9949cbfec208d3.png 

colorpad4 (){
       cs.ClearDraw (0,src);
 //绘制圆形 RGB 调色板:另外一种八分画法
         cs.SetStrokeWidth(2);    //线宽          
         cs.SetFillMode (0) ; 
       cs.SetColor (255,0,0,250);
       cs.DrawRect (30,10,680,500);  //大框线
         cs.SetStrokeWidth(1);    //线宽          
       cs.DrawRect (30,540,680,600);   //横条框线
       cs.DrawRect (450,550,540,588);   //选色框线
       cs.DrawRect (595,25,655,418);   //竖条框线
 //*********全色谱真彩调色板(4)八分画法
          cs.SetStrokeWidth(2);    //线宽          
     dx=300 ;  dy=210 ;   r=150 ;
       for (i= 0; i<=90 ; i++ ){  //red-yellow
                a=pi/360*i ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            cr=250 ;  cg=i*2+70 ;  cb=0 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }

       for (i= 0; i<=90 ; i++ ){  //yellow-green
                a=pi/360*(i+90) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            cr=250-i*2 ;  cg=250 ;  cb=0 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }

      for (i= 0; i<=90 ; i++ ){  //green-cyan
                a=pi/360*(i+180) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            cr=0 ;  cg=250 ;  cb=i*2+i/2 ;
            cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }

     for (i= 0; i<=90 ; i++ ){  //cyan-blue
                a=pi/360*(i+270) ; 
            x0=(float)(r*cos (a))+dx ;    
            y0=(float)(-r*sin (a))+dy ;      
           cr=0 ;  cg=255-i*2-i/2 ;  cb=250 ;
           cs.SetColor(255,cr, cg, cb );
               cs.DrawLine (dx,dy,x0,y0) ;  }

     for (i= 0; i<=90 ; i++ ){  //blue-purple
                a=pi/360*(i+360) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            cr=i*2 ;  cg=i ;  cb=250 ;
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (dx,dy,x0,y0) ;  }

    for (i= 0; i<=90 ; i++ ){  //purple-magenta
                a=pi/360*(i+450) ; 
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            cr=180+i/2+i/4 ;  cg=90-i ;  cb=250 ;  
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (dx,dy,x0,y0) ;  }
 
    for (i= 0; i<=90 ; i++ ){  //magenta-red
                a=pi/360*(i+540) ; 
            x0=(float)(r*cos (a))+dx ;    
            y0=(float)(-r*sin (a))+dy ;      
            cr=250 ;  cg=0 ;  cb=250-i ;   
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (dx,dy,x0,y0) ;  }
  
   for (i= 0; i<=90 ; i++ ){  //red-orange 
                a=pi/360*(i+630) ;   
            x0=(float)(r*cos (a))+dx ;     
            y0=(float)(-r*sin (a))+dy ;      
            cr=250 ;  cg=i-i/4 ;  cb=160-i-i/2-i/4 ;   
            cs.SetColor(255,cr, cg, cb );
                 cs.DrawLine (dx,dy,x0,y0) ;  }

        cs.SetStrokeWidth(1);    //线 , print " 60° "
          cs.SetFillMode (1) ; 
          cs.SetTextSize (16);
       for (n=0; n<=7; n++){    //八分线
               a=pi/360*n*90;  r=160;  
              x0=(float)(r*cos (a))+dx ;     
              y0=(float)(-r*sin (a))+dy ;      
              x1=(float)((r-40)*cos (a))+dx ;    
              y1=(float)(-(r-40)*sin (a))+dy ;      
               cs.SetColor(255, 100, 100, 100 );
               cs.DrawLine (x1,y1, x0,y0) ; 
               x2=(float)((r+20)*cos (a))+dx ;    
               y2=(float)(-(r+10)*sin (a))+dy ;      
               kn=n*45 ;
               ss=intToString (kn)+"° " ;
                  cs.SetColor(255,0, 0, 250 );
               cs.DrawText (ss, x2-15,y2+5) ;          }

//绘制选色条(横式)
//red-yellow-green-cyan-blue-purple-magenta-red
     for (i=0;i<=255;i++){  //调色板:选色条
         cs.SetColor (255,255,i,0); //red-yellow
              cs.DrawLine (i/4+50,550,i/4+50,590);
         cs.SetColor (255,255-i,255,0); //yellow-green
              cs.DrawLine (i/4+114,550,i/4+114,590);
         cs.SetColor (255,0,255-i/2,i);  //green-blue
              cs.DrawLine (i/4+178,550,i/4+178,590);
         cs.SetColor (255,i/2,128-i/2,255);  //blue-purple
              cs.DrawLine (i/4+242,550,i/4+242,590);
         cs.SetColor (255,128+i/2,0,255); //purple
               cs.DrawLine (i/4+306,550,i/4+306,590);
         cs.SetColor (255,255,0,255-i);  //magenta-red
               cs.DrawLine (i/4+370,550,i/4+370,590);
                      }

         cs.SetTextSize (26);    
         cs.SetTextStyle (1) ; 
         cs.SetFillMode (1) ; 
         cs.SetColor (255,230,0,250); 
       cs.DrawRect (452,552,539,587);   //选色
         cs.SetColor (255,120,120,120); 
       cs.DrawRect (560,550,654,589);   //按钮
         cs.SetColor (255,250,250,250); 
       cs.DrawRect (561,551,652,587);   //按钮
         cs.SetColor (255,200,200,200); 
       cs.DrawRect (563,553,652,587);   //按钮
         cs.SetColor (255,220,220,220); 
       cs.DrawRect (563,553,648,583);   //按钮
          cs.SetColor (255,0,0,250); 
        cs.DrawText ("确定 ", 580, 577);
       cs.SetFillMode (0) ;   //选色鼠标icon
           cs.SetColor (255,250,250,250); 
        cs.DrawCircle (360,570,7);

//绘制选色条(竖式)
//red-yellow-green-cyan-blue-purple-magenta-red
     for (i=0;i<=255;i++){  //调色板:选色条
         cs.SetColor (255,255,i,0); //red-yellow
              cs.DrawLine (600,i/4+30,650,i/4+30);
         cs.SetColor (255,255-i,255,0); //yellow-green
              cs.DrawLine (600,i/4+94,650,i/4+94);
         cs.SetColor (255,0,255-i/2,i);  //green-blue
              cs.DrawLine (600,i/4+158,650,i/4+158);
         cs.SetColor (255,i/2,128-i/2,255);  //blue-purple
              cs.DrawLine (600,i/4+222,650,i/4+222);
         cs.SetColor (255,128+i/2,0,255); //purple
               cs.DrawLine (600,i/4+286,650,i/4+286);
         cs.SetColor (255,255,0,255-i);  //magenta-red
               cs.DrawLine (600,i/4+350,650,i/4+350);
                      }

       cs.SetTextSize (46);    
       cs.SetTextStyle (1) ; 
       cs.SetFillMode (1) ; 
    ss="圆形 真彩调色板 示例 4" ;
    cs.SetColor (255,0,50,0);
    cs.DrawText (ss,84,454);
    cs.SetColor (255,0,250,0);
    cs.DrawText (ss,80,450);
       cs.SetFillMode (0) ; 
    cs.SetColor (255,250,150,0);
    cs.DrawText (ss,80,450); 
  cs.Update ();
}//colorpad4 ()

//附原制作的矩形调色板源码

ab3893a7cc284a05b3129ae55a7f4b3a.png
colorpad1 (){
    cs.ClearDraw (0,src);
       cs.SetFillMode (1);//0不填色,1填色
       cs.SetTextSize (30);    //*** (1) ****
       cs.SetColor (255,0,0,200);
       cs.DrawText (" 真彩调色板 ",20,35);
         n=(int)(sn);
        ss=intToString (n);
        ss="mode = "+ss ;
        cs.DrawText (ss,520,35);
       cs.SetFillMode (0);//0不填色,1填色
       cs.SetStrokeWidth(2);    //线          
       cs.SetColor (255,0,0,250);
       cs.DrawRect (20,60,670,460);
       cs.Update ();
    //****  16m 全色真彩调色板
//以8为段变色,缩短显示时间。
//此为模拟演示,调色板取色用要逐点绘制
//机器速度快可以逐点绘制
//绘出图寬256*3 ,图高256
//绘出 图片框定标:sx = 3 * 256 , sy = 256
//   canvas.Scale (0, 0)-(768, 255);
//  r1 = 0; g1 = 255; b1 = 255;
//    for (sx=0;sx<256;sx++){     //blue *******
//         r1 = sx;
//       for (sy=0;sy<256;sy++){   
//              g1 = 255 - sy;
//      cs.SetColor (255,r1,g1,b1);
//     cs.DrawRect (sx+50,sy+90,sx+50,sy+90); 
//            cs.Update ();     //显示绘出过程
//             }   }
//      r1= 255; g1= 255; b1= 255;     //green
//      for (sx=256;sx<512;sx++){    // green ********
//           r1=512- sx +255;   b1=512 - sx; 
 //     for (sy=0;sy<256;sy++){     
 //          g1= 255 - sy;   
 //          cs.SetColor (255,r1,g1,b1);
 //     cs.DrawRect (sx+50,sy+90,sx+50,sy+90); 
//             cs.Update ();     //显示绘出过程
//                }  }
//      r1= 0; g1= 255; b1= 0;     //red
//      for (sx=512;sx<769;sx++){    // red ********
//           r1=513- sx +255;   
//      for (sy=0;sy<256;sy++){     
//          g1= 255 - sy;   
//           cs.SetColor (255,r1,g1,b1);
//     cs.DrawRect (sx+50,sy+90,sx+50,sy+90); 
//             cs.Update ();     //显示绘出过程
//                }  }
//此DrawRect (), 其实是DrawPoint (), 然前者的绘制速度较快。

 

//**** 下面代码以4为段变色,缩短显示时间。
      cs.SetFillMode (1);//0不填色,1填色
        r1= 0; g1= 255; b1= 255;   //blue
      for (i=0;i<64;i++){     // blue ********
             r1=i*4;       sx=i*3;    //太宽,缩一点
     for (j=0;j<64;j++){     
             g1=255-j*4;   sy=j*4;
             cs.SetColor (255,r1,g1,b1);
       cs.DrawRect (sx+50,sy+90,sx+58,sy+98); 
            //  cs.Update ();     //显示绘出过程
                }   }
      r1= 255; g1= 255; b1= 255;    //green
       for (i=64;i<128;i++){    // green ********
            r1=511- i*4 +255;   b1=511- i*4; sx=i*3;
       for (j=0;j<64;j++){     
            g1= 255 - j*4;   sy=j*4 ;
            cs.SetColor (255,r1,g1,b1);
       cs.DrawRect (sx+50,sy+90,sx+58,sy+98); 
              // cs.Update ();     //显示绘出过程
                  }  }
        r1 = 0; g1 = 255; b1 = 0;    //red
      for (i=128;i<192;i++){    // red ********
              r1= i*4-511+255;  sx=i*3 ;
      for (j=0;j<64;j++){
             g1=255 -j*4;   sy=j*4 ;
             cs.SetColor (255,r1,g1,b1);
       cs.DrawRect (sx+50,sy+90,sx+58,sy+98); 
             //  cs.Update ();     //显示绘出过程
                }    }

       cs.SetTextSize (46);    
       cs.SetTextStyle (1) ; 
       cs.SetFillMode (1) ; 
      cs.SetStrokeWidth(1);    //线          
     ss=" 16m色  真彩调色板 示例" ;
    cs.SetColor (255,0,50,0);
    cs.DrawText (ss,84,424);
    cs.SetColor (255,0,250,0);
    cs.DrawText (ss,80,420);
       cs.SetFillMode (0) ; 
    cs.SetColor (255,250,150,0);
    cs.DrawText (ss,80,420);

        cs.Update ();  
}//colorpad1 () 


//**** END ********

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值