2008年12月13日 星期六

《 AS3 》讀取 XML Object 筆記

紀錄  ActionScript 3.0 Cookbook 的程式碼

將自己覺得重要以及常用的十項寫在下面,看看能不能用這些處理些啥事

1. Using Variables
    var username:String = "Bernie";
    var score:int = 1000;
    var example:XML = <gamescore>
                          <username>{username}</username>
                          <score>{score}</score>
                      <gamescore>

2. Using Variables by String
    var str:String = "<gamescore><username>"+username+"</username><score>"+score+"</score><gamescore>"
    var example:XML = new XML(str);

3. Adding Elements to an XML Object
    var example:XML = <example/>;
    example.two = " ";
    example = example.insertChildBefore(example.two, <one/>);
    example = example.insertChildAfter(example.two, <three/>);
    trace(example);

4.Adding Text Nodes to an XML Object
    var example:XML = <example/>;
    // <firstname>Bernie</firstname>
    example.firstname = "Bernie";
    // <test>A,B,C</test>
    example.test = ["A", "B", "C"];

5. Adding Attributes to an XML Element (@ operator)
    var example:XML = <example><someElement/></example>;
    example.someElement.@number = 12.3;
    example.someElement.@string = "example";
    /*
    <example>
        <someelement number="12.3" string="example"/>
    </example>
    */
    trace(example);

##CONTINUE##

6. Reading Elements in an XML Tree
    ar menu:XML = //....pass!
    
    // 多層的Tag(在此為label名稱之Tag)屬性質
    function walk(node:XML):void
    {
        for each(var element:XML in node.elements())
        {
            trace(element.@label);
            walk(element);
        }
    }

7. Finding Elements by Name
    items.items[0].name; // 'name'為Tag名稱
    items.items[1].name;
    book.title.toString(); // 'title'為Tag名稱

8.Removing Elements, Text Nodes, Attributes-1
    var example:XML = 
        <example>
            <fruit color="Red">A</fruit>
            <vegetable color="Green">B</vegetable>
            <dairy color="white">C</dairy>
        </example>;
    delete example.fruit.@color;
    delete example.dairy;
    delete example.vegetable.text()[0];
    /*
    <example>
        <vegetable/>
    </example>
    */
    trace(example);

9.Removing Elements, Text Nodes, Attributes-2
    var example:XML = 
        <example>
            <fruit color="Red" name=Apple"/>
        </example>;
    var attributes:XMLList = example.fruit.@*;
    for(var i:int = attributes.length()-1;i>=0;i--)
    {
        delete attributes[i];
    }
    /*
    <example>
        <fruit/>
    </example>
    */
    trace(example);

10. Loading XML
var loader:URLLoader = new URLLoader();
    loader.dadaFormat = DataFormat.TEXT;
    loader.addEventListener(Event.COMPLETE,handleComplete);
    loader.load(new URLReguest("example.xml"));

    private function handleComplete(event:Event):void
    {
        try{
            var example:XML = new XML(event.target.data);
            trace(example);
        }catch(e:TypeError){
            trace("Couldn't ....");
            trace(e.message);
        }
    }

也好久沒有更新文章了,除了忙推甄之外,專題亦是不可開銷啊!
加緊唸書比較實在,而且唸書或者是實做才會有心得可以放上來呀。

2008年11月26日 星期三

《 Flash 》考驗程式設計師的一個 Flash 遊戲 (light-Bot)



總共有 13 個關卡,你的任務就是要用最精簡的步驟,把機器人送到藍色的地磚上,並且點亮他。

可以試著用你所學過的技巧,重複使用 function,如果你要使用遞迴也不反對,但是並沒有辦法設定條件式讓程式跳出...









(上面是修正原文, 原文是12關, 應該是錯誤的...)

先是在 PTT 的 Flash版看到版主aquarianboy發的文章, 於是手癢就去玩玩看囉

後面兩關真的很難, 但是前面幾關,別怕非常簡單的喔.

以下提供我和依庭的解答(僅供參考)


(第11關, 這是我的解答與依庭的不一樣, 但是皆為"冗贅法"喔)


(第12關卡最久的思考, 這是依庭的解答, 被遮住了)


(第13關蠻Easy的, 一個函式即可搞定)

( 等第13關破完之後, 就會看到此畫面囉)


鍛鍊一下邏輯思考, 非常確定最後三關不是唯一解, 大家分享一下解法也OK

p.s 第11關拿出紙筆做戰, 13關想了一會測試幾個迴圈, 就OK囉

2008年10月7日 星期二

《 AS3 》Alternativa3D 安裝與配置

官方網站
http://alternativaplatform.com/en/

官方文件網頁
http://docs.alternativaplatform.com/dashboard.action

1. 下載
        註冊之後,觀看合約即可下載
        取得 Flash  組件檔案(.swc for 9 & 10)
        用此製作的程式,無法/嚴禁商業使用

2. 安裝與配置
        環境配置官方網站說明
             http://docs.alternativaplatform.com/display/TDEN/Connecting+library
      
        示範(Flash CS3)
            (1) 複製 全部的 .swc 到 C: \ Documents and Settings \ {username} \ Local Settings \ Application Data \ Adobe \ Flash CS3 \ en \ Configuration \ Components \.
            (2) 打開FlashCS3 IDE,將組件視窗打開,拉入元件庫即可。
 
        
3.範例測試
    官方的文件
    http://docs.alternativaplatform.com/display/TDEN/Hello%2C+Alternativa3D

    轉貼程式碼:
