2010年12月31日 星期五

將displayObject轉成bitmap與bitmapData的工具類

之前寫了一篇displayObject轉成bitmap的文章,最近在整理電腦時,將以前做過的測試整理,因此將其轉成工具類別便於日後使用,程式碼如下:

package com.tools.graphics
{
 import flash.display.Bitmap;
 import flash.display.BitmapData;
 import flash.display.DisplayObject;
 import flash.display.Loader;
 import flash.display.LoaderInfo;

 public class LoaderToBitmap
 {
   /**
    *建構式參數使用一個內隱類,避免使用者建立實體,
    *因為as3不能使用private給予建構式的關係,
    *但是使用者若給予null之後依然會被執行super()的建構式,所以無法避免得很完全。
    */
   public function LoaderToBitmap(dontCreate:DontCreate)
   {
   }

   static public function cloneBitmap(display:DisplayObject):Bitmap
   {
    var bitmap:Bitmap = new Bitmap(cloneBitmapData(display));
    return bitmap;
   }
   
   static public function cloneBitmapData(display:DisplayObject):BitmapData
   {
    var bitMapData:BitmapData = new BitmapData(display.width , display.height);
    bitMapData.draw(display);
    return bitMapData;
   }
 }
}
class DontCreate
{
 public function DontCreate()
 {
 }
}
//在Flex4 SDK環境下,使用範例

2010年10月8日 星期五

個人學習MongoDB後,對於document的認知

(MongoDB官方網站文件也有提到,但文件較分散)

  • A document is the basic unit of data for MongoDB, roughly equivalent to a row in a relational database management system (but much more expressive).
  • Similarly, a collection can be thought of as the schema-free equivalent of a table.
  • A single instance of MongoDB can host multiple independent databases, each of which can have its own collections and permissions.
  • MongoDB comes with a simple but powerful JavaScript shell, which is useful for the administration of MongoDB instances and data manipulation.
  • Every document has a special key, "_id", that is unique across the document’s collection.


collection很好理解但document就字面上有點難理解,但看完Java Driver運作方式後,對document我的認知如下:

MongoDB的document長像是JSON的格式,document在RDBMS上如同是一個row。 


{
    "name" : "MongoDB",
    "type" : "database",
    "count" : 1,
    "info" : { x : 203, y : 102 }
}



在mongoDB java Driver使用上要寫入如上JSON格式資料的語法如下:


//建立最外層key:value,此時還不是完整的parent document
BasicDBObject doc = new BasicDBObject();
doc.put("name", "MongoDB");
doc.put("type", "database"); doc.put("count", 1);

//建立info的sub document
BasicDBObject info = new BasicDBObject();
 info.put("x", 203);
 info.put("y", 102);

//將sub document寫入doc使其成為完整的parent document.
doc.put("info", info);

//將這個完整的parent document插入到collection,這個collection類似RDBMS的table.
coll.insert(doc);

由程式邏輯來理解
我認為由最外層來看這個結構是一個parent document
 {
    "name" : "MongoDB",
    "type" : "database",
    "count" : 1,
    "info" : { x : 203, y : 102 }
 }


//而info的value也是一個document,就是parent document裡再包含了一個sub document.

 { x : 203, y : 102 }



因此整個JSON格式就可以看成是RDBMS裡的一個row,對於想從mongoDB拿資料的程式來說這一個最外層就是一個document,而對於mongoDB自己內部來說內層那個info也是一個document。

從程式邏輯來看能理解MongoDB的資料結構了,但我無法很明白的來敘述這種關係,並且理解也可能有誤解,不過當由程式直接操作來看,document到底是什麼就變得不是那麼重要,有點張無忌學太極拳、劍,最後無招勝有招。

2010年10月7日 星期四

MnogoDB JAVA Driver配置

MongoDB Driver官方頁面
Java Driver下載頁面
本文撰寫時Java Driver最新版本為 Version2.1
Step1.下載MongoDB JAVA Driver

@ubuntu:~/Downloads$ wget http://github.com/downloads/mongodb/mongo-java-driver/mongo-2.1.jar


Step2.建立目錄mongoDriver
於/opt底下建立一個目錄以放置mongo-2.1.jar

@ubuntu:/opt$ sudo mkdir mongoDriver


Step3.將mongo-2.1.jar移至/opt/mongoDriver底下

@ubuntu:~/Downloads$ sudo mv mongo-2.1.jar /opt/mongoDriver/


