Thursday, November 27, 2014

04 cvRectangle 正方形的外框

penCV 的畫連續畫線指令



#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <opencv2/opencv.hpp>
#include <iostream>
#include <string.h>
#include <fstream>
using namespace cv;
int main(int argc,char **argv)

int width,height;
if(argc<=1)

std::cout<<"Error:Please Load a picture!"<<std::endl;
return 0;


IplImage *image;
//建立視窗
namedWindow("image",CV_WINDOW_AUTOSIZE);

//讀取圖片
image=cvLoadImage(argv[1]);
width=image->width;
height=image->height;

// 畫出正方形的外框
cvRectangle(image,
cvPoint((width/4),(height/4)),
cvPoint((width/4)*3,(height/4)*3),
CV_RGB(255,0,0),3,CV_AA,1);


cvShowImage("image",image);
waitKey(0);

cvDestroyAllWindows();
cvReleaseImage(&image);
system("pause");
return 0;





Screen Shot 2014-11-27 at 11.29.02 PM



04 cvRectangle 正方形的外框

01 cvLine,畫線

openCV 的畫線指令cvLine


openCV 的畫線指令


void cvLine(CvArr* img, CvPoint pt1, CvPoint pt2, CvScalar color, int thickness=1, int line_type=8, int shift=0 )


參數:


  • img – Image.

  • pt1 – First point of the line segment.

  • pt2 – Second point of the line segment.

  • color – Line color.

  • thickness – Line thickness.

  • lineType – Type of the line: 8 (or omitted) – 8-connected line. 4 – 4-connected line. CV_AA – antialiased line.

  • shift – Number of fractional bits in the point coordinates.


#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <opencv2/opencv.hpp>
#include <iostream>
#include <string.h>
#include <fstream>
using namespace cv;
int main(int argc,char **argv)

int width,height;
if(argc<=1)

std::cout<<"Error:Please Load a picture!"<<std::endl;
return 0;


IplImage *image;
//建立視窗
namedWindow("image",CV_WINDOW_AUTOSIZE);

//讀取圖片
image=cvLoadImage(argv[1]);
width=image->width;
height=image->height;

//畫出紅線
cvLine(image, cvPoint((width/4),(height/4)),
cvPoint((width/4)*3,(height/4)*3),
CV_RGB(255,0,0),3,CV_AA,1);
//畫出綠線
cvLine(image,cvPoint((width/4)*1,(height/4)*3),
cvPoint((width/4)*3,(height/4)),
CV_RGB(0,255,0),3,CV_AA,1);

cvShowImage("image",image);
waitKey(0);

cvDestroyAllWindows();
cvReleaseImage(&image);
system("pause");
return 0;


Screen Shot 2014-11-27 at 11.05.07 PM



01 cvLine,畫線

02 cvPutText文字

openCV 的文字指令 cvPutText文字


[PHP]

#include

#include

#include

#include

#include

#include

using namespace cv;

int main(int argc,char **argv)


int width,height;