package {
import alternativa.engine3d.controllers.CameraController;
import alternativa.engine3d.core.Camera3D;
import alternativa.engine3d.core.Object3D;
import alternativa.engine3d.core.Scene3D;
import alternativa.engine3d.display.View;
import alternativa.engine3d.materials.WireMaterial;
import alternativa.engine3d.primitives.Box;
import alternativa.utils.FPS;

import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;

[SWF(backgroundColor="#000000", frameRate="100")]

public class HelloAlternativa3D extends Sprite {

private var scene:Scene3D;
private var view:View;
private var camera:Camera3D;
private var cameraController:CameraController;
private var box:Box;

public function HelloAlternativa3D() {
addEventListener(Event.ADDED_TO_STAGE, init);
}

public function init(e:Event): void {
removeEventListener(Event.ADDED_TO_STAGE, init);

stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;

// Creating scene
scene = new Scene3D();
scene.root = new Object3D();
box = new Box(100, 100, 100, 3, 3, 3);
box.cloneMaterialToAllSurfaces(new WireMaterial(1, 0xFFFFFF));
scene.root.addChild(box);

// Adding camera and view
camera = new Camera3D();
camera.x = 100;
camera.y = -150;
camera.z = 100;
scene.root.addChild(camera);

view = new View();
addChild(view);
view.camera = camera;

// Connecting camera controller
cameraController = new CameraController(stage);
cameraController.camera = camera;
cameraController.setDefaultBindings();
cameraController.checkCollisions = true;
cameraController.collisionRadius = 20;
cameraController.lookAt(box.coords);
cameraController.controlsEnabled = true;

// FPS display launch
FPS.init(stage);

stage.addEventListener(Event.RESIZE, onResize);
stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
onResize(null);
}

private function onResize(e:Event):void {
view.width = stage.stageWidth;
view.height = stage.stageHeight;
}

private function onEnterFrame(e:Event):void {
// User input processing
cameraController.processInput();
// Scene calculating
scene.calculate();
}
}
}

將背景設為暗色,就會發現成功囉 :D

參考來源:
【Alternativa3D】我的第一个DEMO

2008年9月21日 星期日

《 Ubuntu 》安裝SSH,FTP,Samba,Web Server筆記

一年前為了UNIX課程的Demo,要交的文件
拿了課指組的兩台Server做實驗,因為是Public IP且是行政的電腦
不用擔心啥,哈哈...小瓦有福了,嘿嘿

課程:Unix 系統與應用

以下是安裝3種伺服器的過程和紀錄:
OS:Ubuntu 7.04

1. SSH Server

因為 Ubuntu 不像Fedora Core 7 一樣,安裝完之後會預設的安裝 ssh ,所以為了能夠用安全連線的方式來跟伺服器互動,我們必須手動安裝。

// 這是一個類似 Fedora 的 yum 套件庫,我們採用他來進行安裝
apt-get install ssh

// 因為我們並不是用 tarball 安裝 ssh ,但是還是必須瞭解他的設定檔的路徑。
cd /etc/ssh

// 進入設定檔進行修改部份參數。
vim sshd_config

// 以下僅列出修改的地方:
Port 22 -> Port 8822 // 為了使伺服器安全一點的簡單小步驟。
PermitEmptyPasswords no // 透過 ssh 的人密碼不可為空值。
PermitRootLogin no // 為了更加安全不讓 Root 直接用遠端登入。
PrintMotd yes // 開啟顯示上次登入的訊息。
PrintLastLog yes // 顯示上次登入的訊息。

// 重新啟動
/etc/init.d/ssh restart


##CONTINUE##

2. FTP Server

// 一樣使用套件庫進行網路下載安裝。
apt-get install proftpd

// 設定檔路徑
cd /etc/proftpd/

// 進入設定檔進行修改部份參數。
vim proftpd.conf

// 以下僅列出修改的地方:
DefaultRoot ~ // 每個 FTP 使用者預設到家目錄,其他目錄都不能去。
開放anonymous ftp
// 修改並建立會自動登入到由 ftp 擁有的家目錄(/home/ftp/pub),
// 因名取義是給大家下載東西的地方。 並限定不能上傳檔案只能
// 下載< Limit write >。
// FTP 使用者 修改成 nologin可以安全一點。

// 重新啟動
/etc/init.d/proftpd restart

3. Samba Server

// 使用套件庫進行網路下載samba server安裝。
apt-get install samba

// 安裝該套件可以使系統帳號密碼與samba同步。
apt-get install libpam-smbpass

// 進行詳細得設定
vim /etc/samba/smb.conf

// 以下僅列出修改的地方:
Security = user // 必須以使用者登入。
netbios name // 顯示名稱之用。
Smbpasswd username // 新增Samba使用者密碼(因為系統本來就有該帳號)。
encrypt passwords = true // 密碼必須加密。
obey pam restrictions = yes // 引用安裝的libpam-smbpass套件。
unix password sync = true // 啟動與系統密碼同步機制。

// 針對資料夾做設定:
[public_unit2]
path = /tmp
guest ok = yes
writeable = yes

4. Samba Client

安裝好 SMB 要進行測試,最好的方式就是來一個 Client,所以底下進行一連串的測試動作和設定。

// 安裝該套件。
apt-get install samba-common

// 安裝該套件。
apt-get install samba-client

// 測試指令
smbclient '//IP or Domain Name/Partion' -U Username

5. Unix & Samba 密碼同步