Step4.開啟Eclipse,開啟一個Java Project
Step5.Libraries中Add External JARs將mongo-2.1.jar加入

//待續

Linux上配置Eclipse

Eclipse官方網址http://www.eclipse.org/
本篇將會下載 Eclipse IDE for Java EE Developers  Linux 64bit
Step1.下載Eclipse for JavaEE  Linux64版本

Step2.解開壓縮
@ubuntu:~/Downloads$ tar xzf eclipse-jee-helios-SR1-linux-gtk-x86_64.tar.gz


Step3.將解開資料夾移到/opt底下
@ubuntu:~/Downloads$ sudo mv eclipse /opt/
Step4.執行eclipse
:~/Downloads$ ./|/opt/eclipse/eclipse


本篇是強迫自己使用Shell命令操作,但在ubuntu下具有桌面環境,可以如下
Step1.直接用fireFox下載,下載完檔案預設上會存放在home下的Downloads目錄裡。
Step2.打開Downloads目錄點擊下載之檔案即可解壓。
Step3.將解壓後之目錄移至/opt底下。
Step4.在eclipse目錄底下有個eclipse執行檔,直接點擊即可開啟eclipse。
Step5.替eclipse建立捷徑在ubuntu桌面上。

2010年10月5日 星期二

mongoDB與MySQL 指令比較

閱讀紀錄
MySQL Program → Mongo Program
  • mysqld  → mongod (啟動DB)
  • mysql    → mongo    (DB連線,進入 Shell操作模式)

MySQL Statement → Mongo Statement
插入 
  • INSERT INTO users VALUES(2,3) →
    db.users.insert({a:2,b:3})

搜尋全部
  • SELECT * FROM users →
    db.users.find()
SELECT0
  • SELECT a,b FROM users →
    db.users.find({},{a:2,b:3})
SELECT1
  • SELECT * FROM users WHERE age=30 →
    db.users.find({age:30})
SELECT2
  • SELECT a,b FROM users WHERE age=30 →
    db.users.find({age:33},{a:2,b:3})


SELECT3
  • SELECT * FROM users WHERE age=30 ORDER BY name → db.users.find({age:33}).sort({name:1})
SELECT4
  • SELECT * FROM users WHERE age>30 →
    db.users.find({'age':{$gt:30}})
SELECT5
  • SELECT * FROM users WHERE age<30 →
    db.users.find({'age':{&lt:30}})
SELECT6
  • SELECT * FROM users ORDER BY name DESC → db.users.find().sort({name:-1})
建立索引
  • CREATE INDEX myindexname ON users(name) → db.users.ensureIndex({name:1})
SELECT命令7
  • SELECT * FROM users WHERE a=1 and b='q' → db.users.find({a:1,b:'q'})
SELECT命令8
  • SELECT * FROM users LIMIT 10 SKIP 20 → db.users.find.limit(10).skip(20)
SELECT命令9
  • SELECT * FROM users LIMIT 1 → db.users.findOne()
SELECT命令10
  • EXPLAIN SELECT * FROM users WHERE z=3 → db.users.find({z:3}).explain()
SELECT命令11
  • SELECT DISTINCT last_name FROM users → db.users.distinct('last_name')
SELECT命令12
  • SELECT COUNT(*y) FROM users → db.users.count()
SELECT命令13
  • SELECT COUNT(*) FROM users where AGE > 30 → db.users.find({age:{'&gt':30}}).count()
SELECT命令14
  • SELECT COUNT(AGE) FROM users → db.users.find({age:{'$exists':true}}).count()
SELECT命令15
  • UPDATE users SET a=1 WHERE b='q' → db.users.update({b:'q'},{$set:{a:1}},false,true)

MongoDB Shell 下的 基本操作指令

(文章來自mongoDB mongo - The interactive章節)
//以下命令都是進入mongoDB Shell環境下使用
//進入Shell用的Linux命令 ./bin/mongo


Special Command Helpers
Non-javascript convenience macros:
Show help
顯示最上層的幫助文件
  • >help
Show help on db methods
顯示(資料庫)db系列命令的幫助文件
  • >db.help()
Show help on collection methods
顯示(集合)myColl系列命令的幫助文件
  • >db.myColl.help()
Print a list of all databases on this server
查詢mongoDB上所有的資料庫
  • >show dbs



Set the db variable to represent usage of dbname on the server
切換資料庫
  • >use [db_name]
