最近公司项目在用uni-app做小程序商城,其中商品和个人需要生成图片海报,经过摸索记录后将一些重点记录下来.这里有两种方式来生成 1.后台控制生成 2.前端用canvas合成图片 这里我们只讲使用canvas合成图片的方法,canvas包括绘制文字.图片.图形以及图片显示处理. 一.初始化canvas画布 通过createCanvasContext方法来创建画布 var _this = this; _this.ctx = uni.createCanvasContext('canvasid',

canvas 创建canvas绘图上下文. <canvas style="width: 300px; height: 200px;" canvas-id="firstCanvas"></canvas> uni.createCanvasContext(canvasId, this) uni.createCanvasContext(firstCanvas, this) 注意:在自定义组件下,第二个参数传入组件实例this,若不传,则无法显示

开篇先来说一下我和来画的故事,以及写这篇文章的初衷. 今年年初时,我还在北京,在 Face++,做着人脸识别技术的 Windows 和 Android 端,做着人工智能终将实现世间所有美好的梦.这时的我已经离开 UWP,甚至 C# 很久了,写着 C++ 和 Java,当时真的没想过会再次回到 UWP 的阵营,直到 4 月份的时候,一次很偶然的机会,我的一位微软的朋友,也是 Face++的老朋友找到我询问我在 Face++ 的工作近况,本以为只是很久没联系之后的简单交流,直到他提到:在深圳,有一家

开篇先来说一下写这篇文章的初衷. 初到来画,通读了来画 UWP App 的代码,发现里面确实有很多比较高深的技术点,同时也是有很多问题的,扩展性,耦合,性能,功能等等.于是我们决定从头重构这个产品,做一个全新的 “来画Pro” 出来,历经三个月的世间,这个产品终于正式上架. (做个小广告,在 Windows 应用商店搜索 “来画Pro” 就可以找到,目前公司定位为收费应用,但是有一个月试用期,如果大家感兴趣,可以跟我要免费代码.这里是 IT之家的报道:https://www.ithome.com

手绘视频最终的生成物是视频文件,前面几篇主要讲的是手绘视频的创作部分,今天讲一下手绘视频的导出问题.主要以 UWP 为例,另外会介绍一些 Web 端遇到的问题和解决方法. 如上所述,手绘视频在创作后,最终会导出为视频文件,如 MP4,WMV 等,我们目前的选择是 MP4,整个导出大致分为几个步骤: 1. 后台渲染手绘视频 后台渲染我们借助的还是 Win2D,前面几篇介绍过,创作绘制过程也是借助 Win2D 来完成动态渲染的.把需要渲染的元素和指定的时间等属性传递给 Win2D,其他的由 Win2

AI(Artificial Intelligence)正在不断的改变着各个行业的形态和人们的生活方式,图像识别.语音识别.自然语言理解等 AI 技术正在自动驾驶.智能机器人.人脸识别.智能助理等领域中发挥着越来越重要的作用. 那么当手绘视频遇到 AI,有 AI 的手绘视频领域,有 AI 的 UWP 手绘视频创作工具,会发生些什么呢?我们从12月23日的一次发布会开始讲起吧: 2018年短视频新生态峰会暨来画新品发布会   在本次发布会上,来画视频发布了正式上线的 iOS Android 手绘视频

本篇作为技术分享系列的第三篇,详细讲一下手绘视频中结合视频的处理方式. 随着近几年短视频和直播行业的兴起,视频成为了人们表达情绪和交流的一种重要方式,人们对于视频的创作.编辑和分享有了更多的需求.而视频的编辑.剪辑方式,也由过去需要借助专业的视频剪辑软件,专业的视频剪辑操作者操作,变为现在的普通用户可以使用视频类 App 很方便的创作出视频. 短视频和直播类 App 对于视频的处理,主要集中在:滤镜.美颜.贴纸.视频剪切和拼接.视频变速.音轨合成,这些实现基本都是基于 OpenCV.OpenGL

从2017年11月开始,我们开始规划和开发全新的来画Pro,在12月23日的短视频峰会上推出了预览版供参会者体验,得到了很高的评价和关注度.吸取反馈建议后,终于在2018年1月11日正式推出了全新版本的 UWP App,定名为"来画视频".(根据微软应用商店的命名规则,大家可以继续搜索"来画Pro") 全新版本的 UWP 来画视频,适配了来画平台的手绘视频模板,对创作工具做了全新的改版. 适配来画平台手绘视频模板 来画成立两年多的时间里,一直在积累手绘视频模板,目前

概述 Microsoft Tech Summit 2018 微软技术暨生态大会将于10月24日至27日在上海世博中心举行,这也会是国内举办的最后一届 Tech Summit,2019 年开始会以 Microsoft Ignite Tour 的形式出现,大家可以在官网查看本次会议信息:https://www.microsoft.com/china/techsummit/2018/ 今年非常荣幸最终入选了分会场课程,我会在 27日下午5点给大家带来 “利用 Windows 新特性开发出更好的手绘视频

RoughJS是一个轻量级的JavaScript图形库(压缩后约9KB),可以让你在网页上绘制素描风格.手绘样式般的图形.RoughJS定义了绘制直线,曲线,圆弧,多边形,圆和椭圆的图元,同时它还支持绘制SVG路径. 这里是它的项目网站地址:https://roughjs.com/ RoughJS可以同时在Canvas和SVG上工作,这是一个非常实用的特性. 安装 最新的RoughJS库可以在Github中下载. 或者从npm下载: npm install --save roughjs 使用 c

轻量级手绘软件openCanvas免费版,手绘板CG手绘软件 手绘软件通俗一点来说就是用手来绘画的软件,应用很宽泛如建筑,服饰陈列设计.橱窗设计.家居软装设计.空间花艺设计.美术.园林.环艺.摄影.工业设计.视觉传达等各个领域,手绘软件其中包含PS,AI或SAI等著名的绘画软件.通过手绘板来画思维导图.流程图.草图是个不错的选择. 对普通使用白板功能画思维导图.流程图的,使用Photoshop软件太大了,打开太占内存了:sai软件也过于专业:window10自带的白板功能(win+w键),但第一

永中dcs是一款在线预览各种办公文件的网络产品,我们可以只用一个浏览器就可以实现对word,ppt和excel等文件的在线浏览,在其中有一个在线手绘功能很有特色,让我们来探一探它的实现原理吧. 第一,简单的光标滑动中究竟发生了什么 当你啪的一声在屏幕上按下鼠标光标或者更直接的用手指头按住触摸屏,浏览器就会产生对应的触摸事件,输出类似于下面所示的信息 event = { clientX:xxx, clientY:yyy, timeStamp:tttt, ... } 每划过一段距离和一段时间,浏览器

研究生做的稍微有点水平的就这两个项目了:一个是利用SVM做手绘草图的分类,另一个是利用JointBoost+CRF做手绘草图的分割.总结得出的经验是做研究的方法就是将别人大神的代码看懂然后改成适合自己项目的代码,转而这次记录的是另一个项目就是利用JointBoost+CRF做手绘草图的分割. 引言 手绘草图的分割就是语义上的分割,如下面两个图:    左图是未标记的"手绘草图",右图是人工标记了的手绘草图,我们想训练一个分类模型能够对手绘草图上的样点进行语义分类,即判断某点所属类别(头

http://lemberg.github.io/mappwidget/user_guide.html 最近在看一些导游类应用,发现一些景区的导览图使用的完全是自定义地图,也就是手绘地图.这种小范围使用的,专业的地图给人以亲切的感觉.但是他们是如何实现的呢,网上找了找实现思路,都没有太满意的. 在一家英国的网站上,发现了一个类库,可以实现类似的功能.试了一下它提供的demo,发现功能强大的超过了我的预期.在这里分享给大家,希望给大家提供一个思路吧.  翻译的有不准确的地方,请见谅. 大家先看看中

学了这么久的EDIUS视频编辑软件,你们学的怎么样了呢?你们知道EIDUS手绘遮罩的用法么,会熟练地使用它么?如果你们还没有学到这一知识点的话也不要着急,因为你们看完下面这篇文章就会明白了.事不宜迟,现在就来一起学习EDIUS手绘遮罩的用法吧! 1.首先我们导入素材进入EDIUS并且放到时间轨上,然后打开特效面板中的视频滤镜选择"手绘遮罩",把它拖拽到素材上就可以了. 2.完成以上步骤,我们在信息面板中就可以看到,我们加在素材图片上的"手绘遮罩"滤镜特效了.我们双击

Themify 图标是一套用在网页设计和应用程序的图标,包括 320+ 手工制作的像素完美的苹果  iOS7 图标中汲取灵感.这些图标完全免费,您可以用于任何目的,无论是个人或商业. 您可能感兴趣的相关文章 Web 开发中很实用的10个效果[附源码下载] 精心挑选的优秀jQuery Ajax分页插件和教程 12款经典的白富美型 jQuery 图片轮播插件 让网站动起来!12款优秀的 jQuery 动画插件 精心挑选的美轮美奂的 jQuery 图片特效插件 立即下载      官方网站 本文链接:

手绘地图导航 第三方库 NAMapKit, 1)支持在手绘图上标记.缩放 2)支持在单张图片 3)支持瓦片小图片 思路 前提:美工已经切好手绘图,并告知我们当前的缩放级别. 1)确定好手绘图左上角点在百度地图上的经纬度坐标. 2)将百度地图经纬度坐标转换成平面坐标 /**  *将经纬度坐标转换为投影后的直角地理坐标  *@param coordinate 待转换的经纬度坐标  *@return 转换后的直角地理坐标  */ UIKIT_EXTERN BMKMapPoint BMKMapPoint