vim /etc/pam.d/common-password
// 增加 password sufficient pam_smbpass.so audit use_first_pass

6. Apache Server(Web Server)

參閱 TKWU 老師的 Tarball 安裝方式這邊省略。亦可參閱本站文章


7. 參考資料
1) Linux Fedora Core 4 實務應用 旗標出版
2) 鳥哥的私房菜 SAMBA 伺服器的基礎設定
3) Chinson's phpBB 討論區 Debian GNU/Linux 的筆記


8. 轉載,請註明出處以及文章連結

2008年8月30日 星期六

《 AS3 》Papervision3D using BasicView

PV3D 建立場景還要放入那麼多變數多麻煩

參考 BasicView.as 建構子


// 這是它幫我們搞定的pv3d物件
scene = new Scene3D();
viewport = new Viewport3D(viewportWidth, viewportHeight, scaleToStage,interactive);
addChild(viewport);
renderer = new BasicRenderEngine();

// 攝影機型態,預設是 Target
switch(cameraType)
{
case CameraType.DEBUG:
_camera = new DebugCamera3D(viewport);
break;
case CameraType.TARGET:
_camera = new Camera3D(60);
_camera.target = DisplayObject3D.ZERO;
break;
case CameraType.FREE:
default:
_camera = new Camera3D(60);
break;
}


如何使用 BasicView


// 產生物件
basicView = new BasicView(800, 600, false, false);

// 添增
addChild(basicView);

// 叫 BasicView 的 pv3d 變數,用 '.' 即可
basicView.camera.z = -500;

// 最後,每次更新場景一定要呼叫的函式
basicView.singleRender();


基本上,差距大約 10 多行程式碼而已(包含 import)
如果不嫌棄打字的話呢,就多打這些是ok的啦!

快速Demo展示東西的話,BasicView 應該會更方便優 :)

《 VR 》出神入化的進階應用

資料來源:創新使用者互動介面研究 (UIUI)

Media Interaction Lab 這個位於奧地利的 Lab

結合虛擬以及實體的骨牌遊戲



結合虛擬跟實體的檔案管理



##CONTINUE##

Fez: 2d+3D 全新的遊戲體驗



Adaptive Path: 未來網路介面


Aurora (Part 1) from Adaptive Path on Vimeo.


Aurora (Part 2) from Adaptive Path on Vimeo.


Aurora (Part 3) from Adaptive Path on Vimeo.


Aurora (Part 4) from Adaptive Path on Vimeo.

2008年8月29日 星期五

《 AR 》新 UI 準備走入家庭

部落格好久沒文章了說

在這邊轉貼一下在創新使用者互動介面研究 (UIUI)看到的文章

皆是擴增虛擬實境的應用例子,不過想要玩AR還是先把VR搞好囉

這樣才有機會著手開發 AR 的遊戲,不是嗎?

EyePet

應用「擴增實境(Augmented Reality)」技術所製作的遊戲,透過 PS Eye 視訊攝影機結合現實環境與虛擬角色,讓玩家輕鬆無負擔的飼養虛擬寵物



Levelhead 的虛擬實境遊戲

讓假人在方塊之中遊走


levelHead v1.0, 3 cube speed-run (spoiler!) from Julian Oliver on Vimeo

##CONTINUE##

ARToolWorks: iPhone



對資訊科技產品走入家庭抱著期待

想著以後不用買電視,一個投影就會跑出 Mutil-Touch 的投射面

接著可以用手再上面運作家中所有的家電運作,

這也變成一個超大螢幕,以後的電腦就主機擺角落(最好是安全一點的角落)

一手掌握全世界應該是現代人都想要的吧!

以後也不用 Wii 啦,一個人在 AR 空間遊走

自行感測手的運作再回傳訊號給電腦

恩....

還是別想太多囉... :D

ARToolKit
http://www.hitl.washington.edu/artoolkit/

2008年6月22日 星期日

《 AS3 》Flash Panorama Game with Papervision3D

前陣子裝了 Papervision3D 來玩看看
當時連 ActionScript 都不知道是啥,就硬是要整合在一起做出一些作品


作品內含物:
  1. ActionScript 3.0
  2. Papervision3D 2.0 Great White
  3. AsWing
  4. Adobe FlashCS3
  5. Panorama Tech.
其他成份:
  1. 故事大綱
  2. 物件互動設計
參考來源:

在網路上搜啊搜著的找到這個 QTVR Like Panorama with Flash and Papervision3D for NBC and The Office 和我們想呈現的效果雷同,於是大致上看了一下此篇大作。

後記:

用 FlashCS3 為 IDE,組合 AS3 與 PV3D 和 AsWing。物件互動的設計皆利用 MovieClip去繪製,再添加到平面的場景,由於平面和三維的場景可以互相搭配,以至於整個 Project 的核心在於物件互動的對話和程式之中,PV3D 這大咖的傢伙僅用到環景,互動物件平面,滑鼠控制等。用這個 Project 入門瞭解 3D Scence 的應用可能性,算是對我們一個好的方式。

還需要再看多一點 API 並自己亂 Try 才會作特殊的效果 :XD

2008年6月2日 星期一

《 Network 》VLSM ClassC Subnet Example

此篇文章為:練習 VLSM 切割網路與 Router 設定

繼上一篇文章《 Network 》Cisco Router Basic Setup 的圖一架構
有三個 LAN 分別位於三個 Router 之內,由左至右為 LAN A, B, C
分別需要 Host 數目為:10, 54, 72,而 WAN 各需要 2 個
而單位申請到的 IP 為:163.23.199.0/24 之網路位址