Print a list of all collections for current database
顯示所有的collections (mongoDB的collection 類似 MySQL的table)
  • >show collections
Print a list of users for current database
列出當前資料庫用戶
  • >show users
Print most recent profiling operations that took >= 1ms
列出最近的操作?
  • >show profile
Basic Shell Javascript Operations

//未完

MongoDB Starting the Shell

啟動mongodb的Shell環境
  • ./bin/mongo

connects to the [database] on your local machine.
連接本地端機器上的database。
  • ./mongo [database Name]
  • ./mongo testdb


connects to the [database] on 192.168.11.3

指定連接特定位址上的database
  • ./mongo [IP Address]/[database]
  • ./mongo 192.168.11.3/testdb


connects to the foo database on [domainName]
指定連接domainName上的database。
  • ./mongo [domainName]/[database]
  • ./mongo dbserver.mydomain.com/testdb

connects to the [database] on [IP Address] on [port number]
指定IP位址與使用Port number。
  • ./mongo [IP Address]:[Port Number]/[database]
  • ./mongo 192.168.11.3:7000/testbase

2010年10月4日 星期一

Linux配置mongoDB

MongoDB下載頁面
Step1.下載mongoDB
:~Downloads$ wget http://fastdl.mongodb.org/linux/mongodb-linux-x86_64-1.6.3.tgz

Step2.解壓
~Downloads$ tar xzf mongodb-linux-x86_64-1.6.3.tgzls

Step3.更改目錄名稱
~Downloads$ mv mongodb-linux-x86_64-1.6.3 mongodb

Step4.移動資料夾至/opt
~Downloads$sudo mv mongodb /opt

Step5.建立給予mondoDB使用的資料夾
/$ sudo mkdir -p /data/db/
//mongoDB預設使用資料庫路徑為 /data/db
//linux習慣會將常變動資料置放於 /var下,因此可以將data/db移至/var下使用。
Step6.修改資料夾權限
sudo chown [檔案擁有者] [目標對象]
sudo chown jeffrey /data/db
Step7.執行MongoDB
//如此會啟動mongoDB,但需要使用另外一使用者環境,使用不同使用者登入才能操作mongoDB
./opt/mongod --dbpath=/data/db


//如此可在原本使用者環境中開啟mongoDB
 ./mongod --fork  --dbpath=/data/db --logpath=/opt/mongodb/log/mongodb.log --logappend




查詢MongoDB是否運行
  • ps -ef|greap grep mongod
查詢mongodb的Port Number是否運作
  • netstat -an -t|greap grep 28017
mongoDB預設Port是28017,再啟動時可以使用--port來指定使用port

Linux上配置TomCat6.0

連結資料:
Tomcat官網

安裝JDK:
安裝Tomcat前請先安裝好JDK
配置步驟
Step1.下載tomcat6.0
sudo wget http://apache.cdpa.nsysu.edu.tw//tomcat/tomcat-6/v6.0.29/bin/apache-tomcat-6.0.29.tar.gz

版本請依實際下載你所需要版本(這裡用的是Core的版本)

Step2.解壓
sudo tar xvzf apache-tomcat-6.0.29.tar.gz

Step3.目錄更名

sudo mv apache-tomcat-6.0.29 /opt/tomcat6

Step4.啟動tomcat
執行/opt/tomcat/bin/底下的startup.sh
:/opt/tomcat6/bin$ ./startup.sh

//如果執行不起來,就做第五步(檔案群組權限問題)
Step5.修改檔案群組與權限
chgrp [參數] [群組名] [檔案路徑]
  • sudo chgrp -R jeffrey /opt/tomcat

chmod [參數] [檔案權限] [檔案目標]
  • sudo chmod -R 771 /opt/tomcat6

2010年10月3日 星期日

Linux 上配置JAVA JDK

§Linux上配置JDK
Sun JAVA JDK 1.6下載頁
因為已經被Oracle吃掉所以官網改成 Oracle JAVA
Oracle Sun Java SE JDK

JDK 下載點
Java SE Development Kit 6u21
 jdk-6u21-linux-x64-rpm.bin
Java SE Development Kit 6u21
 jdk-6u21-linux-x64.bin

這篇文章是使用jdk-6u21-linux-x64.bin
Step1.下載JDK
用你習慣的方式下載JDK,由於是Ubuntu你可以直接開瀏覽器下載,用瀏覽器直接下載可以在home/Downloads裡看到jdk-6u21-linux-x64這個檔案,你也可在命令列中使用wget命令來下載,如


