Pages

Subscribe:

Ads 468x60px

Labels

顯示具有 Flash 標籤的文章。 顯示所有文章
顯示具有 Flash 標籤的文章。 顯示所有文章

2013年6月15日 星期六

Stencyl:不懂程式也能寫 iOS 智慧型手機遊戲!

如果是要探討「不會寫程式也能寫遊戲」這種主題的話,像是 RPG 遊戲製作大師、 GAME MAKER 等軟體都可做到。但是如果說製作好的遊戲,不但可以發布成 Flash 的 .swf 檔,甚至還可以發布到 iOS 平台上,那就是 Stencyl 的強項了,未來也可以支援 Android 與 Html5 版本呢!
Stencyl 網址:
Stencyl 強調可輕鬆的製作 iOS 與 Flash 遊戲(未來將會支援 Android 與 html5),甚至不需要會寫程式也能製作遊戲。目前支援在 OS X、Windows 以及 Ubuntu 平台上製作,免費版僅能產生 Flash 的 .swf 檔,如果要產生一般的桌面程式檔案就得付費了,一年的授權是 79 美金(大約 2100 台幣),而如果你要能夠產生能在 iOS 平台上架的話,一年的授權是 149 美金(大約 4500 台幣左右)。以下為筆者簡單的試玩心得。
 
▲ 網站首頁標明了特色,輕鬆的製作 iOS 與 Flash 遊戲!(未來將會支援 Android 與 html5)
 
▲ 免費版僅能產生 Flash 的 .swf 檔,如果要產生一般的桌面程式檔案就得付費了,一年的授權是 79 美金(大約 2100 台幣),而如果你要能夠產生能在 iOS 平台上架的話,一年的授權是 149 美金(大約 4500 台幣左右)。
▲ 將程式免費下載及安裝好後,可以看到在程式的首頁有許多內建的範例與一些已經幫你做好的行為模組。
▲ 這邊是內建的一些範例
▲ 亦有內建好的一些行為模組,可以讓你直接套用不需自己重新刻。
▲ 你也可以點進行為模組,可以看到完整的程式碼,也可以讓你自己調整,或是自己重新設計一個,Scratch-like 的積木設計十分友善。
▲ 場景編輯器有圖層、元件,也可以用內建的場景編輯器自己畫一個。(以下都用內建的 Crash Course Kit 這個來示範。)
▲ 也有兩個角色讓你用,當然也可以自訂,輸入圖像。
▲ 要將行為模組掛上角色也非常方便,直接在行為模組上點右鍵選「Attach Behavior to Actor」,在這邊我們用 Walking 作個示範。
▲ 點了「Attach Behavior to Actor」後就可以選擇你要掛上這個行為模組的角色。
▲ 點擊後就進入設定畫面,首先要設定在「Walking」中有定義的向左走與向右走的按鍵。
▲ 接著設定在 Walking 模組中程式定義的圖像,在這個範例中有左、右、行動中往左、行動中往右。
▲ 製作完畢後在場景中新增角色,然後按「Ctrl+ENTER」就可以測試一番了,試試看往左往右吧!想要輸出選上方「Publish」後選擇 Flash(免費版僅能如此)
製作完成的範例:點我下載
玩了一會,覺得 Stencyl 使用起來較 GameMaker 等軟體來說更為進階,可以設計更深的行為與事件,也可以自己全部重刻。當然最大的賣點還是只要製作好後可以輸出多個平台的功能,期待日後支援 Android 與 HTML5 的到來,那時才更方便測試多平台的支援度。

2013年5月28日 星期二

Jack的資訊教學筆記: arduino和S4A的相關網站


Arduino相關:

S4A相關:

影片教學分享: 

基礎程式、開關與flash動畫控制