1. 切割子網路
根據主機需求去切割,結果請參考 Google 文件 (這裡不重複張貼)

2. 用 Packet Tracer 架構出網路,並對硬體設備設定完成

設定 Router name


// enable 進到特權模式
Router>enable
// 進到全域編輯模式
Router#configure terminal
// 設定新名稱
Router(config)#hostname HSR1



設定 IP Address


// 名稱馬上變了喔,選擇某個欲設定之介面
HSR1(config)#interface serial0/3/0
// 設定新的 IP,若是設定錯誤,請用 no ip address 163.23.199.209 255.255.255.252 取消
HSR1(config-if)#ip address 163.23.199.209 255.255.255.252
// 若是 DCE 端需要設定 Clock Rate 控制的是傳輸速度
HSR1(config-if)#clock rate 64000
// 啟動介面,通常 WAN 需要,Eathernet 不用
HSR1(config-if)#no shutdown
HSR1(config-if)#exit



設定和啟動路由協定


// 啟用 Router RIP 協定
HSR1(config)#router rip
// 啟動模式為 Version 2 - Classless
HSR1(config-router)#version 2
// 設定 Router 附近接的網域為何:僅需輸入該網域最大之網路位址
HSR1(config-router)#network 163.23.199.0



其他步驟將LAN中的電腦網路設定完成之後就完成了

3. 對該網路架構進行測試

沒問題之後,表示『恭喜!您已經完成設定』

指導教授:TKWU@im.ncue.edu.tw

2008年5月20日 星期二

《 Network 》Cisco Router Basic Setup

首先是認識 Cisco Router 的設定方式:
  1. Console ( using Roll-over )
  2. Telnet/SSH
  3. AUX port ( Auxiliary Port )

以上是必要知道的知識,接下來就用 Packet Tracer 模擬環境和操作設定

用 Packet Tracer 架構此網路環境(如圖一)

圖一,網路架構

注意要點:

  • 路由器要安裝 WAN 介面模組,要如何選擇必須是公司網路狀況
  • 必須知道硬體設備之間的網路線要用哪一種
  • 知道 DCE,DTE。DCE 端的 Router 要設定 Clock Rate

假設網路環境需要如此設定如圖二)

圖二,網路設定(點擊放大)

操作要點:

  • 設定 Router name
  • 設定 IP Address
  • 設定和啟動路由協定
  • 檢示路由表
##CONTINUE##

設定 Router name


// enable 進到特權模式
Router>enable
// 進到全域編輯模式
Router#configure terminal
// 設定新名稱
Router(config)#hostname HSR1


設定 IP Address


// 名稱馬上變了喔,選擇某個欲設定之介面
HSR1(config)#interface serial0/3/0
// 設定新的 IP,若是設定錯誤,請用 no ip address 10.1.1.254 255.255.255.0取消
HSR1(config-if)#ip address 10.1.1.254 255.255.255.0
// 啟動介面,通常 WAN 需要,Eathernet 不用
HSR1(config-if)#no shutdown
// 若是 DCE 端需要設定 Clock Rate 控制的是傳輸速度
HSR1(config-if)#clock rate 72000
HSR1(config-if)#exit


設定和啟動路由協定


// 啟用 Router RIP 協定
HSR1(config)#router rip
// 設定 Router 附近接的網域為何
HSR1(config-router)#network 10.1.1.0
HSR1(config-router)#network 10.3.1.0


檢示路由表


HSR1#show ip route


檢查路由器設定


// 在路由器
HSR1#show running-config
// 在一般電腦,假設 pc 之 ip 為 10.3.1.32
pc>tracert 10.5.1.32



我用 Packet Tracer 依照圖二的設定,做出來檔案分享:
[ 檔案一 ]-在學校做的,[ 檔案二 ]-在家做的

指導教授:TKWU@im.ncue.edu.tw

2008年5月14日 星期三