:~/Downloads$ wget -O jdk-6u21-linux-x64.bin http://cds.sun.com/is-bin/INTERSHOP.enfinity/WFS/CDS-CDS_Developer-Site/en_US/-/USD/VerifyItem-Start/jdk-6u21-linux-x64.bin?BundledLineItemUUID=F6qJ_hCxDsYAAAErUi0F_HEN&OrderID=.VqJ_hCx4egAAAErOS0F_HEN&ProductID=xKiJ_hCySHIAAAEpT7wzBGsB&FileName=/jdk-6u21-linux-x64.bin


wget -O jdk-6u21-linux-x64.bi如此可以將下載後的檔案存成 jdk-6u21-linux-x64.bin

Step2.將檔案移至/opt中
:~/Downloads$ sudo mv jdk-6u21-linux-x64.bin /opt

過程中會問你管理者密碼,輸入後即可搬移


Step3.更改檔案權限

:/opt$ chmod +x jdk-6u21-linux-x64.bin 

Step4.解壓縮
:/opt$ sudo ./ jdk-6u21-linux-x64.bin 


這個檔案執行後會自解壓縮,以上執行完畢可以在opt下看到一個jdk1.6.0_21的資料夾。

Step5.建立Java資料夾
  • :/opt$ sudo mkdir java
Step6.將jdk1.6.0_21移到java資料夾下
此步可以省略,只是個人習慣,方便日後若是有java系列的東西方便放一起管理,例如JRE。
  • /opt$ sudo mv jdk1.6.0_21 java
Step7.設定環境變數
  • :/opt$ sudo nano /etc/profile

  • :/opt$ sudo gedit /etc/profile
在文件最尾端輸入
#java environment 
export JAVA_HOME=/opt/java/jdk1.6.0_21
export CLASSPATH=.:./classes:../classes:$JAVA_HOME/lib:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar
export PATH=$PATH:$JAVA_HOME/bin


Step8.
  • source /etc/profile
Step9.重新啟動Linux

Step10.測試java是否啟動







~$ java -version







參考資料
http://tsjianxin.blog.51cto.com/1309817/355384
http://tw.myblog.yahoo.com/jw!q5yoQbKZG0AAcnvqqbxB/article?mid=16
http://tech.techweb.com.cn/thread-226426-1-1.html
http://doflower.blogspot.com/2009/05/linuxjava-classpath.html
http://freelon.pixnet.net/blog/post/30820017


關於環境變數的profile檔功用可以參考鳥哥網站,鳥哥介紹的很清楚真是功德無量
http://linux.vbird.org/linux_basic/0320bash.php#settings_bashrc

2010年9月8日 星期三

Ubuntu 10.04 install Java6 (apt)

Ubuntu 10.04是預設是使用open java,如果要程式開發還是需要安裝Sun Java,以下是Ubuntu環境安裝Java6的過程記錄。

Step1.
sudo add-apt-repository "deb http://archive.canonical.com/ubuntu lucid partner"

這一行其實就是編輯了apt裡的sources.list
sources.list path
/etc/apt/sources.list

利用文字編輯器打開sources.list,拉到最下方,可以看到sources.list裡面被加入了
"deb http://archive.canonical.com/ubuntu lucid partner"




Step2.更新套件
  • sudo apt-get update
Step3.安裝java jre
  • sudo apt-get install sun-java6-jre sun-java6-plugin
Step4.安裝java jdk
  • sudo apt-get install sun-java6-jdk sun-java6-plugin
Step5.查詢java jdk版本
  • java -version


參考資料
ubunt社群
http://wiki.ubuntu.org.cn/index.php?title=Sun-java6&variant=zh-tw

IT開發者Blog
http://www.dotblogs.com.tw/bowwowxx/archive/2010/06/11/15794.aspx
http://hi.baidu.com/xlmeng1988/blog/item/2dce52ae73ef26f3faed50d2.html
http://askcuix.javaeye.com/blog/178819

2010年8月20日 星期五

Deprecated metadata tag



用法:
[Deprecated("string_describing_deprecation")]
[Deprecated(message="string_describing_deprecation")]
[Deprecated(replacement="string_specifying_replacement")]
[Deprecated(replacement="string_specifying_replacement", since="version_of_replacement")]

