Electron 項目開發實戰 Electron Projects

目    錄

第1章  構建第1個Electron應用程序 1

1.1  技術需求 1

1.2  Electron是什麽 1

1.3  準備開發環境 2

1.3.1  安裝Visual Studio Code 2

1.3.2  針對macOS設置環境 3

1.3.3  針對Ubuntu Linux設置環境 5

1.3.4  針對Windows設置環境 6

1.3.5  在Windows上安裝Node.js 7

1.4  創建一個簡單的應用程序 8

1.5  多平臺的打包機制 13

1.5.1  macOS包機制 13

1.5.2  Ubuntu包機制 16

1.5.3  Windows的包機制 18

1.6  本章小結 20

第2章  構建Markdown編輯器 21

2.1  技術需求 21

2.2  配置新的項目 22

2.3  適配屏幕尺寸 26

2.4  集成應用程序菜單 28

2.4.1  創建一個自定義菜單項 29

2.4.2  定義菜單項角色 32

2.4.3  菜單分隔符 33

2.4.4  鍵盤加速鍵 35

2.4.5  特定平臺的菜單 36

2.4.6  配置菜單中的應用程序名稱 38

2.4.7  隱藏菜單項 39

2.4.8  進程間的消息發送 41

2.4.9  將文件保存至本地系統 46

2.4.10  從本地系統中加載文件 53

2.4.11  創建一個文件菜單 57

2.5  添加拖曳功能 59

2.6  支持自動更新功能 62

2.7  修改應用程序的標題 71

2.8  本章小結 72

第3章  與Angular、React和Vue集成 73

3.1  技術需求 73

3.2  利用Angular構建Electron應用程序 73

3.2.1  生成Angular項目 74

3.2.2  將Angular項目與Electron集成 76

3.2.3  配置實時重載 81

3.2.4  設置生產版本 83

3.2.5  設置條件加載 85

3.2.6  使用Angular Material組件 87

3.2.7  Anguar路由機制 91

3.3  利用React構建Electron應用程序 98

3.3.1  創建React項目 98

3.3.2  實時重載 102

3.3.3  設置產品發布版本 105

3.3.4  設置條件加載 107

3.3.5  使用Blueprint UI工具箱 108

3.4  利用Vue.js構建Electron應用程序 113

3.4.1  創建一個Vue配置文件 117

3.4.2  實時重載 119

3.4.3  產品發布版本 121

3.4.4  設置條件加載 122

3.4.5  添加路由機制 123

3.4.6  配置Vue Material 125

3.5  本章小結 129

第4章  構建屏幕截圖剪裁工具 131

4.1  技術需求 131

4.2  準備項目 132

4.3  配置無框窗口 133

4.3.1  macOS的附加選項 135

4.3.2  使用隱藏的titleBarStyle 135

4.3.3  titleBarStyle屬性的hiddenInset值 136

4.3.4  titleBarStyle的customButtonsOnHover值 137

4.4  透明窗口 138

4.5  可拖曳的應用程序窗口 141

4.6  添加截圖工具欄按鈕 142

4.7  使用desktopCapturer API 144

4.8  計算主顯示尺寸 145

4.9  生成並保存縮略圖 146

4.10  重置圖像尺寸並剪裁圖像 148

4.11  測試應用程序的行為 151

4.12  集成系統托盤 152

4.13  啟動時隱藏主應用程序菜單 154

4.14  註冊全局鍵盤快捷方式 155

4.15  本章小結 157

第5章  製作2D游戲 159

5.1  技術需求 159

5.2  配置游戲項目 160

5.3  運行Hello World示例 163

5.4  渲染背景圖像 166

5.5  禁止窗口尺寸變化 168

5.6  渲染精靈對象 168

5.7  縮放精靈對象 169

5.8  處理鍵盤輸入 171

5.9  根據方向翻轉飛船對象 173

5.10  控制精靈對象的坐標 174

5.11  控制精靈對象的速度 177

5.12  本章小結 179

第6章  構建音樂播放器 181

6.1  技術需求 181

6.2  創建項目 182

6.3  音樂播放器組件 184

6.3.1  下載音樂文件 185

