第49篇白板修复之铅笔选择三种粗细(三)

原创 2017年01月03日 11:57:26

关键词:铅笔选择三种粗细

一、铅笔选择三种粗细(三)

1 现在经过调试,三种粗细都能出来,代码如下:

2. cache.isPencil从哪里来的?

下午要从前面打日志,看看它是怎么来的?

二、新发现

1. 以下是默认设置:默认颜色,字体大小等

三、新思路

  我现在找不到为什么会出现一个ispencil,即使我把ispencil删了,仍然出现,所以接下来我想到一个办法,就是:我把所有画直线的line,都改成line_qhz,我看行不行,如果行的话,可能就为画笔找到了出路。

四、重新做笔的粗细

发现如果单控制笔的粗细的话,要改的东西太多,现在的思路是怎么简单怎么来,接下来,这样做:

 把之前,给线条加宽度的代码拿过来,调调用一下,相关代码如下:

Widget.html中相关代码如下:

<canvas id="line-width" width="40"height="40"></canvas>

    <!-- line-width -->

    <sectionid="line-width-container" class="context-popup">

        <labelfor="line-width-text">Line Width:</label>

        <inputid="line-width-text" class="line-width-text"type="text" value="2">

       

        <div id="line-width-done"class="btn-007">Done</div>

    </section>

Widget.js中如下:

        functiondecorateLineWidth() {

            var context =getContext('line-width');

 

           tempStrokeTheLine(context, 2, 5, 15, 35, 15);

           tempStrokeTheLine(context, 3, 5, 20, 35, 20);

           tempStrokeTheLine(context, 4, 5, 26, 35, 26);

 

            context.fillStyle= 'Gray';

            context.font ='9px Verdana';

           context.fillText('Line', 8, 12);

           context.fillText('Width', 6, 38);

 

            var lineWidthContainer =find('line-width-container'),

                lineWidthText= find('line-width-text'),

               btnLineWidthDone = find('line-width-done'),

                h1 =document.getElementsByTagName('h1')[0],

                canvas = context.canvas;

 

            addEvent(canvas,'click', function() {

               hideContainers();

 

               lineWidthContainer.style.display = 'block';

               lineWidthContainer.style.top = (canvas.offsetTop + 1) + 'px';

               lineWidthContainer.style.left = (canvas.offsetLeft + canvas.clientWidth)+ 'px';

 

               lineWidthText.focus();

            });

 

           addEvent(btnLineWidthDone, 'click', function() {

               lineWidthContainer.style.display = 'none';

                lineWidth =lineWidthText.value;

            });

        }

Widget.min.js中如下:

 

                  functiondecorateLineWidth() {

                          varcontext = getContext("line-width");

                          tempStrokeTheLine(context,2, 5, 15, 35, 15), tempStrokeTheLine(context, 3, 5, 20, 35, 20),tempStrokeTheLine(context, 4, 5, 26, 35, 26), context.fillStyle ="Gray", context.font = "9px Verdana",context.fillText("Line", 8, 12), context.fillText("Width",6, 38);

                          varlineWidthContainer = find("line-width-container"),

                                   lineWidthText= find("line-width-text"),

                                   btnLineWidthDone= find("line-width-done"),

                                   canvas= (document.getElementsByTagName("h1")[0], context.canvas);

                          addEvent(canvas,"click", function() {

                                   hideContainers(),lineWidthContainer.style.display = "block",lineWidthContainer.style.top = canvas.offsetTop + 1 + "px",lineWidthContainer.style.left = canvas.offsetLeft + canvas.clientWidth +"px", lineWidthText.focus()

                          }),addEvent(btnLineWidthDone, "click", function() {

                                   lineWidthContainer.style.display= "none", lineWidth = lineWidthText.value

                          })

                  }

 

注:在decorateLineWidth()中加一行,就可以了用了,如下:

 

 

 

2017年1月1日星期日