原文(引用自adobe flex4 help):
A class or class element marked as deprecated is one which is considered obsolete, and whose use is discouraged in the current release. While the class or class element still works, its use can generate compiler warnings

一個類別或是類別中的項目被標記成Deprecated表示此項目是過時的、廢棄的、不建議使用的,不鼓勵使用在當前的釋出版本。雖然被宣告廢棄的Class或Class中的項目仍然工作,但能讓編譯器產生警告提醒。

The mxmlc command-line compiler supports the show-deprecation-warnings compiler option, which, when true, configures the compiler to issue deprecation warnings when your application uses deprecated elements. The default value is true.

Insert the [Deprecated] metadata tag before a property, method, or class definition to mark that element as deprecated. The [Deprecated] metadata tag has the following options for its syntax when used with a class, property or method:
 
功用:

  • 標記已經廢棄的Class以免誤用,若使用編譯器會出現警告提醒。
範例:
//宣告method已經廢棄,並提示改用建議的method
package com
{
 import spark.components.Group;
 public class MyDeprecatedGroup extends Group
 {
  public function MyDeprecatedGroup()
  {
   super();
  }  
  private var _topGap:Number; 
  //宣告topGap廢棄,並建議使用topPixels
  [Deprecated(replacement="MyDeprecatedGroup.topPixels")] 
  public function set topGap(value:Number):void
  {
   _topGap = value;
  }
  public function get topGap():Number
  {
   return _topGap;
  }
 }
}  
//Application
<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
applicationComplete="application1_applicationCompleteHandler(event)" xmlns:com="com.*"
>
<fx:Script\>
<![CDATA[ 
]]>
</fx:Script>
<com:MyDeprecatedGroup>
 <com:topGap>1.0</com:topGap>  
</com:MyDeprecatedGroup>
</s:Application>   
訊息警告如下圖:
 
 
 
 
 
 

  • Event,Effect,Style,metadata tags也支援 deprecation功能

文件
The [Event], [Effect] and [Style] metadata tags also support deprecation. These tags support the following options for syntax:
 
在Event,Effect,Style的metadata tags中,也都支持deprecation的宣告,用法如下
 
用法
[Event(... , deprecatedMessage="string_describing_deprecation")]
[Event(... , deprecatedReplacement="change2")]
[Event(... , deprecatedReplacement="string_specifying_replacement", deprecatedSince="version_of_replacement")]

DefaultProperty metadata tag


用法:
[DefaultProperty("propertyName")]

原文:
The [DefaultProperty] metadata tag defines the name of the default property of the component when you use the component in an MXML file.

功用說明:
[DefaultProperty]標籤用來定義組件中的預設屬性,對應於MXML標籤檔上使用。

範例:
//這個範例將預設屬性改成selected,原本在toggleButtong上的預設屬性是label。
//myButton.as
package com
{

 import spark.components.ToggleButton;

 [DefaultProperty("selected")]
 public class myButton extends ToggleButton
 {
  public function myButton()
  {
   super();
  }
//mxml設定進來的值在此可以抓到並處理
  override public function set selected(value:Boolean):void
  {
   if(value != super.selected)
   super.selected = value;
  } 

 }

}
//mxml檔中使用ToggleButton與myButton來驗證結果
<s:Group layout="{new VerticalLayout()}">
<s:ToggleButton>true</s:ToggleButton> //預設屬性是label因此會出現true
<com:myButton>true</com:myButton>     //預設屬性是selected因此出現按下
</s:Group>












例外使用的狀況:
The one place where Flex prohibits the use of a default property is when you use the ActionScript class as the root tag of an MXML component. In this situation, you must use child tags to define the property, as the following example shows

主要是說,若是mxml做為根標籤,就無法直接在標籤中輸入文字使用預設值,而是須將改預設值名稱當成mxml標籤來呼叫使用。

當然這就是在說將Class做成mxml組件檔時的情境,範例如下:
//myButtonC.mxml
<?xml version="1.0" encoding="utf-8"?>
<com:myButton xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:com="com.*">
<!--當成root標籤使用時,預設屬性設定改用標籤呼叫設定。-->
 <com:selected>true</com:selected>
</com:myButton> 

而這個組件放於Application上時,依然可以直接設定預設值如下:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
xmlns:com="com.*"
> 
<fx:Script>
<![CDATA[ 
import spark.layouts.VerticalLayout;
]]>
</fx:Script>
<s:Group layout="{new VerticalLayout()}">
<com:myButtonC>true</com:myButtonC>
</s:Group>
</s:Application>