int redLed=5;//定義紅色LED燈接在5號Pin腳
int switchPin=2;//定義開關接在2號Pin腳
void setup(){
pinMode(redLed,OUTPUT);//定義紅色LED燈為輸出模式
pinMode(switchPin,INPUT);//定義開關為輸入模式
}
void loop(){
int switchState=digitalRead(switchPin);//定義開關狀態為數位腳位(switchPin)的狀態
if(switchState==HIGH){//如果開關狀態為高電位
digitalWrite(redLed,HIGH);//則紅色LED燈接為高電位(發亮)
}
else{
digitalWrite(redLed,LOW);//要不然紅色LED燈接為低電位(不亮)
}
}
me001
——————————–
Massimo’s Second tutorial
int redLed=5;
int yellowLed=4;
int greenLed=3;
int switchPin=2;
void setup(){
pinMode(redLed,OUTPUT);
pinMode(yellowLed,OUTPUT);
pinMode(greenLed,OUTPUT);
pinMode(switchPin,INPUT);
}
void loop(){
int switchState=digitalRead(switchPin);
if(switchState==LOW){
digitalWrite(redLed,LOW);
digitalWrite(yellowLed,HIGH);
digitalWrite(greenLed,LOW);
delay(250);
digitalWrite(yellowLed,LOW);
digitalWrite(greenLed,HIGH);
delay(250);
}
else{
digitalWrite(yellowLed,LOW);
digitalWrite(redLed,HIGH);
digitalWrite(greenLed,LOW);
}
}
Massimos002_1

int in_pin=8;//定義訊號輸入腳位
int val_a=0;//定義訊號輸入顯示變數, 並且給初始值為0
void setup()
{
pinMode(in_pin,INPUT);
Serial.begin(9600);
}
void loop()
{
val_a=digitalRead(in_pin);
Serial.print (val_a);
Serial.println(0,BYTE);//這部分對Flash很重要,先歸零再將訊號送出
delay(300);
}
basicSignal