版权声明:本文为博主原创文章,未经博主允许不得转载。

第47篇白板修复之铅笔选择三种粗细(一)

关键词:铅笔选择三种粗细 一、铅笔选择三种粗细 1.问题描述   现在铅笔只有一种默认粗细可选,也就是width=1;现在要加两种粗细,分别是width=4;width=7; 2. 思路分...
  • SanBaDao
  • SanBaDao
  • 2017年01月01日 15:06
  • 251

第48篇白板修复之铅笔选择三种粗细(二)

关键词:铅笔选择三种粗细 一、铅笔选择三种粗细(二) 1 现在经过调试,三种粗细都能出来,代码如下: 主要针对pencilHandler函数进行了处理,如下: pencilHandler1...
  • SanBaDao
  • SanBaDao
  • 2017年01月01日 17:22
  • 182

Spark编程指南入门之Java篇三-常用Transformations操作

7. 常用的转换Transformations操作 JavaRDD map(Function f) 将数据集的每一个元素按指定的函数f转换为一个新的RDD JavaRDD filter(Funct...
  • gangchengzhong
  • gangchengzhong
  • 2016年12月28日 16:20
  • 1260

Photoshop 画笔工具下的模式选择的使用

现在PS都已经是CS6了,不过我用的还是8.0的,好吧,其实版本真的没有太大的关系。这里记录下的内容是在看李涛老师的ps教程时,觉得不错的例子,也是比较基础的东西,自己就是想记录下,好吧,无聊的人就是...
  • Mr_ZJC
  • Mr_ZJC
  • 2015年08月02日 16:56
  • 1200

第50篇铅笔选择三种粗细(四)之样式及用按钮实现

关键词:铅笔选择三种粗细之样式, 铅笔选择三种粗细用按钮实现 一、铅笔选择三种粗细(四)之样式 1 现在样式如下: 需要做的几点如下: a.使其只针对铅笔 b.改成图片 c.只...
  • SanBaDao
  • SanBaDao
  • 2017年01月03日 20:22
  • 307

第51篇铅笔选择三种粗细(五)之图片实现及定住其它按钮线条 周二

关键词:把三种笔粗细换成三个图片, 把其它按钮线条粗细定住 一、换成图片 1. 把三种笔粗细换成三个图片   实现很简单,只要之前的思路走通了,之前用的是按钮形式(实际上是div),改成图...
  • SanBaDao
  • SanBaDao
  • 2017年01月03日 23:16
  • 255

1、VC控制EXCEL的基本操作之设置篇

设置篇 1 设置单元格的值   1) 选中指定单元格,使用SetValue设置值 CellName.Format(_T("A%d"),i);//单元格的名称 range.Attac...
  • sunxiaoju
  • sunxiaoju
  • 2015年12月29日 15:53
  • 434

java提高篇(二)-----理解java的三大特性之继承

在《Think in java》中有这样一句话:复用代码是Java众多引人注目的功能之一。但要想成为极具革命性的语言,仅仅能够复制代码并对加以改变是不够的,它还必须能够做更多的事情。在这句话中最引人注...
  • chenssy
  • chenssy
  • 2013年10月16日 19:37
  • 20554

[Qt教程] 第13篇 2D绘图(三)绘制文字

[Qt教程] 第13篇 2D绘图(三)绘制文字 楼主  发表于 2013-4-25 23:04:46 | 查看: 720| 回复: 0 ...
  • dengjin20104042056
  • dengjin20104042056
  • 2013年11月10日 17:44
  • 1199

NOIP2016普及组复赛第一题——买铅笔

程序如下: var   i,n,m:longint;   a:array[0..3,0..2]of longint; begin   m:=maxlongint;   readln(n);...
  • SSL_Yyx
  • SSL_Yyx
  • 2016年11月23日 16:38
  • 622
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:第49篇白板修复之铅笔选择三种粗细(三)
举报原因:
原因补充:

(最多只允许输入30个字)