參考
http://help.adobe.com/zh_CN/flex/using/WS2db454920e96a9e51e63e3d11c0bf680e1-7ffe.html

//查詢Creating a default property
http://help.adobe.com/zh_CN/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-79f7.html#WS2db454920e96a9e51e63e3d11c0bf69084-79fa

英文原文引用自adobe flex4 help文件

2010年8月19日 星期四

ArrayElementType Metadata tag


原文:
Using Flex4說明手冊中關於ArrayElementType的說明:
When you define an Array variable in ActionScript, you specify Array as the data type of the variable. However, you cannot specify the data type of the elements of the Array.

當你於ActionScript中定義一個Array變數,你指定Array為資料型態,然而你無法指定Array內項目的資料型態。
(在AS3中Vector可以指定陣列中項目的資料型態,Array本身沒有此項功能)

功用:
To allow the Flex MXML compiler to perform type checking on Array elements, you can use the [ArrayElementType] metadata tag to specify the allowed data type of the Array elements, as the following example shows:

你可以藉由ArrayElementType這個metadata tag讓MXML compiler來檢查Array的項目元素是否為ArrayElementType指定資料格式的項目。

使用範例:
//Class
package com
{ 
 import spark.components.Group;
 public class myGroup extends Group
 {
  public function myGroup()
  {
   super(); 
  } 
  //標籤宣告
  [ArrayElementType("Number")]
  public var myArray:Array; 
 }
}

//mxml檔案中
<com:myGroup id="mg">
<com:myArray>
<fx:int>1.0</fx:int>   //此處會有編譯錯誤警告,因為使用<int>
</com:myArray>
</com:myGroup>   
note:
在mxml中若是對myArray使用非Number的項目就會出像錯誤警告,但是此項功能僅對於MXML標籤有作用,若你使用ActionScript來對myArray來操作,並加入非Number資料型態的項目並不會出像編譯警告。
  •  ArrayElementType("Number")]的宣告對ActionScript直接操作是無效的
//在application Complete事件發生後去操作myArray,並給予非Number的項目,是可以通過編譯的
protected function application1_applicationCompleteHandler(event:FlexEvent):void 
{
 mg.myArray.push( "test" );
}

Flex顯示元件as與mxml之間轉換關係與其繼承實現方式

Flex比較有趣的地方就是顯示組件的.mxml與.as之間觀念轉換,假設我們要繼承一個Button,新的類別名稱為mybutton,置放於package com中,那麼.as檔架構的Class程式碼會如下

package com
{
 import spark.components.Button;
 public class myButton extends Button
 {
  public function myButton()
  {
   super();
  }
  //Override inherited method and properties.
  //Define new method and properties.
  //Custom logic in ActionScript.
 }
}
 

The Flex class hierarchy

Using Flex 章節About custom components

The Flex class hierarchy

 
All visual components are derived from the UIComponent ActionScript class. Flex nonvisual components are also implemented as a class hierarchy in ActionScript. The most commonly used nonvisual classes are the Validator, Formatter, and Effect base classes.


這段文章指出了Flex所有的視覺組件都是以UIComponent為父類,也是Flex開發中所有直接放於畫面上的顯示元件都必須繼承了UIComponent,那麼Flash所使用的顯示元件要如何放於畫面上,就是透由UIComponent來做,將Flash的顯示元件加入UIComponent即可。


如:

Flex set JVM help size

§Flex設定JVM 堆積區大小

在Using Flex4說明文件中提到
The compilers use the Java JRE. As a result, you can also configure settings such as memory allocation and source path with the JVM arguments.


Flex的編譯器需使用JVM來運作,因此,你也可以以設定記憶體配置與源路徑參數用於JVM上。

該設定檔名為jvm.config,該檔位於SDK中的bin底下,如win7會像是
C:\Program Files (x86)\Adobe\Adobe Flash Builder 4\sdks\4.1\bin\jvm.config

2010年8月18日 星期三

保護FMS上的影片內容,Protect video content (Flash Media Server)

基本的兩個方法:
  1. Verify SWF files
  2. RTMPE

