zoukankan      html  css  js  c++  java
  • 我的第一个canvas的作品:漫画对白编辑器

    背景:一直都对canvas挺有有兴趣的,之前刚刚看了《HTML5 CANVAS基础教程》,写了篇读书笔记。

    起因:老婆发来一张最近比较热的漫画图(友谊的小船说翻就翻什么的)。这种漫画,经常PS一下,换个对白,就可以有许多个版本。想起canvas里面有对图片和文字编辑的功能,于是,想着可不可以用canvas实现自己编辑漫画的对白的功能。于是,画了一天的时间,修修改改,弄了个H5的页面出来。

    功能说明:自己编辑对白,加入漫画背景当中去,生成一张新的漫画图片

    优点:1.编辑完成后可以自动生成图片,可以保存转发到朋友圈中

         2.对白部分,可以根据输入的文字长度,自适应背景来改变大小

    缺点:1.对白有字数限制

       2.字数太少时,对白的字体会因为自适应变大,看起来有点奇怪

    思考:作品开发过程中基本没碰上什么困难。只有一点,输入字体和背景图片的关系处理比较麻烦。因为对白的外框使用的是漫画的背景图,所以限制了对白内容的大小,这样就不能根据对白的长度自适应大小。考虑过用canvas画图来实现对白框,但因为要另外改图、设计比较费时间,所以就放弃了。

    源码:github链接:https://github.com/xujanus/xujanus.github.io/tree/master/boat

    作品链接:http://xujanus.github.io/boat/index.html(建议在用微信扫描打开)

    PS.作品中的漫画背景,取自于网络,只用于技术研究使用,版权归原作者所有

  • 相关阅读:
    什么是线程安全和线程不安全
    C# 实现Dictionary数据对象的深度拷贝
    数据库设计三大范式
    Socket 短连接、长连接
    第二篇:MongoDB高级查询
    如何在oracle中导入导出dmp数据库文件
    以太网中的UDP编程:udp分包问题
    CocosBuilder 值得关注的一个新项目
    [转载]iPhone程序到iPad程序的移植问题
    DWR使用总结
  • 原文地址:https://www.cnblogs.com/xujanus/p/5403715.html
Copyright © 2011-2022 走看看