一只不务正业的程序猿玩出个Processing交互库

processing-android-capture

Lib介绍

这是一个有关 processingandroid 交互的library。通过Android app客户端获取手机的摄像头图像及各类传感器的数据通过局域网WiFi通信socket编程技术发送到processing服务端,服务端接受数据然后进行图像处理、数据应用。

WHY

本是一只程序猿,由于开发android项目需求,无意中发现了processing这门语言,效果真是太赞了,本来打算用它来做ui/animation的,可是它的android的库不是很好,社区维护的又少之又少,也就放弃了使用。

可是它的效果不得不佩服呀,简单的几句代码就可以勾勒出一幅优美的画面,做可视化(我最喜欢做的)又是如此方便,所以就拿processing玩起来了。前段时间做的一个室内地磁导航app,在给大家讲地磁导航原理的时候讲了又讲,可是大家就是不明白,最后用做了一个简单地磁导航原理模拟动画,大家瞬间明白。在不断的尝试后,越来越喜欢这门语言,现在一有空就会拿出来玩玩。手握程序,不仅可以写应用,还可以娱乐、画画,真是给程序猿枯燥的生活添加了一笔别样的色彩(“一只不务正业的程序猿”就这样来了)。哈哈,程序猿也不是你想的那样无趣的,这样的多好啊!

室内导航原理模型

另外,大家都知道在processing里可以写程序直接采用android-mode执行,只要你的电脑中有android-sdk,就可以在android手机上运行,但是大家觉得运行效果如何呢?我只想说还能不能再卡点呀,本来一幅优美的画面,硬生生的给你放成慢动作,还是超慢动作啊。另外,processing foundationprocessing-android 的维护的又很少,所以性能也就不是很令人满意。但是,作为一名android开发者,我认为android手机是个很好的东西啊,凭借它有丰富的传感器摄像头(本文的库就是干)画板以及它的可移动、灵活的特点,既然让它本身执行processing很卡,那为何不让它解放出来,只从它上获取数据,把数据交给processing pc端做处理呢?

12月13日下午1点-3点,来自财新数据可视化实验室的执行总监任远老师OF COURSE给大家进行Live Coding+Music Visualization现场表演!期间,任远老师在做视频和音乐的互动时,即兴的将观众融入到了作品中,用手机将现场的观众录制下来,然后将录制的视频进行播放,通过摄像头和音乐进行了实时的互动,观众成为了live coding的一部分,同时观众也参与了作品的创作。live coding并不是我一个人在写code,而是大家和我一起完成code。 在这个环节中手机正好可以当做这个媒介,如果我可以拿着手机把手机拍摄到的画面可以实时传到processing中处理,而不是先在现场录制一段视屏然后再播放处理这样效果是不是更好呢?

正因为如此,我就决定开发一个processing和android交互的库,供大家来使用,同时,作为一个只用processing从来就没给foundation捐赠过的人,写这样一个lib来为社区做点贡献,这样心里应该会好过点吧。。。

就这样这个库诞生了。我称它为processing-android-capturecapture包括android camera、sensor

废话不多说了,先看看Android App界面,然后给大家撸代码讲解。

Android APP

android客户端 首页
android客户端 首页
android客户端 登录服务器界面(地址为processing 服务端的本地ip地址,pc端cmd进入命令行模式,输入ipconfig即可查看)
android客户端 登录服务器界面(地址为processing 服务端的本地ip地址,pc端cmd进入命令行模式,输入ipconfig即可查看)
android客户端 颜色识别界面
android客户端 颜色识别界面
android客户端 传感器选择界面
android客户端 传感器选择界面