Verify SWF files 設定(以windows為例)
  1. 於FMS底下找到[FMS資料夾]\conf\_defaultRoot_\Application.xml
  2. 找到標籤<SWFVerification enabled="false">將其改成<SWFVerification enabled="true"> ,這是啟動SWF驗證功能。
  3. 找到標籤<SWFFolder></SWFFolder>將其改成<SWFFolder>C:\Program Files\Adobe\SWFs</SWFFolder>,裡面的路徑放你自己容易管理的所在位置即可,官方文件上建議使用SWFs作為驗證資料夾名稱,這個資料夾是用來置放驗證的SWF,也就是當你建立一隻SWF檔之後,該SWF檔須複製一份於此資料夾,否則FMS部會允許該SWF檔連線,也就是不再驗證資料夾內的SWF檔都無法使用FMS資源。
使用RTMPE
  1. RTMPE在FMS中是預設啟用的。
  2. 找到標籤<DisallowedProtocols> </DisallowedProtocols>將其設成<DisallowedProtocols>rtmp,rtmps,rtmpt</DisallowedProtocols>,這行是說禁止使用rtmp、rtmps、rtmpt,也就是說只能使用rtmpe協定連線。

深入淺出JAVA,第一章,閱讀筆記

JAVA運作方式


  1. 編寫原始碼文件,原始碼文件以.java為附檔名。
  2. 編譯器編譯原始碼文件。
  3. 產出Bytecode檔案,經編譯產出的bytecode檔,以.class為附檔名。
  4. Virtual Machine讀取執行Bytecode檔。

Class與main
  • 每個Java程式中只能有一個main() Mathod,且每個程式至少都會有一個main與class。
  • 所有Java程式都是由main()開始執行。
public class Example
{
 public static void main(String[] args)
 {
  System.out.println("Hello World!");
 }
}


迴圈結構 while 、do-while 、for
  • 迴圈關鍵在於測試條件(conditional test),測試結果必定是boolean值,ture或false。
  • java的測試條件只接受boolean,若給予非boolean的值會編譯錯誤!與AS3很不同。
  
   int x = 2;
   while(x){}
  • 上述程式片段中,於JAVA中此x是整數,編譯時會發生錯誤,而在AS3中則會以非0值皆為true來運行,因為AS3具有隱含轉換。
條件式分支 if 、if else
int x = 3;
if(x == 3){
 System.out.println("x =3");
}

int value = 3;
if(value ==2){
 //條件測試結果為true時執行
 System.out.println("數值是2");
}else{
 //條件測試結果為false時執行
 System.out.println("數值不是2");
}

Flex3 Embed Font

Flex3中需Embed 字形才能讓文字做旋轉等效果,Flex4中似乎是不需要Embed就可以做出文字旋轉放大的效果,日後查明,先行紀錄Flex3 Embed Font用法。

Flex3中Embed Font

@font-face
{
 src:url("/fonts/MSJH.ttf");
 fontFamily:DIN;
 advancedAntiAliasing: true;
}
.embeddedFontStyle
{
 fontFamily:DIN;
 fontSize:18px;
 color:#CCCCFF;
}

2010年7月2日 星期五

SWF內使用play()當function名稱,在IE8中會出現錯誤

SWF內若有使用到play( ),在IE8中會出現錯誤,因此在flash/flex開發中要注意,不要使用play()當做操作名稱。

SWF在瀏覽器中無法中文輸入問題

在SWF embed code中有一個wmode="Window" 如果wmode不是Window就會造成無法輸入中文。

參數說明:
Window
plays the application in its own rectangular window on a web page. Window indicates that the Flash application has no interaction with HTML layers and is always the topmost item.


Opaque
makes the application hide everything behind it on the page.


Transparent
makes the background of the HTML page show through all the transparent portions of the application and can slow animation performance.

Embed code:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
id="${application}" width="${width}" height="${height}"
codebase=http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab
>
<param name="movie" value="${swf}.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="${bgcolor}" />
<param name="wmode" value="transparent" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="wmode" value="Window">
<embed src="${swf}.swf" quality="high" bgcolor="${bgcolor}"
width="${width}" height="${height}" name="${application}" align="middle"
play="true"
loop="false"
quality="high"
allowScriptAccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage=http://www.adobe.com/go/getflashplayer
wmode="Window"
>
</embed>
</object>

2010年6月30日 星期三

常用名詞

