2013年5月31日 星期五

「筆記」QC進階筆記1-2

本範透過[mouse]物件以及[javascript]物件,設計了一個簡單常見的互動方式,拖拉矩形。

[draw line]

var first=true;
function (__number x1,__number y1,__number x2,__number y2) 
         main (__number x,__number y,__boolean click )
{
 var result = new Object();
 if(click){
  if(first){
   result.x1=x;
   result.y1=y;
   first=false;
 }
 result.x2=x;
 result.y2=y;
 
 }else {
      first=true;
 }
 return result;
}
在[draw line]的js程式中,有4個輸出,分別是第一個點的(x1,y1)、即第二個點(x2,y2)的座標。


[draw rectangle]

var first=true;
var x1;
var y1;
var x2;
var y2;
function (__number out_x,__number out_y,__number width,__number height) 
         main (__number x,__number y,__boolean click)
{
 var result = new Object();
 if(click){
  if(first){
   x1=x;
   y1=y;
   first=false;
  }
  x2=x;
  y2=y;
  result.out_x=(x1+x2)/2;
  result.out_y=(y1+y2)/2;
  result.width=Math.abs(x1-x2);
  result.height=Math.abs(y1-y2); 
 }else{
 first=true;
 }
 return result;
}
在[draw rectangle]的js程式中,設計了一個繪製矩形的程式,最後會輸出矩形的中心座標(x,y)以及矩形的寬(width)、以及高(height)。


[rect_position]

function (__number x1, __number y1,__number x2, __number y2,__number x3, __number y3,__number x4, __number y4)
 main (__number c_x,__number c_y,__number width,__number height)
{
 var result = new Object();
 result.x1=c_x-width/2;
 result.y1=c_y+height/2;
 
 result.x2=c_x+width/2;
 result.y2=c_y+height/2;
 
 result.x3=c_x+width/2;
 result.y3=c_y-height/2;
 
 result.x4=c_x-width/2;
 result.y4=c_y-height/2;
  
 return result;
}
在[rect_position]程式中,會把矩形的的長寬、中心點等資訊,轉換成四個座標點,分別為(x1,y1)、(x2,y2)、(x3,y4)、(x4,y5)等四點。



(MARCO:NewSquare)

(Main Scence)


ps.本範例須要先安裝 kineme 公司出的[GLTools.plugin]套件。