《 PHP 》擷取中文字串發生的斷字問題


  1. big5 編碼字串


  2. //擷取字串前幾個字並避免截掉半個中文字,$strlen要擷取的字串長度
    function CuttingStr($str,$strlen) {
    if(strlen($str) > $strlen) {
    for($i=0;$i<$strlen;$i++) {
    $ch=substr($str,$i,1);
    if(ord($ch)>127) $i++;
    }
    $str= substr($str,0,$i);
    }
    return $str;
    }



  3. utf-8 編碼字串


  4. //擷取字串前幾個字並避免截掉半個中文字,$strlen要擷取的字串長度(以英文字母數計算,中文字需算二個字數)
    //此處直接傳入從資料庫讀出之UTF-8編碼字串
    function CuttingStr($str, $strlen) {
    //把' '先轉成空白
    $str = str_replace(' ', ' ', $str);

    $output_str_len = 0; //累計要輸出的擷取字串長度
    $output_str = ''; //要輸出的擷取字串

    //逐一讀出原始字串每一個字元
    for($i=0; $i //擷取字數已達到要擷取的字串長度,跳出回圈
    if($output_str_len >= $strlen){
    break;
    }

    //取得目前字元的ASCII碼
    $str_bit = ord(substr($str, $i, 1));

    if($str_bit < 128) {
    //ASCII碼小於 128 為英文或數字字符
    $output_str_len += 1; //累計要輸出的擷取字串長度,英文字母算一個字數
    $output_str .= substr($str, $i, 1); //要輸出的擷取字串

    }elseif($str_bit > 191 && $str_bit < 224) {
    //第一字節為落於192~223的utf8的中文字(表示該中文為由2個字節所組成utf8中文字)
    $output_str_len += 2; //累計要輸出的擷取字串長度,中文字需算二個字數
    $output_str .= substr($str, $i, 2); //要輸出的擷取字串
    $i++;

    }elseif($str_bit > 223 && $str_bit < 240) {
    //第一字節為落於223~239的utf8的中文字(表示該中文為由3個字節所組成的utf8中文字)
    $output_str_len += 2; //累計要輸出的擷取字串長度,中文字需算二個字數
    $output_str .= substr($str, $i, 3); //要輸出的擷取字串
    $i+=2;

    }elseif($str_bit > 239 && $str_bit < 248) {
    //第一字節為落於240~247的utf8的中文字(表示該中文為由4個字節所組成的utf8中文字)
    $output_str_len += 2; //累計要輸出的擷取字串長度,中文字需算二個字數
    $output_str .= substr($str, $i, 4); //要輸出的擷取字串
    $i+=3;
    }
    }

    //要輸出的擷取字串為空白時,輸出原始字串
    return ($output_str == '') ? $str : $output_str;
    }



  5. 使用 PHP5 新增加的函式


  6. //取得 utf-8 編碼的字串長度,這裡共 8 個字
    echo iconv_strlen('無標題文件abc', 'utf-8');
    //取得 utf-8 編碼的子字串,指定 從 0 開始取 20個字,結果是 "無標題文件1無標題文件2無標題文件3無標"
    echo iconv_substr('無標題文件1無標題文件2無標題文件3無標題文件4無標題文件5', 0, 20, 'utf-8');


2008年4月19日 星期六

《 Adobe 》Prepare to be a Flasher

Flash 和 ActionScript 對我來說都是剛開啟起步而已

整理了一下我認為玩好 Flash 需要的幾個技巧和工具:

  1. SWFObject: Javascript Flash Player detection and embed script
    • 官方網站:http://blog.deconcept.com/swfobject/
    • 我記得曾經用過這個 JavaScript 來裝 SWF,現在雖然找不到那作品。好東西當然要分享啦,況且在James' fantasy 的部落格文章中看到說 IE ActiveX 有啥米技術問題存在著,看來這 code 會對 Flasher有很大的幫助喔!
    • 使用說明:在網頁裡面輸入這些喔,不要忘記加一個<div id="flashcontent"></div>給 JavaScript 中的Flash使用捏~


      <script type="text/javascript" src="swfobject.js"></script>

      <div id="flashcontent">
      This text is replaced by the Flash movie.
      </div>

      <script type="text/javascript">
      var so = new SWFObject("movie.swf", "mymovie", "400", "200", "8", "#336699");
      so.write("flashcontent");
      </script>


  2. Sothink SWF Decompiler
    • 官方網站:http://www.sothink.com/product/flashdecompiler/download.htm
    • 說明:可以將 SWF 轉成 FLA,至於其他用法我就不清楚了,但是如果要把 ActionScript 也轉出來,可能不行的樣子,至少我試了的結果是如此,可能還要在觀察一下喔。
    • 我記得神魂顛倒是個正當的大站,但是出現了這個文章可以下載這軟體(可能要小聲的說吧!不然會被 OOXX.....)
  3. OOP Languages
    • 對於學過物件導向語言的人來說,可以馬上進入狀況,這點我到是蠻喜歡的耶,雖然我不是學的很好,但是 Flash 跟網頁一樣"所見即所的"效果,讓我想要墮入他的愛河(咦,我回高雄了啊?哈哈 :) )
    • 因為 Adobe Flash CS3 和 ActionScript 語言的進化,使得程式人可以掌握更深,美工者可能就開始卻步,不怎麼準啦,因為每個人不一樣咩,努力就好啦。

最近沒發什麼文章,潛在 Flash 3D Engine 的懷抱中,改天一定要打筆記給打來。另外,我還要去加強美工的技巧,嗚嗚....對我來說有點難度

希望下一篇會是 ActionScript 成果分享,上次說得 YWE 已經轉換戰場了,我想應該是暫停研究吧,等轉戰到 RIA 之時在一起拿出來玩玩看囉。

2008年3月15日 星期六

製作 7 zip 自解壓縮檔(.exe)

7-Zip 主要特性
  • 更新了壓縮演算法來加大 7z 格式 的壓縮比
  • 7-Zip 是基於 GNU LGPL 之下發佈的軟體
  • 支援格式:
    • 壓縮及解壓縮:7z、ZIP、GZIP、BZIP2 和 TAR
    • 解壓縮:RAR、CAB、ISO、ARJ、LZH、CHM、WIM、Z、CPIO、RPM、DEB和NSIS
  • 對於 ZIP 及 GZIP 格式,7-Zip 能提供比使用 PKZip 及 WinZip 高 2-10% 的壓縮比
  • 7z 格式自解壓縮檔(SFX)
  • 整合 Windows Shell
  • 强大的的檔案管理
  • 强大的命令列版本
  • 支持 FAR Manager 外掛
  • 支持 69 種語言
基於官方網站的介紹和理由說明之後,大部分的人都會選擇多裝
這一套俗又大碗的軟體了啦,那就應該來好好使用他囉。

壓縮軟體許許多多,各家有各家的說詞和演算法撐場面等等的。
不過我想最常用的步驟莫非是"自我解壓縮"的格式囉(就是 .exe 執行檔啦)
點兩下就解完全部的資訊,實在是跟朋友分享檔案的時候很方便的壓箱寶耶。