if(argc


std::coutwidth;

height=image->height;


CvFont font;

double hScale=1.0;

double vScale=1.0;

int lineWidth=1;

cvInitFont(&font,CV_FONT_HERSHEY_SIMPLEX

[/PHP]


1-16



02 cvPutText文字

01 cvPolyLine,畫線

openCV 的畫線指令

[PHP]

#include

#include

#include

#include

#include

#include

using namespace cv;

int main(int argc,char **argv)


int width,height;

if(argc


std::cout
return 0;


IplImage *image;

//建立視窗

namedWindow("image",CV_WINDOW_AUTOSIZE);


//讀取圖片

image=cvLoadImage(argv[1]);

width=image->width;

height=image->height;


CvPoint PointArray1[6];

CvPoint *PointArray[2]= &PointArray1[0],&PointArray1[3];


PointArray[0][0]=cvPoint((width/6)*1,(height/6)*3);

PointArray[0][1]=cvPoint((width/6)*2,(height/6)*2);

PointArray[0][2]=cvPoint((width/6)*3,(height/6)*2);

PointArray[1][0]=cvPoint((width/6)*4,(height/6)*3);

PointArray[1][1]=cvPoint((width/6)*3,(height/6)*4);

PointArray[1][2]=cvPoint((width/6)*2,(height/6)*4);


int PolyVertexNumber[1]=6;

int BlockNumber=1;


cvPolyLine(image,PointArray,PolyVertexNumber,

1,true,CV_RGB(0,255,0),3,CV_AA,0);


cvShowImage(“image",image);


waitKey(0);


cvDestroyAllWindows();

cvReleaseImage(&image);

system(“pause");

return 0;


[/PHP]


1-15



01 cvPolyLine,畫線

03 CvConvertImage, CV_CVTIMG_FLIP , 上下顛倒

openCV 的圖片上下顛倒



#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <opencv2/opencv.hpp>
#include <iostream>
#include <string.h>
#include <fstream>
using namespace cv;
int main(int argc,char **argv)


if(argc<=1)

std::cout<<"Error:Please Load a picture!"<<std::endl;
return 0;


IplImage *image,*hsv,*mask;
//建立視窗
namedWindow("image",CV_WINDOW_AUTOSIZE);
namedWindow("hsv",CV_WINDOW_AUTOSIZE);

//讀取圖片
image=cvLoadImage(argv[1]);
hsv=cvCreateImage(cvGetSize(image),8,3);
//將顏色RGB轉成HSV 顏色
cvCvtColor(image,hsv,CV_RGB2BGR);
cvShowImage("image",image);
cvShowImage("hsv",hsv);

waitKey(0);

cvDestroyAllWindows();
cvReleaseImage(&image);
cvReleaseImage(&hsv);
system("pause");
return 0;


1-14



03 CvConvertImage, CV_CVTIMG_FLIP , 上下顛倒

02 cvConvertImage , CV_CVTIMG_SWAP_RB 1.2.1 紅色 藍色 顏色互轉

openCV 的顏色轉換API
cvConvertImage , CV_CVTIMG_SWAP_RB 1.2.1 紅色 藍色 顏色互轉



#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <opencv2/opencv.hpp>
#include
#include
#include
using namespace cv;
int main(int argc,char **argv)


if(argc<=1)

std::cout<<"Error:Please Load a picture!"<<std::endl;
return 0;


IplImage *image,*hsv,*mask;
//建立視窗
namedWindow("image",CV_WINDOW_AUTOSIZE);
namedWindow("CV_CVTIMG_SWAP_RB",CV_WINDOW_AUTOSIZE);

//讀取圖片
image=cvLoadImage(argv[1]);
hsv=cvCreateImage(cvGetSize(image),8,3);
cvConvertImage(image,hsv,CV_CVTIMG_SWAP_RB);
cvShowImage("image",image);
cvShowImage("CV_CVTIMG_SWAP_RB",hsv);

waitKey(0);

cvDestroyAllWindows();
cvReleaseImage(&image);
cvReleaseImage(&hsv);
system("pause");
return 0;


1-12



02 cvConvertImage , CV_CVTIMG_SWAP_RB 1.2.1 紅色 藍色 顏色互轉

01 CV_RGB2BGR,BGR 轉RGB

cvtColor( m1,m2, CV_RGB2BGR);

 由於 OpenCV 影像格式為 BGR 排列, 而非一般 圖片的 RGB 排列. 可以透過以下指令轉換格式。



#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <opencv2/opencv.hpp>
#include
#include
#include
using namespace cv;
int main(int argc,char **argv)


if(argc<=1)

std::cout<<"Error:Please Load a picture!"<<std::endl;
return 0;


IplImage *image,*hsv,*mask;
//建立視窗
namedWindow("image",CV_WINDOW_AUTOSIZE);
namedWindow("hsv",CV_WINDOW_AUTOSIZE);

//讀取圖片
image=cvLoadImage(argv[1]);
hsv=cvCreateImage(cvGetSize(image),8,3);
//將顏色RGB轉成HSV 顏色
cvCvtColor(image,hsv,CV_RGB2BGR);
cvShowImage("image",image);
cvShowImage("hsv",hsv);

waitKey(0);

cvDestroyAllWindows();
cvReleaseImage(&image);
cvReleaseImage(&hsv);
system("pause");
return 0;


1-12



01 CV_RGB2BGR,BGR 轉RGB

Saturday, November 22, 2014

05 儲存圖片

使用OpenCV 改變圖片的顏色成為灰色,並將資料儲存在檔案中,以及顯示在畫面上。



#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <opencv2/opencv.hpp>
#include <iostream>
#include <string.h>
#include <fstream>

using namespace cv;

int main( int argc, char** argv )

char* imageName = argv[1];
Mat image;
image = imread( imageName, 1 );
if( argc != 2

編譯時的指令:

g++ main.cpp -o main -I/opt/local/include -L/opt/local/lib -lopencv_core.2.4.10


執行結果:
Screen Shot 2014-11-23 at 1.46.50 PM



05 儲存圖片

03 改變圖片的顏色

使用OpenCV 2 改變圖片的顏色成為灰色

更多顏色的調整, 請在 這裡http://docs.opencv.org/modules/imgproc/doc/miscellaneous_transformations.html



#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <opencv2/opencv.hpp>
#include <iostream>
#include <string.h>
#include <fstream>

using namespace cv;

int main( int argc, char** argv )

char* imageName = argv[1];

Mat image;
image = imread( imageName, 1 );

if( argc != 2



Screen Shot 2014-11-23 at 1.21.18 PM

 


 



03 改變圖片的顏色

04 顯示攝影機WebCam的畫面


#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <iostream>
#include <string.h>
#include <fstream>

using namespace cv;
int main( int argc, char** argv )

VideoCapture cap(0); //開啟攝影機
if(!cap.isOpened()) return -1; //確認攝影機打開
namedWindow("MyCamera",1); //建立一個視窗,名稱為MyCamera
Mat frame; //用矩陣紀錄抓取的每張frame
for(;;)
cap >> frame; //把取得的影像放置到矩陣中
imshow("MyFrame", frame); //建立一個視窗,顯示frame到camera名稱的視窗
if(waitKey(30) >= 0) break; //按鍵就離開程式

system("PAUSE");
return 0;


Screen Shot 2014-11-23 at 12.03.36 PM



04 顯示攝影機WebCam的畫面

Friday, November 21, 2014

02 顯示圖片


#include <opencv2/core/core.hpp>
#include <opencv2/highgui/highgui.hpp>
#include <iostream>

using namespace cv;
using namespace std;

int main( int argc, char** argv )

if( argc != 2)

cout <<" Usage: display_image ImageToLoadAndDisplay" << endl;
return -1;


Mat image;
image = imread(argv[1], CV_LOAD_IMAGE_COLOR); // Read the file

if(! image.data ) // Check for invalid input

cout << "Could not open or find the image" << std::endl ;
return -1;


namedWindow( "Display window", WINDOW_AUTOSIZE );// Create a window for display.
imshow( "Display window", image ); // Show our image inside it.

waitKey(0); // Wait for a keystroke in the window
return 0;



02 顯示圖片

01 OpenCV 安裝方法

資料來源: 這裡



01 OpenCV 安裝方法

Thursday, November 20, 2014

使用Unity3D開發大型遊戲的秘訣?

Unity3D是很棒的工具。但分享些柯老師已經建立了幾個小項目的經驗談,,到目前為止整個開發過程中,我們也看到Unity3D 要注意的部分。Unity3D引擎可以做幫助開發,但更多的是一但用開發過程中容易忽視的問題。

所以,我試圖打聽大的開發團隊的項目是如何工作的,


1)源代碼的版本控制

2)分離場景、遊戲和編輯器,盡量把大型遊戲切成越多小塊越好。


但最近花了很多時間看到unity 會議的所有影片,這裡


影片講的很多地方,是在分享他們在用 Unity3D 實際工作的經驗。

開發團隊Scalable 的PPT 投影片在此


資料來源: http://va.lent.in/so-how-do-teams-work-on-a-big-unity3d-project/


Unity tends to crash building a large project. That’s why they split the game into several projects: entry point project, assets projects, code project.

Entry point project is simple, contains minimum stuff to show loading screen or error screen. Loads asset bundles from asset projects and DLLs from code projects.

Content projects got their copy of DLLs, they are used to export assets to bundles and there are external tools to rebuild assets.

There’s no single source file in Unity projects.

That allows to build custom framework, use namespaces, custom compiler preprocessor and obfuscator (if needed).

But there are problems with this approach like some deeply derived from MonoBehavior classes not showing in Unity3D IDE, harder to debug, etc.

#if preprocessor instructions are used to exclude platform specific code.

Custom GUI with relative sizing and positioning of controls. Saved and loaded using ScriptableObjects.

A lot of external data handled by ScriptableObjects which are serializable, editable like Behaviors and not tied to a GameObject.

Unite 11: Postmortem – Smuggle Truck


ONE project to build for all platforms. I think the project is not large, so they don’t see Unity crash much.

There’s a Level Editor which was used by players to create levels which actually shipped with the release.

Asset Settings tool to configure assets importing parameters for every platform. For example, background textures could be half-size in iPhone builds to increase performance.

Platform Specific properties can be configured with special 1. Behaviors attached to objects. For example, you could specify object’s size depending on whether the project is compiled for iOS or PC.

Custom build process allows them to use the data from 3 and 4 to set needed properties and delete unused assets before the actual build. This ensures that assets from PC build will not go to iOS build increasing its size.

At the end of the presentation they advised to have 2 copies of the project for different build targets if you have a lot of assets. Because converting from PC formats to iOS formats takes a lot of time.

Update: recently they released Multiplatform Toolkit to the Asset Store.


Unite 11: Jagged Alliance Online Engineering for Large Web Player Game


Large games have different problems: automatic builds, light map baking which takes 4 days to complete.

Big monolithic project fails to build. (heh, been there done that)

The project is split in SEVERAL small projects: code libraries, asset project(s). This approach allows to share code between client and server. Unity3D .NET project uses 3.5 and can be referenced from 4.0 server code. Asset projects are compiled into assets bundles to be use with code.

Programmers don’t spend an hour a day waiting for assets to be imported.

Code projects are separate Visual Studio solutions kept outside of Unity3D Assets folder. It allows using namespaces (not for MonoBehaviors though). Also they use Unit Tests with modified SharpUnit framework. There are problems with built-in Unity3D classes.

Shared code between code projects and assets projects are separated in yet another project which is referenced by them as DLL libraries.

Separate VS projects are configured to build DLLs into Temp folder not to be loaded by Unity3D and causing names conflict with existing source files.

There’s an advanced automatic build system which executes light map baking and asset bundles exporting in parallel reducing average build time.

Unite 11: Creating a Browser-ready FPS MMO in Unity Slides


Yet again, nobody uses built-in Unity GUI system.

The game looks really cool q:

There’s a custom interface to build asset bundles.

They use ScriptableObjects which are saved to XML and later loaded from server.

Tools for artists is a key to success.

Unite 11: Intro to Editor Scripting, Unite 12: Advanced Editor Scripting, Unite 13: Advanced Editor Scripting — totally must see if you want to create your own editor tools. Describes how to create custom Behaviors inspectors, drawing dummies in 3D scene and even creating custom editor windows.


Unite 11: SHADOWGUN: Rendering Techniques and Optimization Challenges (PDF) — a lot of low-level details if you want to optimize your game for devices.


Conclusion


Now I have time to think what approach to use: single configurable project, many projects with source inside Unity3D Assets folder or many projects with DLLs in the final Unity3D project. At least this time I got the details.

If you want to improve your team workflow with Unity3D you must spend a day watching these videos one by one. There is a lot of interesting details and what to think about. There’s no silver bullet but there is real world experience which speakers gladly share with you.


團結趨於崩潰建設一個大型項目。這就是為什麼他們分開,比賽進入了幾個項目:入口點的項目,資產項目,代碼項目。

切入點的項目很簡單,包含最小的東西,以顯示加載屏幕或錯誤畫面。負荷資產包從代碼項目的資產項目和DLL。

內容項目得到的DLL的拷貝,它們被用於資產導出到束和有外部工具來重建資產。

有沒有在統一的項目沒有一個單一的源文件。

這使得構建定制的框架,使用命名空間,自定義編譯預處理和混淆器(如果需要)。

但也有問題,像一些從MonoBehavior類沒有顯示在Unity3D IDE深深衍生這種方法,難以調試,等等。

#如果預處理器指令來排除特定於平台的代碼。

自定義GUI相對大小和位置的控制。保存並使用ScriptableObjects加載。

很多通過ScriptableObjects這是可序列化的,可編輯樣行為,而不是依賴於一個遊戲對象處理的外部數據。

團結11:死後 – 走私卡車


一個項目建設的所有平台。我覺得這個項目並不大,所以他們沒有看到統一崩潰了。

還有這是用玩家創造,實際上附帶的版本級別關卡編輯器。

資產設置工具來配置資產導入參數為每個平台。例如,背景紋理可以是半角用於iPhone構建以提高性能。

特定於平台的屬性可以附加到對象的特殊1.行為進行配置。例如,您可以指定對象的大小取決於該項目是否被編譯為iOS或PC。

自定義構建過程使他們能夠使用的數據來自3和4的實際建造之前設置所需的屬性和刪除未使用的資產。這保證了從PC構建的資產不會去的iOS版本增加它的大小。

在演講結束時,他們建議有2份該項目針對不同的構建目標的,如果你有很多的資產。因為從PC格式轉換到iOS格式需要花費大量的時間。

更新:最近他們發布了多平台工具包的資源商店。


凝聚11:鐵血聯盟在線工程的大型網絡遊戲玩家


大型遊戲有不同的問題:自動構建,光映射烘焙這需要4天時間才能完成。

整體大項目構建失敗。 (嘿,在那裡做了)

該項目被分成幾個小項目:代碼庫,資產項目(S)。這種方法允許客戶端和服務器之間共享代碼。 Unity3D.NET項目採用3.5和從4.0服務器代碼中被引用。資產項目被編譯成資產包,以與代碼中使用。

程序員不用每天花一個小時等待資產需要進口。

代碼項目Unity3D Assets文件夾之外保持獨立的Visual Studio解決方案。它允許使用名稱空間(不適用於MonoBehaviors雖然)。此外,他們使用單元測試與修改SharpUnit框架。有問題內置Unity3D類。

代碼的項目和資產項目之間共享代碼是分開的卻是他們所引用的DLL庫的另一個項目。

獨立VS項目被配置來構建DLL文件到臨時文件夾不被Unity3D加載,並造成與現有的源文件名衝突。

還有它執行的光照貼圖烘焙及資產包出口平行平均縮短建造時間一項先進的自動生成系統。

凝聚11:創建一個瀏覽器準備的FPS網絡遊戲在Unity幻燈片


再次,沒有人使用內建的統一GUI系統。

遊戲看起來真的很酷問:

有一個自定義的接口來構建資產包。

他們利用其保存到XML和從服務器加載後ScriptableObjects。

工具藝術家是成功的關鍵。

凝聚11:簡介編輯腳本,攜手12:高級編輯器腳本,攜手13:高級編輯器腳本 – 完全必須看到,如果你想創建自己的編輯器工具。介紹如何創建自定義的行為督察,假人繪製三維場景中,甚至創建自定義編輯器窗口。


團結11:SHADOWGUN:渲染技術和優化的挑戰(PDF) – 很多低級別的細節,如果你想優化你的遊戲設備。


結論


現在我有時間去思考方式使用什麼:單一配置的項目,很多項目源裡面Unity3D Assets文件夾或多個項目,最終Unity3D項目的DLL。至少這一次我得到了詳細信息。

如果你想提高你的團隊的工作流程與Unity3D,你必須花一天的時間觀看這些影片一個接一個。有很多有趣的細節,什麼思考的問題。有沒有靈丹妙藥,但有實際經驗的揚聲器很樂意與大家分享。



使用Unity3D開發大型遊戲的秘訣?

Wednesday, November 19, 2014

convert NSMutableData to NSData

-(NSData*)FunTest


NSMutableData *theData = [NSMutableData data];

char bytesToAppend[5] = 0x01, 0xf0, 0x64, 0x0, 0x6a;

[theData appendBytes:bytesToAppend length:sizeof(bytesToAppend)];

[theData appendBytes:bytesToAppend length:sizeof(bytesToAppend)];

NSData *immutableData = [NSData dataWithData:theData];

return immutableData;



convert NSMutableData to NSData

Convert NSString to int Decimal Value ,iOS



-(void)FunTest
NSString* mDataStaring = @"1234";
NSString *subStr =@"";
NSUInteger tlen=mDataStaring.length;
for(int i=0;i<tlen;i=i+2)
subStr = [mDataStaring substringWithRange:NSMakeRange(i, 2)];
int value=[self Fun_ConvertStringToInt:subStr];
NSLog(@"value=%d\n", value);



-(int)Fun_ConvertStringToInt:(NSString*)iDataStaring
NSData* theData=[self bytesStringToData:iDataStaring];

int *values = [theData bytes];
NSUInteger cnt = [theData length];
return values[0];

-(NSData*)bytesStringToData:(NSString*)bytesString



Screen Shot 2014-11-20 at 10.56.00 AM



Convert NSString to int Decimal Value ,iOS

Sunday, November 16, 2014

cocos2d 影片教學

cocos2d 影片教學


  1. cocos2d 1 download

  2. cocos2d 2 download-js 影片

  3. cocos2d 3 download android ndk 軟體 影片

  4. cocos2d 4 cocos2d-x unzip 解壓縮設定 影片

  5. ocos2d 5 download 和下載  python  影片


  6. cocos2d 6 android Setup 設定安卓系統的開發環境 影片


  7. cocos2d 7 android TestAPP 開發安卓應用程式 影片

  8. cocos2d 8 HelloCpp libcocos2dx 設定android 版本的 libcocos2d-x 函示庫 影片

  9. cocos2d 9 setup sh 建立編譯ocos2d-x的環境設定 影片

  10. cocos2d 10 Cygwin download 在Windows 系統中設定linux 編譯環境 影片

  11. cocos2d 11 PathSetup 路徑設定 教學影片

  12. cocos2d 12 CreateMyCocos2dAPP 建立第一個 Cocos2d-X 的程式 教學影片

 


 


 


 


 



cocos2d 影片教學

Cocos2D-X 課後補充資料

課程 source code



Cocos2D-X 課後補充資料

Support for TMX maps Tiled Map

 



Unity 3D


  • Orthello Pro (2D framework) offers Tiled map support.

  • Tiled Tilemaps library by Karnak Games adds support for Orthogonal TMX maps to Unity, with automatic collision detection.

  • Tiled To Unity is a 3D pipeline for Tiled maps. It uses prefabs as tiles, and can place decorations dynamically on tiles. Supports multiple layers (including object layers).

  • Tiled2Unity exports TMX files to Unity with support for (non-simple) collisions.

  • UniTMX imports TMX files into a mesh.

  • X-UniTMX supports almost all Tiled 0.10 features. Imports TMX/XML files into Sprite Objects or Meshes.

 


AndEngine


Android-java


  • AndroidTMXLoader loads TMX data into an object and renders to an Android Bitmap (limited functionality)

  • libtiled-java port is a port of the libtiled-java to be used on Android phones.

C/C++


  • TMXParser General *.tmx tileset data loader. Intended to be used with TSXParser for external tileset loading. (No internal tileset support)

  • TSXParser General *.tsx tileset data loader. Intended to be used with TMXParser.

  • allegro_tiled integrates Tiled support with Allegro 5.

  • TMX XML and JSON map loader with Allegro5 and SDL2 examples (BSD).

C++


D


  • tiledMap.d simple single-layer and single-tileset example to load a map and its tileset in D language. It also contains basic rendering logic using DSFML

cocos2d


Construct 2 – Scirra


  • Construct 2, since the Beta Release 149, officially supports TMX maps, and importing it by simple dragging the file inside the editor. Official Note

Eclipse


Flash/Flixel


Game Maker


Haskell


Haxe


  • HaxePunk Tiled Loader for HaxePunk

  • HaxeFlixel

  • Flambe Tiled support for Flambe

  • OpenFL “openfl-tiled” is a library, which gives OpenFL developers the ability to use the Tiled Map Editor.

  • OpenFL + Tiled + Flixel Experimental glue to use “openfl-tiled” with HaxeFlixel

HTML5


  • Canvas Engine A framework to create video games in HTML5 Canvas

  • chesterGL A simple WebGL/canvas game library

  • KineticJs-Ext A multi-canvas based game rendering library

  • melonJS A lightweight HTML5 game engine

  • Platypus Engine A robust orthogonal tile game engine with game entity library.

  • sprite.js A game framework for image sprites.

  • TMXjs A JavaScript, jQuery and RequireJS-based TMX (Tile Map XML) parser and renderer.

  • chem-tmx Plugin for chem game engine.

  • GameJs JavaScript library for game programming; a thin wrapper to draw on HTML5 canvas and other useful modules for game development

  • Crafty JavaScript HTML5 Game Engine; supports loading Tiled maps through an external component TiledMapBuilder.

  • Phaser A fast, free and fun open source framework supporting both JavaScript and TypeScript.

indielib-crossplatform


Java


LÖVE / Lua


MOAI SDK / Lua


Microsoft XNA/.NET


  • FlatRedBall Engine TMXGlue tool by Domenic Datti loads TMX maps into the FlatRedBall engine, complete with node networks, pathfinding, and shapecollection support via object layers.

  • TiledMax by Aimee Bailey, a .NET library for parsing TMX maps without dependencies on Windows or XNA

  • TMX Map Loader XNA for Windows Phone 7/8 by Lawrence Li. Ready to use, fully implemented XNA Content Pipeline library for TMX files on Windows Phone 7/8.

  • XTiled by Michael C. Neel and Dylan Wolf, XNA library for loading and rendering TMX maps

  • XNA map loader by Kevin Gadd, extended by Stephen Belanger and Zach Musgrave

  • TiledSharp: Yet another C# TMX importer library, with Tiled 0.9.1 support. TiledSharp is a generic parser which can be used in any framework, but it cannot be used to render the maps.

  • TmxCSharp: Useful for multi-layer orthographic tile engines. No framework dependencies, used with a custom OpenTK tile engine soon to be open source, tested with Tiled 0.8.1 (multiple output formats). MIT license.

  • NTiled: Generic parser for 0.9.1 tiled maps. Available via NuGet.

Monkey X


  • bit.tiled Loads TMX file as objects. Aims to be fully compatible with native TMX files.

  • Diddy is an extensive framework for Monkey X that contains a module for loading and rendering TMX files. Supports orthogonal and isometric maps as both CSV and Base64 (uncompressed).

Node.js


PHP


  • PHP TMX Viewer by sebbu : render the map as an image (allow some modifications as well)

Pike


  • TMX parser: a simple loader for TMX maps (CSV format only).

Python/Pygame


  • Pygame map loader by dr0id

  • PyTMX by Leif Theden (bitcraft)

  • pytmxlib: library for programmatic manipulation of TMX maps

  • tmx.py by Richard Jones, from his 2012 PyCon ‘Introduction to Game Development’ talk.

Python/Pyglet


Ruby


SFML


  • STP (SFML TMX Parser) by edoren

Slick2D


Sprite Kit Framework


  • Kobold Kit is a Sprite Kit game engine with a complete TMX object model (create, load & save TMX maps) and an optimized renderer for orthogonal tilemaps. Isometric support forthcoming.

  • JSTileMap is a lightweight SpriteKit implementation of the TMX format supporting iOS 7 and OS X 10.9 and above.

TERRA Engine (Delphi/Pascal)



Vala


  • librpg A library to load and handle spritesets (own format) and orthogonal TMX maps.

 




Support for TMX maps Tiled Map

Tuesday, November 11, 2014

將Android 投射Mirror到 大電視上

如果你有一台蘋果Apple TV 盒子的話,你可能已經聽說過的Airplay功能,它允許您以無線方式反映在顯示器上您的iOS和Mac OS X設備在Apple TV上的。你可以是照片,影片,電影,

方便讓移動設備的內容,顯示到電視的大屏幕,獲得更好的觀看經驗,

但是,如果你持有Android設備呢?現在,如果你有Android 4.4.2,有一個應用程序,可以讓你流和截屏在你的Android顯示,以蘋果電視:MirrorOp Sender


Screen Shot 2014-11-12 at 3.50.03 PM

參考資料 here



將Android 投射Mirror到 大電視上

Compatibility Test Suite

Screen Shot 2014-11-12 at 3.34.54 PM

references: https://source.android.com/compatibility/cts-intro.html#how-does-the-cts-work



Compatibility Test Suite

20 美金的樹苺派

Raspberry Pi基金會於周一(2014/11/10)推出新版本的Model A+單板電腦,,售價為20美元。


Model A+與Model A一樣都是使用時脈為700MHz的BCM2835應用處理器並配備256MB記憶體,但它的長度只有65mm,小於Model A的86mm,同時也消耗更少的電力。它相容於HAT(Hardware Attached on Top)擴充卡標準,具備40pin的輸出/入(GPIO)接腳,內建micro SD插槽,而且整合了更好的音頻電路,重量只有23公克。


目前Raspberry Pi 家族有:

Model A(25美元)

Model B(35美元)

Model B+(35美元)

Model A+。Model A+


目前可以在此購買Model A+Farnell這裡


Model A+於英國製造,將可透過英國的Farnell與美國的MCM等通路購買,外界認為該版本非常適合低耗電的運算應用。


新創業者Kano推出了基於Raspberry Pi的Kano Kit電腦與程式套件,而Mozilla也宣布將打造支援Raspberry Pi的PiFxOS作業系統。


Screen Shot 2014-11-12 at 2.12.29 PM



20 美金的樹苺派

Wednesday, November 5, 2014

【iFrogLab】 的 ios iBeacon展示

展示功能:


  • iFrogLAB 的 Bluetooth BLE 模組成為Apple iBeacon 的能力

  • 並且可以透過 iOS 來發現iFrogLAB iBeacon

  • 偵測距離遠近,可以同時偵測多個iBeacon。

影片展示



功能效果圖


2014-11-04 16.13.25



【iFrogLab】 的 ios iBeacon展示

【iFrogLab】BLE Aluba 硬體模組 藍芽4.0 ,提供賣場商品資訊功能,並能即時下單

【iFrogLab】BLE Aluba 硬體模組 藍芽4.0 ,提供賣場商品資訊功能,並能即時下單


展示功能:


  • iFrogLAB BLE Aluba 模組成為Apple iBeacon 的能力

  • 當用戶手拿iOS走到商場中,當接近商品時,用戶就能即時知道商品資訊

  • 並且可以即時下單和購買

  • 有後台管理平台,商品資訊、金流、購買運送等機制

範例程式


完整的iOS 範例程式,請在購買後,主動跟服務人員索取。


影片展示



功能效果圖


2014-11-06 11.42.03


2014-11-06 11.42.47


2014-11-06 11.42.38


2014-11-06 11.42.25



【iFrogLab】BLE Aluba 硬體模組 藍芽4.0 ,提供賣場商品資訊功能,並能即時下單

車子都可以用3D 印表機生產

在今年2014/9月 芝加哥國際車展 International Manufacturing Technology Show 2014 (ITMS)

展示了用3D 印表機生產的一台車子,一台花了44小時,就可以生產
Screen Shot 2014-11-06 at 10.28.27 AM


Screen Shot 2014-11-06 at 10.28.18 AM


Screen Shot 2014-11-06 at 10.28.08 AM


Screen Shot 2014-11-06 at 10.28.02 AM

資料來源 這裡



車子都可以用3D 印表機生產

Tuesday, November 4, 2014

簡易3D 設計工具


mxd3d


  • 網址:http://marketplace.mxd3d.com/

  • 簡易程度: 最容易

  • 費用:免費

  • 安裝:網頁免安裝

Screen Shot 2014-11-05 at 1.10.05 PM



01如何使用ios與藍芽4.0 BLE (iFrogLAB iBeacon ) 做iBeacon

iFrogLAB iBeacon 方案與ios原始程式碼 正式版1.0 release


本範例展示:


  • iFrogLAB 的 Bluetooth BLE 模組成為Apple iBeacon 的能力

  • 並且可以透過 iOS 來發現iFrogLAB iBeacon

  • 偵測距離遠近,可以同時偵測多個iBeacon。

iOS 範例程式與原始程式


  • iOS 範例程式與遠使程式碼可以在此下載

購買硬體


  • 可以直接留言,我們的客服人員會馬上跟您接洽

  • 或到我們的線上購物商城 馬上購買

影片展示



功能效果圖


2014-11-04 16.13.25



01如何使用ios與藍芽4.0 BLE (iFrogLAB iBeacon ) 做iBeacon

Sunday, November 2, 2014

柯博文雜貨店

在「Arduino 互動設計專題與實戰,深入Arduino 的全方位指南」 和 「Raspberry Pi 最佳入門與實戰應用 -深入Raspberry Pi 的全方面的指南」的書上市後,接到很多讀者都詢問書中的設備和零件可以在那邊購買的到,所以為了方便讀者,就建立了「柯博文雜貨店」的線上購物的網站,方便以後書和文章如果提到的設備時,各位就可以在此購買取得。


Screen Shot 2014-11-02 at 11.16.50 PM



柯博文雜貨店

1.1Cocos2D-X 介紹


現在到處都看到3C電子產品,圍繞在你的週邊,不管是AndroidiOS是當今智慧型終端的兩大主流平台,還是而網頁、部落格、Facebook的網路,還是在電視機上面玩的 XBox 360, Wii, PS3的次世代遊樂器主機,


如果注意過每個人手上的APP幾乎,都是遊戲居多,也因此您可以看到各大公司已經透過Cocos2d-x 開發出多款受玩家歡迎的遊戲,也期待各位能在新的移動設備遊戲趨勢潮流下,霸佔玩家的荷包。


1-11-1Screen Shot 2014-11-02 at 11.08.09 PM


1-1 cocos2d-x 首頁


1.2Cocos2D-X 特色


Cocos2d-x這幾年快速的崛起,這是因為Cocos2d-x強大的設計能力能讓開發者,在短時間之內把想法,具體轉變成遊戲的開發函示庫,只要透過同一個開發程式,就可以將2D遊戲發設計出來。目前ocos2d家族分成二大類。


1.Cocos2d-x:


用來撰寫Android,IOS,BlackBerry,Bada,Marmalade,Windows,Linux方面的程式,大部分的開發者都專注在AndroidIOS,使用語言為C++,可跨平台,也就是說只要寫一套程式碼就能發佈到google playapp store販賣,免費且開源,使用類別簡單,你只要掌握4個基本類別就能寫出自己的遊戲


Cocos2d-x可以同時在多個平台上:


  • Microsoft WindowsLinux MAC OS X的上面都可以執行。

  • 可執行在蘋果 iPhone / iPad 和 谷歌Android

Screen Shot 2014-11-02 at 11.08.16 PM


1-2 Cocos2d-x完成之後可以發布的平台


2. Cocos2d-js:


Cocos2d-x 的另一個分支Cocos2d-js ,目標是透過Javascript 在網頁上執行,


主要用來撰寫桌上瀏覽器(網頁)的程式,使用語言為javascript,免費且開源。


Cocos2d-js可以同時在多個平台上的網頁執行:


  • WindowsLinux 和、MAC OS X的作業系統平台上的網頁執行。

  • 蘋果 iPhone / iPad 、谷歌Android 的作業系統上的網頁執行。

Screen Shot 2014-11-02 at 11.08.18 PM


1-3Cocos2d-js完成之後可以發布的網頁



下載和安裝Cocos studio

如果你要下載Cocos studio ,請到官方網站http://cocostudio.org/download.html 上,就可以免費下載。


Screen Shot 2014-11-02 at 10.36.32 PM


 


 


點選你要的版本後,就可以下載。


順利下載後,請點該檔案就夠進行安裝。


Screen Shot 2014-11-02 at 10.43.35 PM


請點選 installer.app後,就可會出現Cocos Studio 安裝視窗,請點選install 進行安裝。


Screen Shot 2014-11-02 at 10.45.04 PM


等待整個安裝完畢後,就會出現如下圖所示。


Screen Shot 2014-11-02 at 10.46.54 PM


完成後,請點選complete 按鈕。並且在Applications\Cocos 的路徑中,就會看到Cocos Studio 2.app 的執行程式。


 


Screen Shot 2014-11-02 at 10.56.16 PM



下載和安裝Cocos studio

Saturday, November 1, 2014

台灣樹苺派社群 RaspberryPiTW

台灣樹苺派社群RaspberryPiTW 臉書討論區 開張 這裡

樹苺派的研究、分享與討論的社群,歡迎加入



台灣樹苺派社群 RaspberryPiTW