TypeScript圖形渲染實(shí)戰(zhàn)：2D架構(gòu)設(shè)計(jì)與實(shí)現(xiàn)

定　價(jià)：￥99.00

作　者：	步磊峰著
出版社：	機(jī)械工業(yè)出版社
叢編項(xiàng)：
標(biāo)　簽：	暫缺

購(gòu)買這本書(shū)可以去

ISBN：	9787111619246	出版時(shí)間：	2019-03-01	包裝：	平裝
開(kāi)本：	16開(kāi)	頁(yè)數(shù)：	373	字?jǐn)?shù)：

內(nèi)容簡(jiǎn)介

　　本書(shū)使用微軟*新的TypeScript語(yǔ)言，以面向接口及泛型的編程方式，采用HTML5中的Canvas2D繪圖API，實(shí)現(xiàn)了一個(gè)2D動(dòng)畫(huà)精靈系統(tǒng)，并在該精靈系統(tǒng)上演示了精心設(shè)計(jì)的與圖形數(shù)學(xué)變換相關(guān)的Demo。通過(guò)閱讀本書(shū)，讀者可以系統(tǒng)地掌握TypeScript語(yǔ)言、面向接口和泛型的編程方式、Canvas2DAPI繪圖、圖形數(shù)學(xué)、數(shù)據(jù)結(jié)構(gòu)及重要的設(shè)計(jì)模式。本書(shū)共10章，分為4篇。第1篇TypeScript篇，主要介紹了如何構(gòu)建TypeScript開(kāi)發(fā)、編譯和調(diào)試環(huán)境，以及如何使用TypeScript實(shí)現(xiàn)Doom3詞法解析器；第2篇Canvas2D篇，主要介紹了動(dòng)畫(huà)與Application類，以及如何使用Canvas2D繪圖；第3篇圖形數(shù)學(xué)篇，主要介紹了坐標(biāo)系變換、向量數(shù)學(xué)及基本形體的點(diǎn)選、矩陣數(shù)學(xué)及貝塞爾曲線；第4篇架構(gòu)與實(shí)現(xiàn)篇，主要介紹了精靈系統(tǒng)、優(yōu)美典雅的樹(shù)結(jié)構(gòu)及場(chǎng)景圖系統(tǒng)。本書(shū)特別適合對(duì)圖形、游戲和UI開(kāi)發(fā)感興趣的讀者閱讀，也適合需要系統(tǒng)學(xué)習(xí)圖形開(kāi)發(fā)的人員閱讀。另外，本書(shū)還適合JavaScript程序員及想從C/C++、Java、C#等轉(zhuǎn)HTML5開(kāi)發(fā)的程序員閱讀。

作者簡(jiǎn)介

　　步磊峰現(xiàn)為上海斐繁信息科技有限公司技術(shù)負(fù)責(zé)人。計(jì)算機(jī)圖形編程資深愛(ài)好者。有超過(guò)15年的編程經(jīng)驗(yàn)。擅長(zhǎng)C、C、C#、Java、Objc、JavaScript、TypeScript等編程語(yǔ)言。在作者的程序人生中，曾經(jīng)寫(xiě)過(guò)3D程序、跨平臺(tái)UI引擎、Java頁(yè)游服務(wù)器和微信服務(wù)器，并為國(guó)內(nèi)的多個(gè)大型國(guó)營(yíng)金融機(jī)構(gòu)開(kāi)發(fā)過(guò)多款移動(dòng)端App。個(gè)人的成就是通過(guò)內(nèi)部培訓(xùn)，為公司培養(yǎng)了20多個(gè)C語(yǔ)言、C及移動(dòng)端的開(kāi)發(fā)人才。

圖書(shū)目錄