不過,.................用 WinRAR 的記憶還在嗎?喚醒一下好了 :)
或許常常用到,但是卻一時想不起來吧!

























以上是用 WinRAR 製作 .exe 封裝的設定,似乎有印象了對吧!

那 7 Zip 的呢?以下是完整的使用步驟:


























在欲壓縮之檔案上按右鍵























出現上圖畫面,然後選擇好設定









大功告成,我們試著解壓縮看看吧。














出現問你要放到哪裡,表示成功啦!


這套軟體壓縮的比較好,而且用是免費的,推薦大家使用。

2008年3月9日 星期日

《 YWE 》入門第一步:介紹和工具的準備

在很久以前 YWE 4.0 那時候吧,我發下宏願說要研究一下
然後還紀錄了一下如何用 XML 寫 Hello World! 但是事隔多年,我現在才要繼續研究
而且還是因為數位內容專題想借用它的介面來呈現,天啊,這是報應吧!

Anyway,開始紀錄一下 What's Yahoo! Widget Engine 有人會問說
和桌面程式哪裡不同啊,一樣嗎之類的話語,官方網站的確有說:

「Yahoo!奇摩Widget工具」是供您下載各式各樣 “Widget工具” 的一項服務。Widget工具是一種迷你應用程式,可在電腦桌面上單獨執行。Widget的功能包羅萬象,例如:查看氣象、閱讀即時新聞、檢視個人行事 曆,或玩玩小遊戲。Widget工具通常位在電腦桌面上,看起來像是張小圖片或小動畫,和一般的應用程式不同。

那開發人員又會提問,主要是用啥米程式語言和工具去架構呢?

每一個Widget工具都是運用「Yahoo!奇摩Widget Engine」製作出來的。「Yahoo!奇摩 Widget Engine」是一種JavaScript應用程式平台,在Windows和Mac OS X的作業環境都可使用。

那重點就勾勒出來了對吧!用 Yahoo!奇摩 Widget Engine 去構築整個 Widget 的模式,而該模式
是一種資料交換的介面,可以加入 JavaScript 的平台。

更詳細的介紹請洽 Yahoo!Widget 官方網站喔!
以我的桌面來說安裝完 Yahoo!Widget 之後的工具各代表啥米:


而開發人員必須專一個方便的小工具來助興:

他可以讓 .widget 的工具反轉成製作時的資料夾,讓我們可以對他作解析;
亦可以我們做好 Widget 之後,他自動幫我們壓縮成 .widget 的檔案給 YWE 去執行喔。
開發人員最好是安裝比較時間啦,我個人這樣認為。

##CONTINUE##

製作 Widget 範例的步驟:
  1. 規劃介面和功能
  2. 建立好 widget project 的架構(備註1)
  3. 用繪圖軟體製作,可能是去背的處理或是設計規劃頁面等等
  4. 編寫程式碼(備註2)
  5. 將 widget project 托移到 widget converter 並按下 convert
  6. 將產生的 .widget 納入工具列之中
  7. 啟用 Widget工具
備註1:
  • 如果以製作著的角度來說,這點可以非常隨性。
  • Project Name 之下,愛怎麼放就怎麼放,只要 .kon 的 xml 檔案在第一層。
  • 其他說明參閱 NKTalk 的說明文件
備註2:
  • .kon 是 XML 所構成的,而亦可以增加互動的效果,這部份由 Javascript 去處理。
  • 整個流程,最好是參閱 AJax 的觀念去思考。
以下是小範例:
  • 元素有:去背的介面和文字連結


  • <widget minimumVersion="4.0" version="0.1a1">
    <debug>on</debug>
    <window>
    <name>main_window</name>
    <title>Picture Widget</title>
    <width>228</width>
    <height>228</height>

    <image src="images/logo.png"/>
    <text>
    <name>Link</name>
    <data>NCUE</data>
    <size>25</size>
    <hOffset>65</hOffset>
    <vOffset>110</vOffset>
    <onMouseUp>
    openURL("http://www.ncue.edu.tw");
    </onMouseUp>
    </text>
    </window>
    </widget>



此 Widget 呈現效果為以下圖片展示:


雖然是非常簡單的範例,但是足以讓我們跨入門檻的第一不,希望下一次的進度會直接進入到
JavaScript 的傳遞和資料整合的部份,開始撰寫功能的程式碼。

後記:
我一直以來都用 Editplus 在編寫關於網頁相關的程式碼,於是為了寫 .kon 的檔案
我將 XML 複製一份改名為 Kon,現在 .kon 的檔案都有顏色區別了,這樣眼睛好看一些 :)

參考來源:
NKTalk 技術文件

2008年2月2日 星期六

《 Ubuntu 》LAMP 用 apt 套件庫安裝的順序和步驟

Ubuntu 安裝 Web Server 已經不是一件大事了,可以說是變得十分簡單。
在 Linux 底下完成這些條件的套件總和稱為:LAMP

以下列出必須安裝的套件名稱:


// Datebase
sudo apt-get install mysql-server

// Apache HTTP Server
sudo apt-get install apache2

// PHP for Apache HTTP Server
sudo apt-get install php5

// PHP Module
sudo apt-get install libapache2-mod-php5 php5-gd

// MYSQL for Apache HTTP Server
sudo apt-get install libapache2-mod-auth-mysql
sudo apt-get install php5-mysql

