从quickstart开始

1
2
3
4
git clone https://github.com/electron/electron-quick-start
cd electron-quick-start
npm install
npm start

可以看到一个简单的electron桌面程序启动了

Electron中分为两类进程,一类是主进程main,另一类是渲染器进程renderer
主进程只有一个,负责对整个应用的管理,包括后台操作,创建GUI,处理GUI和后台交互操作
主进程无法显示窗口,在主进程中调用BrowserWindow模块才能使用不同的窗口,每个窗口调用格子的渲染器进程来讲页面渲染到窗口中
由于在网页里管理原生GUI资源是非常危险而且容易造成资源泄露,所以在网页调用GUI相关API是不允许的,如果要在网页中使用GUI操作,其相对应的渲染进程必须和主进程进行通讯,请求主进程进行相关GUI操作

工程目录

工程目录如下

1
2
3
4
- index.html
- main.js
- renderer.js
- package.json

package.json声明了启动脚本,和进程的入口

1
2
3
4
5
6
7
8
{
// ...
"main": "main.js",
"scripts": {
"start": "electron ."
},
// ...
}

如果没有声明main,Electron会优先加载index.js

main.js创建窗口和处理系统时间

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// APP生命周期模块 原生浏览器窗口模块
const {app, BrowserWindow} = require('electron')
// 保持一个全局的window引用,当JS被GC window不会自动关闭
let mainWindow
// 创建窗口
function createWindow () {
// 创建浏览器窗口
mainWindow = new BrowserWindow({width: 800, height: 600})
// 加载应用的index.html
mainWindow.loadFile('index.html')
// 打开开发工具
// mainWindow.openDevTools()
mainWindow.on('closed', function () {
// window关闭时取消引用
mainWindow = null
})
}
// Electron完成初始化准备创建窗口时调用
app.on('ready', createWindow)

// 当窗口被关闭,退出
app.on('window-all-closed', function () {
// 判断OS X上,关闭时退出程序
if (process.platform !== 'darwin') {
app.quit()
}
})

app.on('activate', function () {
if (mainWindow === null) {
createWindow()
}
})

下载安装 cmake

http://cmake.org/

下载 opencv

https://opencv.org/releases.html

编译 open cv

download www.opencv.org

open cmake
选择 opencv opencv/build
configure->generate

安装 open cv

1
2
3
cd opencv/build
make
sudo make install

配置 xcode

build setting中添加

1
2
3
header search paths -> /usr/local/include
library search paths -> /usr/local/lib
other linker flags -> add opencv/build/lib/ # 添加所有动态库

为了方便,我们将图片路径以Argument是方式传入Main函数
Product->Scheme->Edit -Scheme>Run->Arguments

#镜像

##查看镜像信息
docker images命令可以列出本地主机上已有的镜像

  • PEPOSITORY 仓库
  • TAG 标签信息
  • ID 唯一ID
  • CREATED 创建时间
  • VIRTUAL SIZE镜像大下
    docker inspect命令可以获取该奖项的详细信息
    返回一个JSON格式的消息,如果只要其中一项内容时,可以使用-f指定参数。
    例如镜像的Architecture信息
    1
    docker inspect -f {{".Architecture"}} ID

##搜寻镜像
使用docker search命令可以搜索远端仓库共享的镜像,默认搜索Docker Hub

##删除镜像
使用docker rmi命令可以删除镜像,命令后可以使标签或ID

##查看所有容器
docker ps -a命令可以看到本机上存在的所有容器

##创建镜像

###基于已有的镜像的容器创建
docker commit 命令 主要选项包括

  • -a --author="" 作者信息
  • -m --message="" 提交信息
  • -p --pause==true 提交时暂停容器运行
    1
    docker commit -m "message" -a "author" id name

###基于本地模板导入
从一个操作西永模板文件导入一个镜像,推介使用OPENVZ下载模板

1
cat ubuntu-14.04-x86_64-minimal.tar.gz | docler import - ubuntu:14.04

###存出和载入镜像