常用名詞
URL:指Server所在
URI:指資源所在
resource:資源
client:客戶端,通常指"人"或"瀏覽器"。
interpret:解譯,指瀏覽器解譯HTML原始碼。
HTML:HyperText Markup Language 超文字標記語言。
HTTP:HyperText Transport Protocol 超文字傳輸協定。
tag:標籤。
status code:狀態碼,指web Server回應的狀態代碼。
request:請求。
response:回應。

just-in-time:即時。
CGI:Common Gateway Interface通用閘道介面,(Web伺服器的輔助應用程式),可以C、Python、PHP、Perl寫成,簡單說就是用來產生動態網頁的應用程式。

Servlet:JAVA寫成的Web伺服器的輔助應用程式。

2010年6月21日 星期一

spark組件排版方式等價於mx常用排版元件

此表列出在Flex3時常用的排版元件,在Flex4時如何等價使用










Canvas在Flex4中的等同用法是,使用Group組件,Goup的屬性layout給予BasicLayout類的實體。

Canvas 等價於 Group with Basicexample:
<Group>
 <s:layout>
  <s:BasicLayout/>
 </s:layout>
  //這裡置放要被排版的顯示組件
 </Group>
或是
<layout="{new BasicLayout( )}">

HBox等價除了Gropu 配合 HorizontalLayout之外還有一個HGroup可以直接使用。
其餘組件皆是相同用法之。

沒有等價於Spreak組件的MX組件

Flex4中若是有等價於MX的Spark組件建議優先使用,因為Spark組件將layout、style、skin抽離,使得組件更靈活,因此在Flex4使用手冊中有建議優先使用,而沒有等價於Spark組件時就繼續使用mx組件。
以下這張表列出沒有等價於Spark的mx組件表。

2010年6月18日 星期五

SWF 安全 crossdomain.xml檔

§SWF 安全性允許拜訪  crossdomain.xml
引言:
 話說有一日小弟將開發好的SWF丟到公司的WebServer上,結果Remote變成無法取回資料了,一查之下才知道原來是Remote服務端沒有設置crossdomain.xml這個檔案,暫時為了測試先將crossdomain.mxl設置成允許所有網域拜訪,事後找了一下adobe的技術手冊,並將其部份整理一下做成筆記,以便日後方便使用。


crossdomain.xml的功能描述:
  • 若要提供您網站伺服器的資料給另一個網域中的 SWF 檔使用,可以在伺服器中建立原則檔。「原則檔」是放置於您伺服器上特定位置中的 XML 檔,這支原則檔即是crossdomain.xml。 
  • 不管是SWF對SWF或是SWF對Remote gatway都必須在其拜訪所在地置放crossdomain.xml檔,以便管理允許由哪個網域來的SWF存取資料。
 crossdomain.xml會影響存取的項目:
  • 點陣圖、聲音、視訊
  • XML與Text檔的載入
  • SWF檔的載入
  • Remote通訊 
下面是一個允許所有網域拜訪,的crossdomain.xml配置範例。
<?xml version="1.0" ?>
 <cross-domain-policy>
   <allow-access-from domain="*" />
  </cross-domain-policy>

簡單的解析Domain工具

§簡易解析domain的tools
在開發專案中,如果swf要提供Embed給其他網站使用,在swf內所要load動作等等的路徑就需要使用絕對路徑,但是若是直接將路徑寫死在開發環境環境中又要改來改去,所以最好的方式就是寫一個能夠解析目前swf所使用的domain為何,因此寫了一個簡單應急的小工具,日後若是有發現更好的方式或是BUG再回頭來補強該篇文章。

//寫一個簡單的工具Class
package com.utils.PathAnalyze
{
 public class DomainPathAnalyze
 {
  /***
  * 解析swf所在domain
  * */
  public function DomainPathAnalyze()
  {
  }

  static public function getDomain(url:String):String
  {
   var count:int = url.length -1;
   for(count ; url.charAt(count) != "/" ; count--)
   {
   }
   return url.slice(0 , count);
  }
 }
}

//可藉由Application的loaderInfo.url取得swf所在網域,然後將此url交由DomainPathAnalyze的靜態方法來取得˙Domain


/*用法*/
DomainPathAnalyze.getDomain(loaderInfo.url);

由於成長之後學習到更好的方式因該改成以下方式將會更有效能。

  static public function getDomain(url:String):String
  {
   var _index:int = url.lastIndex("/");
   return url.slice(0 , index);
  }
 
請參考 http://contest-start.blogspot.com/2011/03/blog-post.html