一般来说,可以使用以下几种方式来控制地图的放大/缩小 : 使用控件底部的缩放按钮 双击控件 pinch手势 物理按键 :I键标识缩小 :O键表示放大.(只有设备具有物理按键才行)        当然,你也可以使用自己的按钮实现放大和缩小 缩小一个地图级别,调用: mapWidget.zoomIn(); 增加一个地图级别,调用 mapWiget.zoomOut(); 获取当前地图级别,调用: mapWidget.getZoomLevel(); 地图级别还可以在初始化MapWidget 时,由构造器

文章翻译完了,梳理一下,附Demo下载 基于mAppWidget实现手绘地图(一)–简介 基于mAppWidget实现手绘地图(二)–概要 基于mAppWidget实现手绘地图(三)–环境搭建 基于mAppWidget实现手绘地图(四)—如何附加java doc 基于mAppWidget实现手绘地图(五)—如何创建地图资源 基于mAppWidget实现手绘地图(六)–如何展示地图对象  基于mAppWidget实现手绘地图(七)–根据坐标添加地图对象 基于mAppWidget实现手绘地图(八)–

本篇作为技术分享系列的第四篇,详细讲一下手绘视频中 Surface Pen 和 Surface Dial 的使用场景. 先放一张微软官方商城的图,Surface 的使用中结合了 Surface Pen 和 Surface Dial. Surface Pen 的使用场景不难想象,就像 iPad 和 Android Pad 配置的笔一样,Surface Pen 也在书写.书画和日常操作中发挥着很重要的作用.微软的 Surface Pro 和 Surface Book 系列中都重点强调了 Surfac

本篇作为技术分享系列的第二篇,详细讲一下文字的解析和绘制,这部分功能的研究和最终实现由团队共同完成,目前还在寻找更理想的实现方式. 首先看一下文字绘制在手绘视频中的应用场景 文字是手绘视频中很重要的表现形式,应用场景很广,比如字幕.旁白和一些重要的文字说明提示.和普通视频,如 MV.电影等使用某一种固定字体,如宋体.微软雅黑字体不同的是,在手绘视频中,我们通常会使用一些很有个性化的字体,如毛笔字体.卡通字体和很多手写字体.另一个很大的区别,电影等中的问题,是整体出现的,不存在绘制的过程,所以只需