####存入镜像
使用docker save命令

1
docker save -o ubuntu_14.tar unbuntu:14.04

###载入镜像

1
docker load --input unbuntu_14.tar

###上传镜像
doker push命令可以上传镜像到仓库,默认上传到DockerHub上

1
2
docker tag test:latest user/test:latest
docker push user/test:latest

#容器
容器是镜像的一个运行实例,带有额外可写的文件层

##创建容器
docker create新建一个停止状态的容器,可以使用docker start命令启动它

##新建并启动容器
docker run

##使用特权
–privileged

##使用Dokerfile创建镜像
Docker可以使用文本文件Dockerfile来描述镜像从而创建镜像

###基本结构
Dockerfile由命令语句组成,支持#开头的注释
一般而言,Dockerfile分为四部分:基础信息、维护者信息、镜像操作指令和容器启动时执行指令

1
2
3
4
5
6
7
8
9
# 第一行必须是指定基础镜像
FROM ubuntu
# 维护者信息
MAINTAINER user user@email.com
# 镜像指令
RUN echo "test message" >> /etc/test.txt
RUN apt-get update && apt-get install -y nginx
# 容器启动时执行指令
CMD /usr/sbin/nginx

##指令

###1.FROM
FROM :
指定基础镜像

###2.MAINTAINER
MAINTAINER 指定维护者信息

###3.RUN
RUN

RUN echo “root:Docker!” | chpasswd

Homebrew

Mac系统的包管理器

1
ruby -e -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Node

1
brew install node

react-native-cli

1
npm install -g react-native-cli

非必需软件

Watchman

监视文件系统变更的工具

1
brew install watchman

Flow

静态的JS类型检查工具

1
brew install flow

测试

1
2
3
react-native init FirstProject
cd FirstProject
react-native run-ios

##ABI

ABI(Application Binary Interface)应用二进制借口,定义了CPU能够执行的二进制文件的格式规范。
Android支持的CPU架构众多,ABI包括armeabiarmeabi-v7aarm64-v8ax86x86_64mipsmips64

https://developer.android.com/ndk/guides/abis.html#sa

so (shared object)是机器可以直接运行的二进制代码,买个App的so被打包在apk文件的lib/目录下

1
2
3
4
5
6
7
8
9
10
lib
|
├── armeabi
│ └── libmath.so
├── armeabi-v7a
│ └── libmath.so
├── mips
│ └── libmath.so
└── x86
└── libmath.so

使用下面命令可以查看apk支持的abi

1
appt dump bading app.apk | grep abi

##制定ABI生产so

Application.mk文件中指定APP_ABI参数

##Android系统的ABI支持

  • primary ABI当前系统使用的ABI
  • secondary ABI 当前系统支持的其他ABI
    一般情况手机不止支持一个ABI

###查看ABI

  • /system/build.prop中制定了支持的ABI类型,可以在adb shell中查看

    1
    getprop | grep abilist
  • 使用Build.BUPPORTED_ABIS可以获取当前设备支持的ABI列表

    1
    Build.SUPPORTED_ABIS;

在apk安装过程时,Package Manager会扫描整个apk寻找符合下面文件路径格式动态链接库

1
lib/<primary-abi>/lib<name>.so

primary-abi是上面表中的abi的值,name对应的是Android.mk中定义的LOCAL_MODULE的值
如果没有当前primary-abi的so,Package Manager会尝试寻找合适secondary-abi的so文件

1
lib/<secondary-abi>/lib<name>.so

有合适的so文件后,包管理会在改ABI文件下的所有so库全部拷贝到应用的data目录下data/data/<package_name>/lib/

在代码调用so时,如果ABI文件夹下没有提供so文件,运行时会遇到java.lang.UnsatisfiedLinkError

##加载so
System.loadLibrary之传入Android.mk中定义的LOCAL_MODULE的值
System.load这个方法可以动态的加载非apk内置的so,甚至动态下载的so,但是不能加载SD卡中的so

1
System.load("/data/data/<package-name/dir/libmath.so")