6.3.2  基本的播放器設置 188

6.3.3  樣式按鈕 192

6.4  播放控制按鈕 195

6.4.1  Stop按鈕 195

6.4.2  靜音和非靜音按鈕 197

6.4.3  音量按鈕 199

6.5  實現歌曲的進度欄 202

6.6  顯示音樂元數據 203

6.7  改進用戶界面 208

6.8  最終的結構 210

6.9  本章小結 213

第7章  分析、Bug跟蹤和許可機制 215

7.1  技術需求 215

7.2  連接分析和跟蹤機制 216

7.3  構建自身方案或使用已有服務 216

7.3.1  創建自己的分析服務 217

7.3.2  使用第三方分析服務 217

7.4  針對Electron應用程序使用Nucleus 218

7.5  創建一個新的Nucleus賬戶 219

7.6  創建基於跟蹤支持的新項目 222

7.7  安裝Nucleus Electron庫 224

7.8  查看實時分析數據 226

7.9  禁用每個用戶請求的跟蹤機制 230

7.10  驗證實時用戶統計結果 231

7.11  支持離線模式 232

7.12  處理應用程序更新 232

7.13  加載全局服務器設置 235

7.14  許可檢查機制和政策 237

7.14.1  創建新策略和許可 237

7.14.2  檢查應用程序中的證書 240

7.15  本章小結 241

第8章  利用Firebase構建群聊應用程序 243

8.1  技術需求 243

8.2  創建一個Angular項目 245

8.3  創建新的Firebase賬戶 248

8.4  創建一個Firebase應用程序 252

8.5  配置Angular Material組件 254

8.5.1  添加Browser Animations模塊 255

8.5.2  配置默認的主題 255

8.5.3  添加Material Icons庫 255

8.5.4  添加導航欄 256

8.5.5  利用材質工具欄測試應用程序 257

8.6  構建登錄對話框 258

8.6.1  實現Material界面 259

8.6.2  錯誤處理機制 261

8.6.3  準備聊天組件占位符 262

8.7  將登錄對話框連接至Firebase Authentication 263

8.7.1  啟用註冊供應商 264

8.7.2  創建示例賬戶 266

8.7.3  集成Login對話框和Firebase 268

8.8  配置實時數據庫 271

8.9  渲染聊天群列表 275

8.10  實現群消息頁面 279

8.11  顯示群消息 281

8.12  發送群消息 285

8.12.1  更新消息列表界面 288

8.12.2  進一步改進 288

8.13  驗證Electron Shell 289

8.14  本章小結 290

第9章  構建eBook編輯器和生成器 291

9.1  技術需求 291

9.2  創建項目結構 292

9.2.1  生成新的React應用程序 292

9.2.2  安裝編輯器組件 293

9.2.3  測試Web應用程序 298

9.2.4  與Electron Shell集成 300

9.3  升級代碼並使用React Hooks 301

9.4  控制鍵盤快捷方式 302

9.4.1  加載文件 303

9.4.2  保存文件 306

9.5  集成應用程序菜單 308

9.6  設置電子書生成器 311

9.6.1  安裝Docker 312

9.6.2  運行Pandoc容器 315

9.6.3  將文檔發送至主進程（Node.js） 317

9.7  從Electron中調用Docker命令 320

9.7.1  將標記文本發送至Node.js進程 320

9.7.2  將標記文本保存至本地磁盤 320

9.8  生成PDF電子書 323

9.9  生成ePub電子書 325

9.10  本章小結 328

第10章  構建桌面數字錢包 329

10.1  技術需求 329

10.2  利用React生成項目 330

10.3  集成Ant Design庫 332

10.4  設置個人以太坊區塊鏈 334

10.5  配置Ethereum JavaScript API 338

10.6  顯示以太坊節點信息 340

10.6.1  獲取節點信息 340

10.6.2  在Header中渲染節點信息 341

10.7  集成應用程序菜單 342

10.8  渲染賬戶列表 344

10.9  顯示賬戶餘額 347

10.10  將以太轉至另一個賬戶中 350

10.11  打包應用程序並發布 355

10.12  本章小結 358