// phpMyAdmin
sudo apt-get install phpmyadmin


安裝的時候會因為相依性的問題而彼此相關,所以不見得要逐一輸入以下指令,
僅列出要完成安裝的必要套件名稱。正常來說,安裝完上述的套件之後就可以享受
Web Server 的服務啦 :)

萬一發生資料庫密碼不吻合進不去 MySQL,可以試著依照以下步驟來重新設定密碼:

  1. 停止MySQL


  2. /etc/init.d/mysql stop


  3. 用mysqld_safe指令啟動安全模式MySQL,並且告知不要讀取 grant table 以及所有 MySQL 資料庫密碼


  4. mysqld_safe --skip-grant-tables --skip-networking &


  5. MySQL 現在則在沒有密碼保護的狀態下執行


  6. mysql -u root


  7. 將可以使用你系統上包含所有資料庫密碼的 mysql資料庫,並且可以更改 root 密碼


  8. mysql > use mysql;
    mysql > UPDATE user SET Password=PASSWORD("yournewpasswd") WHERE User="root";


  9. 離開MySQL並且重新啟動 mysql


  10. mysql> exit




參考資料:
Ubuntu Apache-PHP-MySQL Server
MySQL HowTo

2008年1月28日 星期一

《 Linux 》Ubuntu 安裝 x-window

Ubuntu 正體中文 wiki 有一篇文章後面有說到 Ubuntu6.10Install
安裝 Kubuntu


sudo apt-get install kubuntu-desktop
sudo /etc/init.d/kdm start
sudo dpkg-reconfigure xserver-xorg


安裝 Edubuntu


sudo apt-get install edubuntu-desktop


安裝 Xubuntu


sudo apt-get install xubuntu-desktop
sudo dpkg-reconfigure xserver-xorg

2008年1月25日 星期五

《 Linux 》親和力超強的 Ubuntu Linux

以下自中文的官方網站擷取:

Ubuntu 是一句代表「以人道待人」以及「群在故我在」的非洲語, Ubuntu 發行版將這個精神帶入電腦軟體的國度。

人道啊!說起來我是個 Linux 新手,我碰 Linux 的時候沒有經歷過 Debian 不好親近的時代
聽一些學長和學弟說 4.0 以前的 Debian 不是新手在玩的呢。沒想到我以為 Debian 4.0 那種親近的感覺已經很屌了說,後來聽說 Ubuntu Linux 似乎更人性化,透過官方網站的填寫資料取得了 6.06 LTS (應該是 Long Time Support),雖然我這在點抱持懷疑態度,因為沒人跟我解釋。
任何版本的套件和軟體等支援不是都可以一直更新嗎?那為何有 LTS 版本的5年支援,還是他是指 source.list 裡面包含的套件庫,他們有更新的年限,往後要更新請自行跟換 source.list 的套件來源。

最近出到 7.10 的版本,因為他們很堅持 6 個月就出一個版本然後發行,果然有堅持才會又廣大的迴響,有不斷的提供免費的 CD 得到更大的迴響,恩~我這幾天又收到 7.10 版本的 CDs了,其實是想要那5張貼紙。因為在這1年多期間,為了工作(學校工讀)上的需要,我先買了 CD-RW 燒Ubuntu 6.0.6 和 7.04 以及 7.10 的 Server Version,都是用文字模式在進行操作,不過安裝的時候那個畫面也是超人性化的,很簡單的說明真的。在我安裝 Ubuntu 服務的機器上面都會貼上Ubuntu 的貼紙順便宣傳一下"Our Server is based on Humanity"。

Debian 也已經把新手勿進的魔障去除掉了,Ubuntu 根本就是給人用的沒經歷這種過渡期 :D


  • 喜歡 GNOME 的人可以直接用預設的。
  • 喜歡 KDE 的人也可以試試看 kubuntu
  • 不喜歡華麗桌面但是喜歡快速的執行效率者可以嘗試 xubuntu

我和 Ubuntu 作戰得時間大部分都是文字模式下的 Server,所以這些桌面等等的套件我是都沒灌,不然就是關掉或參刪除。可以找個時間讓自己的 Desktop 換個工作系統 :)
Eee PC 風潮也捲起了部份的 Linux 風,Ubuntu 也可以算是玩加入門的作業系統,已經有玩家將Xubuntu 融入 Eee PC 的驅動程式以及一些優化做出了 eeeXubuntu 給大家使用的系統 ,在那麼小的一台NB上面(比A4小)的確需要執行效率好一點,所以 Xubuntu 的好處就出現了。繼續玩 Ubuntu 吧,要開始換回 Desktop Version看看 3D 了 ...

2008年1月22日 星期二

《 Virtual 》VMware 重要演示須知

常常用 VMware 來虛擬一個作業系統,最近常常用到是因為有一門 UNIX 課程的需要
因為不見得每一位同學都會安全的切割硬碟或是買一顆新的硬碟來進行安裝的動作
而期末老師又希望我們能夠安裝並熟悉3個成熟的套件,於是在上一屆就引入了 VMware
當作上課的示範教材,雖然只有一兩堂課告訴同學如何正確的和 VMware 交朋友
以及讓朋友能夠完全灌到 Fedora Linux 上面。
已經放寒假了,原本是安裝 Fedora Core 7來進行練習,上面的畫面眼尖的人應該會發現
嘿嘿 :) 是 Core 8耶,沒錯!我來搶鮮了,成功安裝到我的 VMware 世界囉^^
在使用 VMware 這套虛擬工作站之後,我覺得還是要認識一下如何讓自己能夠熟悉這個軟體
除了我文章之前說的 [Port Forwarding] 之外,還有幾項重要的議題可以探討。
  • VMware Tools 的安裝
  • 如何讓 Guest OS 磁碟重組和清理
