fillrect

  name="google_ads_frame" marginwidth="0" marginheight="0" src="http://pagead2.googlesyndication.com/pagead/ads?client=ca-pub-5572165936844014&dt=1193665761703&lmt=1193665780&format=336x280_as&output=html&correlator=1193665761687&url=http%3A%2F%2Fwww.codeguru.cn%2Fpublic%2Fiframe%2Fwinapiiframe.htm&color_bg=FFFFFF&color_text=000000&color_link=000000&color_url=FFFFFF&color_border=FFFFFF&ad_type=text&ga_vid=1285758818.1193665762&ga_sid=1193665762&ga_hid=111695597&flash=9&u_h=768&u_w=1024&u_ah=740&u_aw=1024&u_cd=32&u_tz=480&u_his=8&u_java=true" frameborder="0" width="336" scrolling="no" height="280" allowtransparency="allowtransparency">     函数功能:该函数用指定的画刷填充矩形,此函数包括矩形的左上边界,但不包括矩形的右下边界。

    函数原型:int FillRect(HDC hdc, CONST RECT *lprc, HBRUSH hbr);

    参数:

    hdc:设备环境句柄。

    lprc:指向含有将填充矩形的逻辑坐标的RECT结构的指针。

    hbr:用来填充矩形的画刷的句柄。

    返回值:如果函数调用成功,返回值非零;如果函数调用失败,返回值是0。

    Windows NT:若想获得更多错误信息,请调用GetLastError函数。

    备注:由参数hbr定义的画刷可以是一个逻辑现刷句柄也可以是一个颜色值,如果指定一个逻辑画刷的句柄,调用下列函数之一来获得句柄;CreateHatchBrush、CreatePatternBrush或CreateSolidBrush。此外,你可以用GetStockObject来获得一个库存画刷句柄。如果指定一个颜色值,必须是标准系统颜色(所选择的颜色必须加1)如FillRect(hdc, &rect, (HBRUSH)(COLOR_ENDCOLORS+1)),参见GetSysColor可得到所有标准系统颜色列表。

    当填充一个指定矩形时,FillRect不包括矩形的右、下边界。无论当前映射模式如何,GDI填充一个矩形都不包括右边的列和下面的行。

    Windows CE:在Windows CE1.0版中,参数hbr不能是一个彩色画刷。在Windows CE2.0版中,此函数和Windows桌面平台上的相同。

    速查:Windows NT:3.1及以上版本;Windows:95及以上版本;Windows CE:1.0及以上版本;头文件:wingdi.h;库文件:gdi32.lib。

<think>我们首先来讨论`fillRect`方法,它是HTML5CanvasAPI的一部分,用于在画布上绘制一个填充的矩形。该方法接受四个参数:起始点的x坐标、起始点的y坐标、矩形的宽度和高度。它会使用当前的填充样式(由`fillStyle`属性指定)来填充矩形。下面是一个使用示例:</think> ### Canvas `fillRect` 方法详解 `fillRect` 是 HTML5 Canvas API 的核心方法,用于绘制填充的矩形。语法如下: ```javascript context.fillRect(x, y, width, height); ``` - **`x, y`**: 矩形左上角的坐标(相对于画布原点) - **`width, height`**: 矩形的宽度和高度(单位为像素) #### 基础示例: ```html <canvas id="myCanvas" width="300" height="200"></canvas> <script> const canvas = document.getElementById('myCanvas'); const ctx = canvas.getContext('2d'); // 设置填充色为蓝色 ctx.fillStyle = '#4287f5'; // 绘制矩形:从(50,30)开始,宽200,高140 ctx.fillRect(50, 30, 200, 140); </script> ``` ![蓝色矩形图示](https://via.placeholder.com/300x200/4287f5/FFFFFF?text=Blue+Rect) #### 关键特性: 1. **依赖`fillStyle`属性** 填充颜色需通过 `ctx.fillStyle` 设置(支持颜色名、十六进制、RGBA等): ```javascript ctx.fillStyle = 'rgba(255, 0, 0, 0.5)'; // 半透明红色 ctx.fillRect(100, 100, 80, 60); ``` 2. **覆盖绘制** 后绘制的矩形会覆盖先前的图形(可通过 `globalCompositeOperation` 修改混合模式): ```javascript ctx.fillStyle = 'yellow'; ctx.fillRect(75, 75, 100, 100); // 会覆盖部分蓝色矩形 ``` 3. **与`strokeRect()`的区别** `strokeRect()` 绘制空心矩形轮廓,`fillRect()` 绘制实心填充。 #### 进阶用法:动态渐变矩形 ```javascript // 创建径向渐变 const gradient = ctx.createRadialGradient(150, 100, 10, 150, 100, 100); gradient.addColorStop(0, 'white'); gradient.addColorStop(1, 'purple'); ctx.fillStyle = gradient; ctx.fillRect(50, 50, 200, 100); // 渐变填充矩形 ``` #### 清除矩形区域:`clearRect()` 配套方法 `clearRect(x, y, width, height)` 可擦除指定矩形区域: ```javascript ctx.fillStyle = 'green'; ctx.fillRect(0, 0, 300, 200); // 整个画布填绿 // 在中央清除一个矩形 ctx.clearRect(100, 75, 100, 50); ``` ###
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值