Skip to main content

[Flex] Resizable Window Layout

最近研究起『使用者經驗』特別對非固定式 layout 有濃厚的興趣,雖然這類的教學已經被大家寫到爛了,在這邊還是與大家分享一下在 Flex 中實作網頁上 Resizable Swf Window Layout 的 很簡單作法...



<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:local="*"
frameRate="30" horizontalScrollPolicy="off"
verticalScrollPolicy="off"
layout="absolute" width="400" height="430">
<mx:Script>
<![CDATA[
import flash.external.ExternalInterface;
private function updateStageSize() : void
{
width = testWin.width;
height = testWin.height;
//Call 網頁上的 javascript 做 resize
ExternalInterface.call("doResize", width, height);
}
]]>
</mx:Script>
<mx:Resize id="stageResize" duration="600"/>
<mx:TabNavigator id="testWin" resizeToContent="true"
resizeEffect ="stageResize"
resize="callLater(updateStageSize)" >
<!-- 測試用 container-->
<mx:VBox label="Tag1"
width="400"
height="400">
</mx:VBox>

<mx:VBox label="Tag2"
width="300"
height="300">
</mx:VBox>

<mx:VBox label="Tag3"
width="200"
height="200">
</mx:VBox>
</mx:TabNavigator>
</mx:Application>

callLater(function) 的使用在這邊很重要...你可以試著將這個 Function 拿掉重新輸出就會知道有啥咪狀況了...=P

網頁上的 Java Script:
請愛用 swfObject 來 崁入 Swf,真情推薦!!

function doResize(w, h){
document.getElementById( 放置SWF的DIV id ).style.height=h+"px";
document.getElementById( 放置SWF的DIV id ).style.width=w+"px";
}


因為 google page 已經開始停止服務,雖然舊用戶還是可以使用,但是不知道哪天會掛掉,所以再找到下一個好用又可以放置 javascript 的網站空間前,範例原始檔先暫停提供囉!

Comments

Popular posts from this blog

[AIR] JoSiResize - Mobile 開發小工具

JoSiResizev0.6.0,Adobe AIR 3 runtime之前開發 tool app 的時候並沒有很深刻的體認到圖片素材的 resize 是一個很麻煩的事情...畢竟圖片使用量並不大,等到開發遊戲類的 app 才發現光處理不同螢幕尺寸的圖片素材是一個相當折磨人的工作。
因此 JoSiResize app 誕生了~~~原理是採用最小 scale 長寬比例不變的方式進行放大縮小。使用方法非常簡單,設定好變更的尺寸,接下來,將需要處理的圖片檔案全選直接拖曳到視窗內,畫面即會跳出預備儲存的檔案夾選擇畫面,確認後即開始轉檔。

PureMVC for Titanium Mobile

為了秉持著哪裡都要用 PureMVC 的想法,試著修改 PureMVC 官網上提供的 Javascript 版本給 Titanium 使用。
**source code**
有任何問題請上:Titanium Mobile 中文開發者論壇

建立 instance 的方法:使用 Puremvc 為 namespace
Ti.include('puremvc-js-1.0.js');
var c = Puremvc.clone( Puremvc.SimpleCommand );
var p = Puremvc.clone( Puremvc.Proxy, "TestProxy", "This is TestProxy's data" );
var m = Puremvc.clone( Puremvc.Mediator , "MainMediator" );

[Unity] erinylin.lazylib - Cookie for PlayerPrefs

有鑑於 PlayerPrefs 測試與版本更新問題,將大家都愛用的 PreviewLabs.PlayerPrefs 打包起來,製作重點還是以懶人為主,基本上 PlayerPrefs 資料更新與數量並不可能會有強烈衝擊效能的狀況產生,所以為了方便開發,就弄了一個視覺化工具,方便除錯用。

雖然 PreviewLabs.PlayerPrefs 作者都宣告放棄他們的版權,不過為了尊重程式,僅僅加入了兩個公用函式,其他並無更改。

內有:
Cookie ManagerCookie 用 DataObject 混合編輯 ScriptableObject執行階段除錯視窗工具當然還是有懶人常數檔案輸出資料版本控制,方便更新版後儲存資料更新功能其實很多,有興趣的請自行到 Github 下載並參考範例吧!