使用方法

  1. 首先你需要在github上去下载processing-android-capture.jar及android客户端app
    android app豌豆荚地址: (http://www.wandoujia.com/apps/com.onlylemi.android.capture)
  2. 在手机上安装app,processing项目中导入jar包到code文件夹下
  3. pde文件中调用。一下分为camerasensor两种情况进行阐释

PAndroidCamera类

  • 获取图像 getCameraImage()
  • 获取颜色 getColor()

  • 导包
// 导包
import com.onlylemi.processing.android.capture.*;
  • 声明(PAndroidCamera类
// 声明
PAndroidCamera ac;
PImage img;
  • setup函数中初始化,并且开启捕捉
void setup() {
    size(720, 480);
    // 初始化对象
    // 参数含义: width 图像的宽
    //           height 图像的高
    //           30 frame速率
    ac = new PAndroidCamera(width, height, 30);
    ac.start();
};
  • draw函数中调用getCameraImage()函数获取图像
void draw() {
    // 获取图像
    img = ac.getCameraImage();
    image(img, 0, 0);
}
void draw(){
    translate(width / 2, height / 2);
    // 获取颜色
    int c = ac.getColor();
    fill(c);
    ellipse(0, 0, 300, 300);
}

至此 PAndroidCamera 类的功能就介绍完毕,具体效果在后面的实例中查看。

PAndroidSensor类

  • 提供Android手机的8大传感器
  • 加速度传感器(PSensorType.TYPE_ACCELEROMETER)
    调用函数getAccelerometerSensorValues()
  • 方向传感器(PSensorType.TYPE_ACCELEROMETER)
    调用函数getOrientationSensorValues()
  • 地磁传感器(PSensorType.TYPE_MAGNETIC_FIELD)
    调用函数getMagneticFieldSensorValues()
  • 陀螺仪传感器(PSensorType.TYPE_GYROSCOPE)
    调用函数getGyroscopeSensorValues()
  • 光线传感器(PSensorType.TYPE_LIGHT)
    调用函数getLightSensorValues()
  • 距离传感器(PSensorType.TYPE_PROXIMITY)
    调用函数getProximitySensorValues()
  • 压力传感器(PSensorType.TYPE_PRESSURE)
    调用函数getPressureSensorValues()
  • 温度传感器(PSensorType.TYPE_TEMPERATURE)
    调用函数getTemperatureSensorValues()

  • 导包
// 导包
import com.onlylemi.processing.android.capture.*;
  • 声明(PAndroidSensor类
// 声明
PAndroidSensor as;
  • setup函数中初始化,并且开启数据捕捉
void setup() {
    size(720, 480);
    background(0);
    // 初始化对象
    // 参数含义: 0 获取数据速率
    as = new PAndroidSensor(0);
    as.start();
}
  • draw函数中调用相应函数进行数据获取(每种传感器数据获得都有两种方式)
void draw() {
    background(0);
    fill(255);
    textSize(15);
    // 每种传感器都有两种方法获取数据
    float[] values1 = as.getAccelerometerSensorValues();
    float[] values1 = as.getSensorValues(PSensorType.TYPE_ACCELEROMETER);

    float[] values2 = as.getOrientationSensorValues();
    float[] values2 = as.getSensorValues(PSensorType.TYPE_ORIENTATION);

    float[] values3 = as.getMagneticFieldSensorValues();
    float[] values3 = as.getSensorValues(PSensorType.TYPE_MAGNETIC_FIELD);

    float[] values4 = as.getGyroscopeSensorValues();
    float[] values4 = as.getSensorValues(PSensorType.TYPE_GYROSCOPE);

    float values5 = as.getLightSensorValues();
    float values5 = as.getSensorValues(PSensorType.TYPE_LIGHT)[0];

    float values6 = as.getProximitySensorValues();
    float values6 = as.getSensorValues(PSensorType.TYPE_PROXIMITY)[0];

    float values7 = as.getPressureSensorValues();
    float[] values7 = as.getSensorValues(PSensorType.TYPE_PRESSURE);

    float values8 = as.getTemperatureSensorValues();
    float values8 = as.getSensorValues(PSensorType.TYPE_TEMPERATURE);
}

至此 PAndroidSensor 类的功能就介绍完毕,具体效果在后面的实例中查看。

具体示例

代码1:https://github.com/onlylemi/processing-android-capture/tree/master/examples/AndroidCamera/PhoneCamera

效果1:


代码2:https://github.com/onlylemi/processing-android-capture/tree/master/examples/AndroidCamera/CameraColor

效果2:


代码3:https://github.com/onlylemi/processing-android-capture/tree/master/examples/AndroidCamera/AccSensor

效果3:


代码4:https://github.com/onlylemi/processing-android-capture/tree/master/examples/AndroidCamera/CameraMusic

效果4:


代码5:https://github.com/onlylemi/processing-android-capture/tree/master/examples/AndroidCamera/CameraPixel
效果5:

END

本篇文章中所有提到的代码都是该lib提供的examples,都可以在github上下载到,因为processing是由java语言实现的,所以整个项目我是采用 IntelliJ IDEA IDE所实现(强烈建议大家使用,写代码so爽),然后再转到processing下的。项目的android客户端使用 Android studio 实现。所有代码都已开源到github上,欢迎大家指导批评。

Lib地址:https://github.com/onlylemi/processing-android-capture
IDEA原项目地址:https://github.com/onlylemi/P5AndroidCapture
Android APP地址:https://github.com/onlylemi/AndroidCapture

CONTACT

Eamil: xiaomi_0623(AT)163.com
Wechat: (AT)xiaomi-0623
Weibo: http://www.weibo.com/xiaomi0623
Github: https://github.com/onlylemi

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,723评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,080评论 2 379
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,604评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,440评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,431评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,499评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,893评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,541评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,751评论 1 296
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,547评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,619评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,320评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,890评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,896评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,137评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,796评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,335评论 2 342

推荐阅读更多精彩内容