zoukankan      html  css  js  c++  java
  • Skia之四——SkGradientShader篇

    SkGradientShader 

    1.  SkGradientShader:: CreateLinear

    /** Returns a shader that generates a linear gradient between the two
        specified points.
        <p />
        CreateLinear returns a shader with a reference count of 1.
        The caller should decrement the shader's reference count when done with the shader.
        It is an error for count to be < 2.
        @param  pts The start and end points for the gradient.
        @param  colors  The array[count] of colors, to be distributed between the two points
        @param  pos     May be NULL. array[count] of SkScalars, or NULL, of the relative position of
                        each corresponding color in the colors array. If this is NULL,
                        the the colors are distributed evenly between the start and end point.
                        If this is not null, the values must begin with 0, end with 1.0, and
                        intermediate values must be strictly increasing.
        @param  count   Must be >=2. The number of colors (and pos if not NULL) entries.
        @param  mode    The tiling mode
        @param  mapper  May be NULL. Callback to modify the spread of the colors.
    */
    static SkShader* CreateLinear(  const SkPoint pts[2],
                                    const SkColor colors[], const SkScalar pos[], int count,
                                    SkShader::TileMode mode,
                                    SkUnitMapper* mapper = NULL);

        (1).  SkPoint pts[2];         显示count 个颜色构成的Gradient的起始点和结束点。

      (2).  SkColor colors[] ;    可用于组成Gradient 的颜色表

      (3).  SkScalar pos[] ;         构成Gradient的各颜色起始点在Gradient区间占据的位置(百分比),必须以0开始,以1.0结束,中间值严格增长

       (4).  int count  ;                     指定用于构成Gradient的颜色数()

      (5).  SkShader::TileMode mode ;    Gradient填充指定区域的方式,绘制范围大于 pts的两个点指定的距离时的重复模式

      (6).  SkUnitMapper *mapper ;

      

    (1).

       pts 分别为 [0,0]、[50,50], 画 区域SkRect(0,0,100,100),重复模式kMirror_TileMode,颜色表用红绿蓝白黑

      则Gradient过渡完颜色表的颜色时,需要从点(0,0)到点(50,50),Gradient方向是斜向右下45°

      范围(0,0,100,100)超出范围,重复模式是kMirror_TileMode,镜像重复  

      本来是红绿蓝白黑 超出部分挨着就是  黑白蓝绿红 再次 红绿蓝白黑 ……

         

       如果画图的范围小于 (0,0,50,50),就按比例裁剪

                                                              

              画到(0,0,50,50)                                                                                             (0,0,20,50) 

      

              如果pts 起始点不是(0,0),比如(x,y),如果在(x,y)左侧有绘制Gradient,则按照 mode模式重复。

        pts(50,50),(100,50),方向是从左到右,重复模式kMirror_TileMode,颜色表用红绿蓝白黑

      

      (0,0,100,100)

    从左到右过渡,从起始点的x坐标开始往右50像素是红绿蓝白黑的过渡,

                 从起始点的x坐标(50)开始往左,是右边的kMirror_TileMode模式的重复:从坐标50往左是 红绿蓝白黑。

     (2)

      参数count ,如果小于colors的元素个数,则只取colors的前count个颜色,如果大于,则填充了透明色(但是如果count比colors的元素个数多了超过1,比如大3,就填充3个空颜色,但是空颜色之间的过渡有颜色)

      pts (50,50),(100,50);画范围SkRect r = {0,0,SkIntToScalar(200),SkIntToScalar(100)};

      如:SkColor colors[] ={SK_ColorRED,SK_ColorGREEN,SK_ColorBLUE,SK_ColorWHITE,SK_ColorBLACK};

      //红、绿、蓝、白、黑,这些宏的alpha值都是FF,即不透明

      count = SK_ARRAY_COUNT(colors);

     ,               ,                  

                                                         coutn = 5                                                                                             count =  2:                                                                           count =8:

      

    (3)

      三种mode的效果图  

    kMirror_TileMode 

    repeat the shader's image horizontally and vertically, alternating mirror images so that adjacent images always seam
    kRepeat_TileMode 

    repeat the shader's image horizontally and vertically

     
    kClamp_TileMode

    replicate the edge color if the shader draws outside of its original bounds

     

     

    (4)

      关于constSkScalar pos[]参数,以0开始,以1.0结束,中间值严格增长。

      我个人理解:constSkColor colors[]中两个颜色的过渡所占百分比为pos[]中对应两个值的差值

      SkColor colors[] ={SK_ColorRED,SK_ColorGREEN,SK_ColorBLUE,SK_ColorWHITE,SK_ColorBLACK};
      SkScalar scalars[] ={0.0, 0.2, 0.2, 0.3,1.0};

      //红绿过渡占20%,绿蓝没有过渡,蓝白过渡占10%,白黑过渡70%(对应值的差)

       pts差值800,就是过渡完5个颜色要800像素, 画宽带为800像素的矩形

      红绿颜色过渡占0.2(0.2-0),有160像素

      绿蓝过渡占0(0.2-0.2)   没有绿蓝过渡区

      蓝白过渡占0.1(0.3-0.2)  有80像素

      白黑过渡占0.7(1.0-0.3)  560像素

    效果图:

     

    参考:  http://www.cnblogs.com/ezhong/archive/2011/11/24/2261856.html 

  • 相关阅读:
    elasticsearch 调整参数 调参 -- 副本 分片 读写流程 -- elasticsearch配置
    对创新的理解 -- 价值共生、协同生长
    update_by_query ingest pipeline
    create index pattern Forbidden error
    apache转发规则 + nginx location 正则匹配经典案例
    拨测ip+port 告警 telnet nc
    configMap简单理解
    sidecar收集Tomcat日志-普通用户
    使用DBeaver连接pheonix
    bladex开发自己的服务不推送服务器的方法
  • 原文地址:https://www.cnblogs.com/yaozhongxiao/p/2528694.html
Copyright © 2011-2022 走看看