Canvas 图片平铺设置
/**
* 图片平铺
*/
function initDemo7(){
var canvas = document.getElementById("demo7");
if (!canvas) return;
var context = canvas.getContext("2d");
var type = [
"no-repeat", // 不平铺
"repeat-x", // 横向平铺
"repeat-y", // 纵向平铺
"repeat" // 全画布平铺
];
var index = 3;
var img = new Image();
img.src = "images/timg3.jpg";
img.onload = function () {
// 平铺方式
context.fillStyle = context.createPattern(img, type[index]);
context.fillRect(0, 0, canvas.width, canvas.height);
}
}
Canvas 图片平铺设置的更多相关文章
- [UWP]通过自定义XamlCompositionBrushBase实现图片平铺
1. 什么是XamlCompositionBrushBase 我早就想试试自定义XamlCompositionBrushBase,但一直没机会.上一篇文章介绍到使用Win2D的BorderEffect ...
- Duilib技巧:背景图片平铺
贴图的描述 方式有两种 // 1.aaa.jpg // 2.file='aaa.jpg' res='' restype='0' dest='0,0,0,0' source='0,0,0,0 ...
- ie8下背景图片平铺问题
IE9+及其他浏览器实现背景图片平铺可能需要一个属性就可以background-size:100%/cover; 但是ie8下background-size是不兼容的,因此我们需要用到滤镜,来解决背景 ...
- android实现图片平铺效果&WebView多点触控实现缩放
1.图片平铺效果实现非常简单,只要在xml中添加一个 android:tileMode的属性就可以了.首先在drawable文件夹中添加自己的my.xml文件.代码: Java代码 <?xml ...
- LODOP中设置设置图片平铺水印,超文本透明
之前的博文:LODOP中平铺图片 文本项Repeat. 该博文中是平铺的图片,上面是文本.如果是图片add_print_image和add_print_text纯文本,这两个打印项设计的,可以直接通过 ...
- iOS UIButton 设置图片平铺
UIImage *image2 = [UIImage imageNamed:imgName]; CGFloat top = ; // 顶端盖高度 CGFloat bottom = ; // 底端盖高度 ...
- Android中设定背景图片平铺。
注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 在做Android开发时,我们常常需要为程序设定一个背景,但由于现在的Android设备尺寸不一,如果随便设置一个图片为背景,那么很 ...
- HTML布局排版2 div的和图片平铺方便管理
在HTML里,由于浏览器显示器等差异,浏览器的宽度也会有变化,为了适应不同的宽度,需要用到平铺.例如页面前面的固定的条等,如果是纯色,可以用背景色,如果不是纯色,是渐变等,可以用条状图平铺.常见的布局 ...
- canvas实现平铺水印
欲实现的水印平铺的效果图如下: 从图上看,应该做到以下几点: 文字在X和Y方向上进行平铺: 文字进行了一定的角度的旋转: 水印作为背景,其z-index位置应位于页面内容底部, 即不能覆盖页面主内容: ...
随机推荐
- SIP MGCP和H323的区别
在Windows中内置的NetMeeting就是典型的H.323协议客户端,而比较常见的SIP系统是微软开发的MSN Messenger系统.首先,由用户A向SIP服务器发出呼叫请求,请求的信息包含自 ...
- 【JavaScript 封装库】BETA 5.0 测试版发布!
JavaScript 前端框架(封装库) BETA 5.0 已于10月10日正式发布,今天开始提供 BETA 5.0 的 API 参考文献.相较于之前 5 个版本的发布都是草草的提供源代码,并没有很多 ...
- Axure 8 Tab制作
1 在[页面]面板中选中[page1] 2 在[元件库]中选中[动态面板],并拖拽到[设计区域]中 3 双[设计区域]中的动态面板,打开[动态面板管理]页面 4 在[动态面板管理]页面中输入动态面板的 ...
- Gym 100169A 最短路
题意:不久后滑铁卢将会变得非常冷,但是幸运的是,很多建筑都被桥梁和隧道连接着,所以你不需要总是走在外面.但是现在建筑 物之间的连接是错综复杂的,很难知道某两个建筑物之间的最优路线,所以需要你写程序判断 ...
- AngularJS 重复HTML元素
data-ng-repeat指令会重复一个HTML元素 <!DOCTYPE html><html><head><meta http-equiv="C ...
- django Ajax介绍
1.Ajax技术 认识ajax之前必须先了解json模块,json(Javascript Obiect Notation,JS对象标记)属于一种轻量级的数据交换格式 json的格式来源于js的格式 ...
- link链接外部样式表
一个完整的link标签: <link href="[css adress]" rel="stylesheet" type="text/css&q ...
- python join() 提示UnicodeDecodeError: 'utf8' codec can't decode byte 0xcb in position 0: unexpected end of的原因及解决办法
问题: 在使用join()将列表元素连接成字符串时出错如下 return split.join(result) UnicodeDecodeError: 'utf8' codec can't decod ...
- 汇编:实现C语言的 ||与&&运算
;C程序转汇编(或运算链接) DATAS SEGMENT a Dw b dw cc dw d dw m dw n dw string db dup(?) DATAS ends CODES SEGMEN ...
- LNMP+HAProxy+Keepalived负载均衡 - 基础服务准备
日志服务 修改日志服务配置并重启日志服务: ``` vim /etc/rsyslog.conf ``` 编辑系统日志配置,指定包含的配置文件路径和规则: ``` $IncludeConfig /etc ...