##CONTINUE##

VMware Tools 的安裝

改善 Virtual Machine 的執行效能,而且可以讓 Host OS 和 Guest OS 互通有無,
這是前輩的經典文章中所說得效能,相信官方網站一定也有說,但是我還沒找到如何溝通。

以下是安裝 VMware Tools 的步驟:(測試的系統為 FC 8)
  1. 開啟 VMware 工具列 VM > Install VMware Tools ...
他就會像放入光碟一樣,可以從 [電腦] 去看看,是否有成功,以下是成功的畫面。
接者,我建議進入光碟把安裝檔拿到 /usr/local/ 去安裝,除了像之前 tarball 安裝別的套件一樣之外,安裝檔還可以留著,下次不用再去按 VM > Install VMTools ... 等等的,萬一改天被我們亂砍砍掉的話啦 :D


cd /media/
cp VMwareTools-6.0.0-45731.tar.gz /usr/local
cd /usr/local
tar zxvf VMwareTools-6.0.0-45731.tar.gz
cd vmware-tools-distrib
./vmware-install.pl


他會問一堆路徑和設定的問題,基本上按預設的就ok了,除非你有特殊需求。
安裝過程很像在安裝 Webmin,如果大家有安裝過的話,應該會發現喔:)

如何讓 Guest OS 磁碟重組和清理

使用虛擬的系統太久了,會跟天天用的 xp 一樣變得很多拉圾要去清理和磁碟整理
那應該怎麼做呢?其實很簡單。只要幾個步驟就好


上面那張圖的畫面應該很熟悉吧,點選硬碟 > Utilities 下拉到 > Defragment 就可以了喔。 這是執行中的讀取識別
重組成功
夠簡單吧,為了需要做紀錄也順便分享一下,VMware 還有很多好玩的地方要再去嘗試一下,然後再慢慢紀錄了,希望還可以在網路上看到更多的教學分享。

2008/01/24 新增

[延伸閱讀]
技巧大放送!VMware虚拟机11大常用窍门
VMWare Workstation的使用技巧

2008年1月20日 星期日

《 Linux 》Samba Server 小紀錄

課程上的需要安裝 Samba Server
但是手邊的書是舊的版本,照著安裝和設定難免會出現小問題
以下是部份差異和更正:
  1. smbstatus 確認自己安裝的 Samba 版本為何。
  2. Samba 3.x 版以下還是屬於舊的,利用 /etc/smbpasswd 當作帳號密碼檔案
  3. Samba 3.x 版以上是比較新的,密碼檔已經變成


/var/lib/samba/secrets.tdb
/var/lib/samba/account_policy.tdb
/var/lib/samba/passdb.tdb


原本的舊版設定是 cat /etc/passwd | mksmbpasswd > /etc/samba.d/smbpasswd ,要改成:


umask 066
getent passwd | /usr/sbin/mksmbpasswd > /etc/samba/smbpasswd
pdbedit -i smbpasswd -e tdbsam
rm /etc/samba/smbpasswd
umask 022


或是:


dpkg-reconfigure samba


我是直接安裝新的版本,所以我只確認了 Linux 本機的帳號存在,在手動建立棋帳號即可
smbpasswd -a account,他會順便詢問以及輸入密碼。事後更改密碼只需要 smbpasswd account
就ok :) ,我有再去新的帳密資料庫去看檔案,但是應該是編碼問題吧很亂。不過使用者可以正常的使用 Samba Server 的分享喔。

參考資料:摩托學園討論區

2008年1月15日 星期二

《 Flash》Desktop Tower Defense

Desktop Tower Defense雖然只是一個Flash小遊戲,玩起來卻讓人血脈賁張,欲罷不能。
這個flash game名列CNET.COM評選一百強網路軟體娛樂項之首: Webware100 Entertainment,
兼具策略性,易上手,刺激等特點。官網有排名高手之棋盤佈局圖可供參考,
而且有不同等級,上手之後會越陷越深。

只能說好玩啊~
雖然看過同學玩過類似的 Flash Games,但是我覺得這個更屌。



絕招都來了,隨便玩玩吧~

2008年1月4日 星期五

《 Network 》子網路切割

了解這道理才能實做,所以就看了一下做紀錄囉 :)

IP分成:A,B,C Class

C 的網路遮罩為 255.255.255.0 (目前學校是這個沒錯!)
B的網路遮罩為 255.255.0.0
A的網路遮罩為 255.255.0.0

申請網路

C 的話 X.Y.Z.O (X.Y.Z 是固定的,上頭給的)
B 的話 X.Y.O.O (X.Y 是固定的,上頭給的)
A 的話 X.O.O.O (X 是固定的,上頭給的)

切割子網路計算

如果申請的IP為 201.154.52.0,且 mask 為 255.255.255.0 的 C 級網路
現在以 Subnet mask 255.255.255.248 做切割
248 換成 2 進位等於 11111000

原本的 201.154.52.0
201.154.52 => Network ID
0 區段 => HostID

現在切割後
11111 區段 => SubNetwork ID,2的五次方等於32(但是扣掉前後路由器會用到,剩下30個)
000 區段 => SubNetwork Host ID

所以子網路的網域 IP 範圍就可以推算出來了。