目錄
前言
第1篇 TypeScript篇
第1章構(gòu)建TypeScript開(kāi)發(fā)、編譯和調(diào)試環(huán)境2
1.1 TypeScript簡(jiǎn)介2
1.2 安裝TypeScript開(kāi)發(fā)環(huán)境3
1.2.1 安裝Node.js3
1.2.2 安裝VS Code4
1.2.3 NPM全局安裝TypeScript6
1.2.4 第一個(gè)TypeScript程序7
1.3 使用TypeScript編譯（轉(zhuǎn)譯）器13
1.3.1 生成tsconfig.json文件13
1.3.2 解決生成tsconfig.json文件后帶來(lái)的常見(jiàn)問(wèn)題13
1.3.3 自動(dòng)編譯TypeScript文件15
1.4 模塊化開(kāi)發(fā)TypeScript15
1.4.1 tsconfig.json文件中的target和module命令選項(xiàng)16
1.4.2 編寫(xiě)Canvas2D類導(dǎo)出給main.ts調(diào)用16
1.4.3 使用lite-server搭建本地服務(wù)器17
1.5 使用SystemJS自動(dòng)編譯加載TypeScript18
1.5.1 NPM本地安裝TypeScript庫(kù)和SystemJS庫(kù)18
1.5.2 SystemJS直接編譯TypeScript源碼19
1.6 使用VS Code調(diào)試TypeScript源碼20
1.6.1 安裝及配置Debugger for Chrome擴(kuò)展20
1.6.2 VS Code中單步調(diào)試TypeScript20
1.7 本章總結(jié)22
第2章使用TypeScript實(shí)現(xiàn) Doom 3詞法解析器24
2.1 Token與Tokenizer24
2.1.1 Doom3文本文件格式26
2.1.2 使用IDoom3Token與IDoom3Tokenizer接口26
2.1.3 ES 6中的模板字符串28
2.1.4 IDoom3Token與IDoom3Tokenizer接口的定義29
2.2 IDoom3Token與IDoom3Tokenizer接口的實(shí)現(xiàn)30
2.2.1 Doom3Token類成員變量的聲明30
2.2.2 Doom3Token類變量初始化的問(wèn)題31
2.2.3 IDoom3Token接口方法的實(shí)現(xiàn)32
2.2.4 Doom3Token類的非接口方法實(shí)現(xiàn)33
2.2.5 Doom3Tokenzier處理數(shù)字和空白符34
2.2.6 IDoom3Tokenizer接口方法實(shí)現(xiàn)34
2.2.7 Doom3Tokenizer字符處理私有方法35
2.2.8 核心的getNextToken方法36
2.2.9 跳過(guò)不需處理的空白符和注釋37
2.2.10 實(shí)現(xiàn)_getNumber方法解析數(shù)字類型38
2.2.11 實(shí)現(xiàn)_getSubstring方法解析子字符串40
2.2.12 實(shí)現(xiàn)_getString方法解析字符串41
2.2.13 IDoom3Tokenizer詞法解析器狀態(tài)總結(jié)42
2.3 使用工廠模式和迭代器模式43
2.3.1 微軟COM中創(chuàng)建接口的方式43
2.3.2 Doom3Factory工廠類43
2.3.3 迭代器模式44
2.3.4 模擬微軟.NetFramework中的泛型迭代器44
2.3.5 IDoom3Tokenizer擴(kuò)展 IEnumerator接口45
2.3.6 修改Doom3Tokenizer源碼45
2.3.7 使用VS Code中的重命名重構(gòu)方法46
2.3.8 使用迭代器解析Token46
2.3.9 面向接口與面向?qū)ο缶幊痰膫€(gè)人感悟47
2.4 從服務(wù)器獲取資源47
2.4.1 HTML加載本地資源遇到的問(wèn)題48
2.4.2 從服務(wù)器加載資源48
2.4.3 使用XHR向服務(wù)器請(qǐng)求資源文件49
2.4.4 TypeScript中的類型別名50
2.4.5 使用doGet請(qǐng)求文本文件并解析51
2.4.6 解決仍有空白字符輸出問(wèn)題52
2.4.7 實(shí)現(xiàn)doGetAsync異步請(qǐng)求方法52
2.4.8 聲明TypeScript中的回調(diào)函數(shù)54
2.4.9 調(diào)用回調(diào)函數(shù)55
2.5 本章總結(jié)57
第2篇 Canvas2D篇
第3章動(dòng)畫(huà)與Application類60
3.1 requestAnimationFrame方法與動(dòng)畫(huà)60
3.1.1 HTML中不間斷的循環(huán)60
3.1.2 requestAnimationFrame與監(jiān)視器刷新頻率62
3.1.3 基于時(shí)間的更新與重繪65
3.2 Application類及其子類67
3.2.1 Application類體系結(jié)構(gòu)67
3.2.2 啟動(dòng)動(dòng)畫(huà)循環(huán)和停止動(dòng)畫(huà)循環(huán)68
3.2.3 Application類中的更新和重繪69
3.2.4 回調(diào)函數(shù)的this指向問(wèn)題70
3.2.5 函數(shù)調(diào)用時(shí)this指向的Demo演示71
3.2.6 CanvasInputEvent及其子類73
3.2.7 使用getBoundingRect方法變換坐標(biāo)系75
3.2.8 將DOM Event事件轉(zhuǎn)換為CanvasInputEvent事件77
3.2.9 EventListenerObject與事件分發(fā)77
3.2.10 讓事件起作用79
3.2.11 Canvas2DApplication子類和WebGLApplication子類79
3.3 測(cè)試及修正Application類80
3.3.1 繼承并覆寫(xiě)Application基類的虛方法80
3.3.2 測(cè)試ApplicationTest類81
3.3.3 多態(tài)（虛函數(shù)動(dòng)態(tài)綁定）82
3.3.4 鼠標(biāo)單擊事件測(cè)試83
3.3.5 CSS盒模型對(duì)_viewportToCanvasCoordinate的影響84
3.3.6 正確的_viewportToCanvasCoordinate方法實(shí)現(xiàn)86
3.4 為Application類增加計(jì)時(shí)器功能90
3.4.1 Timer類與TimeCallback回調(diào)函數(shù)90
3.4.2 添加和刪除Timer（計(jì)時(shí)器）91
3.4.3 觸發(fā)多個(gè)定時(shí)任務(wù)的操作93
3.4.4 測(cè)試Timer功能95
3.5 本章總結(jié)96
第4章使用Canvas2D繪圖98
4.1 繪制基本幾何體98
4.1.1 Canvas2DApplication的繪制流程98
4.1.2 繪制矩形Demo99
4.1.3 模擬Canvas2D中渲染狀態(tài)堆棧100
4.1.4 線段屬性與描邊操作（stroke）103
4.1.5 虛線繪制（交替繪制線段）105
4.1.6 使用顏色描邊和填充108
4.1.7 使用漸變對(duì)象描邊和填充110
4.1.8 使用圖案對(duì)象描邊和填充113
4.1.9 后續(xù)要用到的一些常用繪制方法115
4.2 繪制文本117
4.2.1 封裝fillText方法117
4.2.2 文本的對(duì)齊方式119
4.2.3 自行實(shí)現(xiàn)文本對(duì)齊效果121
4.2.4 計(jì)算文本高度算法122
4.2.5 嵌套矩形定位算法122
4.2.6 fillRectWithTitle方法的實(shí)現(xiàn)125
4.2.7 自行文本對(duì)齊實(shí)現(xiàn)Demo126
4.2.8 font屬性128
4.2.9 實(shí)現(xiàn)makeFontString輔助方法129
4.3 繪制圖像130