在Appcelerator中对照片应用过滤器 [英] Apply filters to photos in Appcelerator

查看:202
本文介绍了在Appcelerator中对照片应用过滤器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在Appcelerator中构建一个iOS应用程序,我需要让用户拍照,然后对它们应用一个过滤器(如Instagram)。我怎样才能做到这一点?是否有可能使用任何基于JavaScript的图像过滤器库?



感谢您的所有输入!

解决方案

绝对有可能, http://www.pixastic.com/lib / docs / ,你可以在这里看到一些过滤器。所有这些影响都是通过循环遍历图像数据和逐个处理像素来实现的。这里的难点在于制作(或发现)看起来不错的算法,就像instagram一样。

在instagram中也有一些口罩,像polariod或老电影,像这样: http://www.aviary.com/tutorial .aspx?tutorial = cross_processing& step = 12 。这些都是使用剪贴蒙版应用: https://developer.mozilla.org/samples/ canvas-tutorial / 6_2_canvas_clipping.html 或合并两个图像数据,如下所示: http://www.benbarnett.net/2011/06/02/using-html5-canvas-for-image-masks/



因此,instagram对图像所做的一切,您可以使用canvas。这将是一个电话密集的CPU,但我认为iPhone可以处理它。



一些例子:


I am building an iOS app in Appcelerator and I need to let the user take pictures and then apply a filter to them (like Instagram). How can I achieve this? Is it perhaps possible to use any javascript based image filter library?

Thankful for all input!

解决方案

It is definitely possible, http://www.pixastic.com/lib/docs/ you can see some filters here as an example. All of these affects are achieved by looping over the image data and manipulating the pixels one by one. Hard part here would be making(or finding) the algorithms that would look good, like instagram has.

There are also masks in instagram, which are images like a polariod or old films, like here: http://www.aviary.com/tutorial.aspx?tutorial=cross_processing&step=12 . These are applied using clipping masks : https://developer.mozilla.org/samples/canvas-tutorial/6_2_canvas_clipping.html or merging two images data, like here: http://www.benbarnett.net/2011/06/02/using-html5-canvas-for-image-masks/ .

So all of what instagram does with images, you can do with canvas. It would be cpu intensive on a phone, but i think iPhone can handle it.

Some examples:

这篇关于在Appcelerator中对照片应用过滤器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