Arduino 部分
int readPin=3;//類以比訊號讀取
int rangeIndex=0;
int container=0;
int level=0; //幫訊號分級別的變數
void setup()
{
pinMode(readPin,INPUT);
Serial.begin(9600);
}
void loop()
{
container=analogRead(readPin);//
rangeIndex=container;
delay(100);
if(rangeIndex < = 1023 && rangeIndex > 681 )
{
level=3;
}
else if(rangeIndex < = 680 && rangeIndex > 341 )
{
level=2;
}
else if(rangeIndex < = 340 && rangeIndex > 200 )
{
level=1;
}
else
{
level=0;
}
delay(300);
Serial.print(level);
Serial.println(0,BYTE);
delay(100);
}
Flash 部分
import Arduino;//載入Arduino設定檔
var port:Number = 5333;
//設定Serial Port連接位置 , com1~com4=5331~5334 , 記得對應serproxy的設定檔
var a:Arduino = new Arduino(port);//建立一個Arduino的監聽物件
aListener = new Object();
a.addEventListener(“onConnect",aListener);
a.addEventListener(“onConnectError",aListener);
a.addEventListener(“onDisconnect",aListener);
a.addEventListener(“onReceiveData",aListener);
///////////////////////////////////////
aListener.onConnectError = function()
{
//連線失敗
trace(“Failed");
}
//////////////////////////////////////
aListener.onDisconnect = function()
{
//失去連線
trace(“disconnected");
}
//////////////////////////////////////
aListener.onConnect = function()
{}
//////////////////////////////////////
aListener.onReceiveData = function(evtObj:Object) //主要程式由以下開始
{
var inputData = new int; //宣告一個用來接值的變數
inputData = evtObj.data; //接收Arduino傳過來的數值
trace(inputData);
if(inputData==1){
faceChange.gotoAndStop(“angry");
}
else if(inputData==2)
{
faceChange.gotoAndStop(“smile");
}
else if(inputData==3)
{
faceChange.gotoAndStop (“sad");
}
else
{
stop();
}
}

import Arduino;//載入Arduino設定檔
var port:Number = 5333;
//設定Serial Port連接位置 , com1~com4=5331~5334 , 記得對應serproxy的設定檔
var a:Arduino = new Arduino(port);//建立一個Arduino的監聽物件
aListener = new Object();
a.addEventListener(“onConnect",aListener);
a.addEventListener(“onConnectError",aListener);
a.addEventListener(“onDisconnect",aListener);
a.addEventListener(“onReceiveData",aListener);
///////////////////////////////////////
aListener.onConnectError = function()
{
//連線失敗
trace(“Failed");
}
//////////////////////////////////////
aListener.onDisconnect = function()
{
//失去連線
trace(“disconnected");
}
//////////////////////////////////////
aListener.onConnect = function()
{}
//////////////////////////////////////
aListener.onReceiveData = function(evtObj:Object) //主要程式由以下開始
{
var inputData = new int; //宣告一個用來接值的變數
inputData = evtObj.data; //接收Arduino傳過來的數值
trace(inputData);
if(inputData==1)
{
ball.gotoAndPlay(“start");
}
else
{
stop();
}
}


手感賽車手 Car Racing Game

先用 Processing 寫出遊戲,確定能執從後再連結Arduino做車體的控制,把原先 "上,下,左,右,空白鍵" 轉化為實體互動。此遊戲除了可以連結 Arduino,也能直接用鍵盤玩。
P.S.網頁執行時音效會有點 Leg

零件清單
.Arduino UNO 板子*1
.單心線
.跳線
.光敏電組*2
.水銀開關*3
.電阻*5
.手套*1


 






















遊戲連結:http://justmydesign.sg1005.myweb.hinet.net/2011_Processing/hw11/

P.S.不知為何加入Arduino程式碼後無法在網頁上執行(因為網頁無法讀取Arduino訊號?),所以我放上純Processing的遊戲版本。


遊戲名稱手感賽車手 Car Racing Game  
操作方式:鍵盤 or Arduino  
遊戲步驟:上=加速,下=煞車,左=左轉,右=右轉,空白鍵=發射火焰。遊戲時間有60秒,吃到(+5時鐘)時間額外增加5秒,遊戲結束後玩家的距離分數+射擊分數=總分。


 ====================== 以下為 Arduino 程式 ====================== 
int sensorValueSpace, sensorValueUp;
void setup() {
  for (int i=3; i<=7; i++) pinMode(i, INPUT);
  Serial.begin(9600);
}
void loop() {
  sensorValueSpace = analogRead(A5);
  sensorValueUp = analogRead(A3);
  if (sensorValueUp > 200) Serial.print(1, BYTE);  //1 = 沒按上鍵
  else Serial.print(2, BYTE);  //2 = 按上鍵
  if (digitalRead(4) == LOW) Serial.print(3, BYTE);  //3 = 沒按下鍵
  else Serial.print(4, BYTE);  //4 = 按下鍵
  if (digitalRead(5) == LOW) Serial.print(5, BYTE);  //5 = 沒按左鍵
  else Serial.print(6, BYTE);  //6 = 按左鍵
  if (digitalRead(6) == LOW) Serial.print(7, BYTE);  //7 = 沒按右鍵
  else Serial.print(8, BYTE);  //8 = 按右鍵
  if (sensorValueSpace > 200) Serial.print(9, BYTE);  //9 = 沒按空白鍵
  else Serial.print(10, BYTE);  //10 = 按空白鍵
  delay(100); 
}

資料來源 

Flash互動遊戲-打地鼠 [光敏電阻應用]

小專案(Project,適合入門到中型專案作品)


作者是 ken   
週二, 11 十月 2011 02:40

難度:LV2
類別:Flash + Arduino應用
包含範圍:Flash ActionScript 3.0 + Arduino + MAC平台
使用零件:光敏電阻
電路:
光敏電阻x6, 220歐姆電阻x6
Arduino程式碼:
請使用standardFirmata

2013年5月27日 星期一

Arduino : 用可變電阻控制 Flash 動畫

利用接在 Arduino 上的可變電阻來控制 Flash 上的動畫。如果將一個 10k歐姆的可變電阻的中間那支腳接在 Arduino 的類比輸入腳位上,我們可以得到 0~1023 的值,將這個值傳給串列埠,serproxy 再將它轉給 socket server,Flash 經由 XMLSocket 接收到數值後,我們再把它轉換為角度,藉此來改變物件的角度,可變電阻轉到哪裡,Flash 動畫就動到哪裡。
Arduino 硬體配置圖

可變電阻有三支腳,兩側一支接 Arduino 的 +5v,一支接地,中間的則接在類比輸入的 pin 0 上。


Arduino 程式碼

Arduino 要做的事很簡單,就是將可變電阻的讀數 (0~1023) 往串列埠送就對了。不過,為了減少傳送資料的頻率,我讓它將前一次 pin 0 的值保留下來比對,如果和現在的值變化超過 2 時,才會送往 Serial port。另外,因為 Flash 在連線成功後會送資料給 socket server,因此,可以藉由這個機會,將現在的電阻值傳送給 Flash ,讓它將動畫做初始化的處理,轉到正確的角度。底下為程式碼:

#define potPin  0 //指定讀電阻值的腳位
int val = 0; //放電阻值的變數
int oldVal = 999; //放前一次電阻值的變數
void setup() {
  Serial.begin(115200);         //以 115200 的速度連串列埠
}
void loop() {
  val = analogRead(potPin); //讀取電阻值(0-1023)
  if(Serial.available() > 0)  { //Flash 首次連線會送資料
    Serial.read(); //將 Flash 傳來的資料讀走
    Serial.println(val); //傳回目前的電阻值
    oldVal = val;
  }
  if( abs(val - oldVal) > 2 ) { //如果和前一次差 2 以上才回傳
    Serial.println(val); //傳回目前的電阻值
    oldVal = val; //保留回傳過的
  }
  delay(150);
}


Flash 程式碼

Flash 的部份,只使用到一個影格來完成,主要是一個名為 circle 的元件,利用 XMLSocket 接收由 serproxy socket server 所得到的電阻值,並將它換算成 circel 旋轉時的角度。

程式碼如下:

if(server == undefined) {
server = '127.0.0.1';
}
if(port == undefined || isNaN(Number(port))) {
port = 5334;
} else {
port = Number(port);
}

isConnected = false;
socket = new XMLSocket()
socket.onConnect = function(success) {
if (success) {
statusTxt.text = "conneted";
isConnected = true;
} else {
statusTxt.text = "connet failed!";
isConnected = false;
}
}
socket.onData = function(src) {
statusTxt.text =  "data : " + src;
circle._rotation = Number(src.substr(0,src.length-1))*-360/1023;
//trace("data : " + src);
}
socket.onClose = function() {
statusTxt.text = "disconneted";
isConnected = false;
}

infoTxt.text = "Server:" + server + "   Port:" + port;
socket.connect(server, port);
stop();
轉換電阻大小的程式寫在「socket.onData」中的這行
  • circle._rotation = Number(src.substr(0,src.length-1))*-360/1023;
由於在 Arduino 中傳回的值(src)會在尾巴加上換行字元,為了讓傳回的字串可以順利的轉為數字供運算,我先利用 substr 把最後一個字元截去,才用 Number 來轉換。
另外,為了讓電阻順時針轉動時,Flash 中的元件也是順時針轉動,角度轉換中,將原來的 「360 」度換成了「-360 」度。



Arduino 與Flash 按鈕互動

用 Flash 上的兩個按鈕來控制連接在 Arduino 上的兩顆 LED,當 Flash 的綠色按鈕被按住時,接在 Arduino pin 12 的綠色 LED 就保持亮的狀態,按鈕放開後就熄滅,而 Flash 的紅色按鈕則以同樣的方式來控制接在 Arduino pin 13 上的紅色 LED。

1.設定 serproxy

2.Arduino配置
將紅色 LED 接在 pin 13,而綠色 LED 則是接在 pin 12
Arduino 程式碼

假設當我們在 Flash 中按下綠色按鈕時會送出「G:1」,放開按鈕時會送出「G:0」;而按下紅色按鈕時會送出「R:1」,放開按鈕時會送出「R:0」。serproxy 經由 socket server 收到後,會將字串送往串列埠。Arduino 中接收串列埠資料的函數有以下幾個:

  • Serial.read()
  • Serial.readBytes()
  • Serial.readBytesUntil()

Flash 送給 socket server 的字串都會以 0x00 來結束,我們利用 Serial.readBytesUntil() 就可以讓它用 0x00 來判斷資料是否讀取完畢了。以下是 Arduino 的程式碼:

#define bufferSize   16
#define greenLedPin  12
#define redLedPin    13
void setup() {
  pinMode(greenLedPin, OUTPUT); // declare the greenLedPin as an OUTPUT
  pinMode(redLedPin, OUTPUT); // declare the redLedPin as an OUTPUT
  Serial.begin(115200);
}
void loop() {
  while (Serial.available() > 0) {
    char inBuffer[bufferSize];
    int stringLength;
    stringLength = Serial.readBytesUntil('\0', inBuffer, bufferSize);
    if (stringLength > 0) {
      inBuffer[stringLength] = '\0';
      String inString = String(inBuffer);
      Serial.println(inString);
      if ( inString == "G:1" ) {
          digitalWrite(greenLedPin, HIGH);
      } else  if ( inString ==  "G:0" ) {
          digitalWrite(greenLedPin, LOW);
      } else  if ( inString == "R:1" ) {
          digitalWrite(redLedPin, HIGH);
      } else  if ( inString == "R:0" ) {
          digitalWrite(redLedPin, LOW);
      }
    }
  }
}
3.Flash

Flash 程式碼


Flash 的部份因為我是用 Flash 8 ,AS2 和新版的語法可能有些許不同。主要是利用 XMLSocket 來和 serproxy 所建立的 socket server 來通訊。使用兩個關鍵影格來完成任務。
影格一:

if(server == undefined) {
server = '127.0.0.1';
}
if(port == undefined || isNaN(Number(port))) {
port = 5334;
} else {
port = Number(port);
}

isConnected = false;
socket = new XMLSocket()
socket.onConnect = function(success) {
if (success) {
statusTxt.text = "conneted";
isConnected = true;
} else {
statusTxt.text = "connet failed!";
isConnected = false;
}
}
socket.onData = function(src) {
statusTxt.text =  "data : " + src;
}
socket.onClose = function() {
statusTxt.text = "disconneted";
isConnected = false;
}

主要內容說明如下:

  • socket.onConnect:設定連線成功(失敗)時要進行的動作。
  • socket.onData:設定資料接收完成要進行的動作。
  • socket.onClose:設定斷線後要進行的動作。


影格二:

stop();
infoTxt.text = "Server:" + server + "   Port:" + port;
socket.connect(server, port);
greenButton.onPress = function() {
if( isConnected ) {
socket.send("G:1");
};
}
greenButton.onRelease = function() {
if( isConnected ) {
socket.send("G:0");
};
}
redButton.onPress = function() {
if( isConnected ) {
socket.send("R:1");
};
}
redButton.onRelease = function() {
if( isConnected ) {
socket.send("R:0");
};
}

影格二主要是進行連線,並建立按鈕所要做的動作:

  • socket.connect(server, port):依指定的 IP 及 port (設定影格一)和 socket server 連線。
  • greenButton.onPress、greenButton.onRelease:設定綠色按鈕按下、放開時要進行的動作。
  • redButton.onPress、redButton.onRelease:設定紅色按鈕按下、放開時要進行的動作。

[注意] 由於 Flash 的安全管制,編譯完的 .swf 並無法在本機執行,記得要修改「受信任的位置設定」,將 .swf 的位置加入,不然,啟動 .swf 時只會看到「安全性」警語而無法正常動作。

以上是利用Flash Actionscript 2.0所完成