2008年8月30日

MIX08 簡單心得 (Silverlight2 Beta2 & IE8 Beta2)

8/26很開心的去君悅飯店聽了MIX08的五個session,主講人都是經理級以上,內容還算充實(不過還是以demo為主+行銷導向),由於這個活動的名稱叫做「MIX」,所以有好幾個新的技術,但主要還是圍繞在 RIA 上,以下是一些心得:
  • 說到微軟的RIA,基本上就是Silverlight (SL),目前的版本是 SL2 Beta2,預計十月左右會推出正式版。另外在開發工具的部份,目前最新版是Expression Blend 2.5 June 2008 Preview,但是為了減少版本號造成的混淆,十月份配合SL2 Release的時候,正式名稱會是「Expression Blend 2 Service Pack1」。
  • 在整天的議程中,主要是Demo了一大堆實際的案例,雖然不知道去年Demo的狀況是怎樣,但是大概只有故宮的清明上河圖(新版,IE Only)比較有看頭,但今年就是各行各業的Demo都有了,從NBC奧運轉播、航空(華航精緻旅遊)、旅遊、教育訓練、金融(新光證券)、e-Business(淘寶)、Search Engine(百度)、運動頻道、體育用品、流行服飾、EIS、到線上雜誌(MagV)等等的產業,可以看到有了SL這種前端的UI技術,會激盪出多少的創意。
  • 看完那麼多Demo之後,雖然MS的經理以及MS Partner的高階主管們努力的試圖灌輸聽眾「SL is cross platform, cross brower」以及「Write once, run everywhere」之類的行銷內容, 但我認為前提是系統核心架構要規劃的很好(該切割的都切割好,如Service Composition的架構),如此前端才有可能依不同的需求進行抽換,而且在不同的裝置上勢必還是得寫不同的程式,總不可能「一般手機」、「觸控手機」、「Surface Computer」都跑一模一樣的程式吧?起碼觸控的部份需要call特殊的API來處理Input才是,再者顯示區域大小的差異也是不可忽略的(e.g. Surface vs. Sphere vs. CellPhone vs. Desktop)。
  • 由於今天主要是快速的Demo,除了一些單純的酷炫介面之外,其實有不少已經進步到Enterprise Application了(也就說SL可以宣稱是Enterprise Ready),但是因為沒有提到很多技術細節,因此還是不清楚是否SL目前已經發展出比較完整的framework,如畫面切換時的轉場機制等,看來短時間內市面上的入門書還是只會針對每個小功能做討論,想深入了解還是必須要直接找MTC之類的機構來合作。
  • 今天上午有簡單的Demo了IE8 Beta2,所講的內容不會比IE Blog更豐富,不過在8/27開始就可以自己去官網下載Beta2來玩玩了。這部份主要是Accelerator這項技術比較有趣,對developer來說可以自己做客製化(e.g. TinyURL Accelerator),未來光這個部分應該就會有很多新的應用。效能的部份,感覺在Vista上開tab的速度實在是慢到離譜,比IE7還慢,不知道是不是有什麼地方需要調整的,不過如果需要很精細的設定才能讓這個軟體跑的快,那對一般人來說實在太困難了。
  • 下午的第一個session講的是Microsoft Surface,Demo影片不用說是無敵的炫,在實驗室裡已經可以做到接近科幻電影情節的功能,整個來講一大重點就是完全利用無線傳輸(還有一切都是純淨的白色),配合RFID、指紋辨識、Speech to Text等等技術,加上Surface最重要的觸控功能,整個操作介面變得非常的直覺,不需要鍵盤、滑鼠這種會造成腕隧道症候群的輸入裝置,也不需要一堆哩哩摳摳的USB傳輸線(沒事還分什麼公的母的)、記憶卡轉接卡(各種格式轉來轉去),想必可以減少很多電子廢棄物的產生(但是會不會因為過多的無線電波導致腦癌之類的副產品大量增加@@? ..)。Surface可能帶來的改變可以說是方方面面的,很難一一的調列出來,但可以想見的是,未來專業的UI Designer的地位會大幅提高,畢竟過了這麼多年,從Apple就可以知道,功能普通的軟/硬體,經過世界第一的使用者介面設計,可以增加多少的無形價值。
  • 下午最後一個session講的是微軟為了推廣SL所推出的Silverlight Streaming服務,這服務是由微軟提供Silverlight Hosting,屬於Windows Live Service的一部分,所以是認Windows Live ID的。包括主機、storage、傳輸頻寬等全部都由微軟一肩扛起,目前可以接受把SL Application打包成zip (SL1.x) 或者zap (SL 2.x)的格式,影片格式採用MPEG組織的VC-1,解析度最高到720p,除非是對畫質特別要求的人或者專業人士,在一般人眼中畫質絕對是沒問題的。在免費使用的限度內,storage的上限是10GB,每月傳輸量5TB,影片長度為10分鐘(這是MPEG組織對VC-1規格的免費授權限制),不管是個人技術愛好者、學生、或者小型公司,應該都用不完才是,假設真的有需要使用到超出上述的限制,未來也會有付費的方案可以選擇。未來微軟會開始實驗置入廣告的business model,不過一如往常,廣告的部份會先拿美國地區做實驗,台灣地區應該可以暫時倖免一陣子:p
以上是有點像流水帳的一些記錄,整體來說活動雖然辦的有點小瑕疵(沒有便當!音控出包),但是大體上是很熱鬧的,希望以後每年有機會都可以去參加一下,上這種班總是比較開心的:p

DataView排序有趣的現象

坎尼無意間發現這個很神奇的東西

大家都知道 當 DataView 要排序時 要給予 .Sort 屬性
不過 大家知道給予 .Sort 屬性時 DataView 裡的資料會怎樣變化嗎?
「不就是排序過的資料?!」對啊 坎尼也是這麼認為
但在 vs2005 + .net 2.0 的環境下測試 咦? 似乎不是?!
來看一下測試的抓圖

坎尼在取得資料的部分 加上兩個中斷點 (其他相關程式碼 請見 這裡 )

然後在 CustomerID 排序為 Desc 時 進入中斷點
下圖為排序前 可以看到 Visualizer 裡的資料的確是未排序
按下 F5 到下一個中斷點

先確認一下目前的排序 的確是 customerId Desc

再來看一下DataView裡的資料

呃 怎麼會是排序前的資料呢 (抓頭
但是畫面上卻又是排序過的資料


但當前幾天坎尼準備寫 blog 時
卻發現這個現象不見了 當場嚇出了一天份的尿
難不成...這飄月連程式也會跟著飄嗎??! (見下面抓圖)

排序前的資料...恩 一樣

也的確是 customerId Desc

!!?
出現了 排序後的資料


好啦 一般靈異現象都會有的解答時間到了 XD
不知各位有沒有發現 其實圖中的某些東西不太一樣???
相信大家看到這 會把頁面再捲上去 仔細的看程式碼

「不是一樣嗎?」
沒錯 程式碼當然一樣 (被鐵槌打飛

重點是....環境不一樣
前半段的抓圖是 vs 2005 + .net 2.0
後半段是 vs 2008 + .net 3.5

所以坎尼試想了兩種可能性

第一種
.net 2.0 中 DataView 資料其實未排序
只是在容器(GridView)要顯示資料時,會讀取 Sort 屬性是否有值
然後要在顯示時 再由容器去排序

第二種
單純的是 Visualizer 的 bug ,它只是忘了去看 Sort 屬性是否有值

就在剛剛 坎尼突然想到 若是 vs2008 + .net 2.0 呢?
於是又開了個新專案 Target 指向 .Net Framework 2.0
程式碼複製過來 再按下 F5
想知道結果嗎? 下次再告訴... (被踢了一腳

好啦 結果會和後半段的測試一樣 Visualizer 看到的資料會是排序過
所以坎尼是偏向後者的推論 可能是 Visualizer 當初設計時的 bug
不過這些都要問 MS 的開發 Team

飄月過了 飄程式也要少出現啊 哈哈

2008年8月20日

利用 WebConfig 設定 SmtpClient

這是坎尼前陣子出差學到覺得很有用的東西

一般寫收發信件的程式
都要漏漏等的寫一大堆設定
其實這些設定都可以預先寫在 web config之中 (見下圖

這段code是包在 Configuration 底下
也就是和 System.Web 同層
設定的參數如圖

首先 要有一個可用的 smtp server (範例中是用 hinet )
接著還要有帳號密碼 (圖中當然是假的 坎尼是用自己hinet的帳密登入)
這樣設定就完成了 下圖是程式的使用方式

範例中我們可以看到 SmtpClient 宣告的地方
不需要設定任何參數即可發送信件 (見下圖

當然 坎尼的 EMail 馬上就收到了這封信


寄送郵件的程式碼
坎尼是用 System.Net.Mail 的 namespace
而不是用 System.Web.Mail (這在 .NET 2.0之後已不推薦使用

另外 抓圖裡的一些數據都已先做過處理
若要練習 請自行先找可用之 smtp server 及一個有效的 email 信箱

Gridview 自訂分頁

拖稿拖了好幾天 坎尼夢見了富檻出新連載
所以上來把欠的東西還一還 (富檻快給我畫

坎尼廢話就少講一點 直接進入 自訂分頁 Sample

首先,畫面上要有個 Gridview
這邊坎尼偷懶用了 SqlDataSource 見下圖

可以看到 Pager 已經出現了 來看一下原始碼 如下圖

要自訂分頁第一個要件就是 Gridview allow paging 設為 true
再來就是Gridview 上按右鍵EditTemplate -> PagerTemplate
就會進入到編輯畫面 再把要加入的 Controls 拖進去

如果嫌 Design 模式很難用 想用原始碼去編輯
就直接在 Gridview 的 PageTemplate 把 Controls 給拖進去
沒看到 PageTemplate 怎麼辦? 自己打啊 XDD

再來解說一下坎尼這個自訂分頁
控制項分別為 Label LinkButton*4 DropDownList Label
LinkButton皆有設定 CommandArgumentOnClick事件
DropDownList 也有 SelectedIndexChanged 事件
這些稍後會提到 先來看一下實際畫面

以下就來解說分頁事件是如何進行
首先是 DropDownList 的 SelectedIndexChanged 事件
很簡單 只要SelectedIndex 設定給 GridviewPageIndex 即可

這邊要注意的地方有兩個
要取得 Pager 裡的 DropDownList 記得是用 Gridview.BottomPagerRow
(當然 如果 PagerRow 設定為在表格上方 就是用 Gridview.TopPagerRow)

再來就是被註解起來的 GetData() 函式
因為坎尼這範例是用 SqlDataSource 當資料來源的方式
所以並不需要特別去做資料繫結的動作 只要 PostBack 即可
但如果是要自行取得 DataSource 來繫結
這邊的 GetData() 就是取代各位的 取得 DataSource 的函式


接下來是 LinkButton 的 Click 事件
先是取得目前按下的 LinkButton 是哪個鍵
分別有 第一頁 上一頁 下一頁 及 最後一頁

會依點下的按鍵不同 計算該到哪一頁
index 設給 Gridview.PageIndex
同樣的 這邊的 GetData() 函式作用如上面解說

接下來就是這個自訂分頁的精華部分
先是在 Gridview 的 DataBound 事件加入 pageSet() 函式
這函式需要傳入要分頁的 Gridview

當然 若是通通寫在同一個 class 就可以省了把 Gridview 傳入
可是 為了增加程式彈性及提高重複使用率 建議是多寫一道手續
(比方講 把這個函式包在另一個 class 或是 寫成User Control)

下圖就是最麻煩 坎尼已經想睡了不太想講的部分

好啦 還是解說一下 (大家可以點圖放大 看一下程式在幹嘛)
首先 把傳入的 object 轉為 Gridview
再將 Gridview 的 PagerRow裡的 Controls 取出做處理
顯示全部筆數 目前先給 pageCount * pageSize (當然 這邊是不準的 要再做其他處理)
顯示全部頁數 給 pageCount

接下來 取得跳頁用的 DropDownList 並重新給予 Item
「這樣不會每次 DataBound 就重覆的把 item 給加進去嗎?」
不會的 因為這邊是動態產生
所以只要 PostBack 下拉選單的 Items 就會被清空
因此才要再重新把項目給加回去

再來的就是判斷 LinkButton 是否作用
最後再把下拉選單設定為目前的頁數

其實這個函數最外層還要加個判斷 if(gv.PageCount > 1)
因為 GridView 預設 如果無分頁(頁數小於1) 則不顯示 PagerRow
這段程式碼就會因此出現 Exception

下面就是實際操作畫面



這篇真是又臭又長 希望有人有耐心看到這邊 XD
最後再提一個東西 DataPager
這是 .net framework 3.5 新增的控制項
目的也是在做分頁的顯示及控制
可惜目前只支援 ListView 控制項

若是想在 Gridview 上要自己做美美的分頁
還是只能靠自己寫分頁樣板及事件

2008年8月15日

GridView PagerRow

這篇應該是要講 自訂分頁 啦
不過在 上一篇 裡有提到 Pager 這個東西
所以坎尼就自己經驗來談一下 GridView PagerRow 吧

GridView 的功能實在很強大 幾乎是沒有做不出來的效果
當初坎尼為了個案子 寫了個自訂分頁的 UserControl
然後還在 GridView 裡塞 GridView 做多重資料顯示
也用到了書上提到的 把新增/修改寫在外部 (只差沒光棒技巧了 XD)

做自訂分頁時 又發現了個驚人的事實
原來可以顯示兩個 Pager !!!
難怪那時坎尼在 GridView 的 Intellisense 裡一直找不到 PagerRow 的選項
因為它分成了 TopPagerRow BottomPagerRow 囧>

「顯示一樣的東西有什麼作用嗎?」
剛剛有說到 GridView 的 Intellisense 會提供兩個PagerRow選擇
所以當然是動態的從 後端 去動手腳啦 哈哈

再來就是 上一篇 提到的 PagerRow 裡其實還塞了個Table
這個就很像坎尼會用的 Table 包 Table 方式

通常會用這個方式有可能是因為 Table 的欄位是動態產生
若是還要增加個變數去記 colspan 的欄位 其實還蠻傷神的

最後再來講一下PagerRow裡面的東西 (坎尼要準備睡午覺了 ^^)
以預設的 numeric 為例
GridViewRow(PagerRow) -> TableCell -> PagerTable -> TableRow -> TableCell -> Controls

最下層的 Controls 又會有兩種 (以 numeric 為例)
就是 Label DataControlPagerLinkButton (這個直接當做 LinkButton 吧)
會有 Label 的原因是 當使用者在該頁時 該頁其實是不會出現連結
比方講 坎尼現在在資料的第三頁 分頁上的 3 就會是 Label 而不是 LinkButton

以上都是用 numeric 當例子
若是使用者自訂 當然就會是自訂的那幾個 Controls

本來只想寫一點點的 沒想到還是寫了一大堆(太愛碎碎念了)
下篇就真的是自訂分頁了啦 不過篇幅可能有點長就是

Gridview分頁顯示效果

這篇三天前就該寫上來的
可惜坎尼在公司都忘記要把圖片先上傳
回到家要寫時 又發現手邊沒圖片 囧>

好 這次要講的是Gridview的分頁顯示
一般來講 用內建的顯示效果
只有 上一頁/下一頁 還有 1 2 3 4 5 這兩種
前者只能死板的在上下頁移動 並不能跳頁
後者則是一般開發者的喜愛 可是稍嫌太醜
所以另有需求的話 通常是利用自訂分頁方式來完成

不過這次不談自訂分頁 (留在下次再談)
這次要說的是 一般的數字型分頁 (numeric)
由於它一次只顯示10頁的選項 若是10頁之後則會以 ... 方式呈現
之前就被客戶抱怨說太醜 (囧 這不是坎尼的錯啊)
所以坎尼上網找了解決方法 (不過由於年代久遠 也忘了在哪看到的 抱歉)
以下是 DataGrid 的範例 (當時改的是DataGrid)

後來另一位同事也要這種效果
坎尼想說 Gridview 和 DataGrid 本來就是兄弟
應該改一下原本的 code 就好了吧
這一改之下 才發現 這兩兄弟長的還真的有點不一樣

我們可以看到 上面DataGrid是先把PagerRow抓出來
再把裡頭的 Controls 一個一個抓出來
GridView這麼做只會跟你講:沒效果
於是坎尼去把PagerRow裡的所有Controls給抓出來看 (見下圖)

這一抓還真的不得了
這 GridView 原來裙子底下還穿了褲子 難道這是所謂的漸層式穿法?
GridView 的 PagerRow 裡還包了個 Table !!!
不像 DataGrid 的 PagerRow 直接就把東西塞進 TableCell 裡去

知道這些就好辦了
首先 我們需要個 GridView 然後把 PageMode 改為 Numeric
接著到 RowDataBound 把下圖的程式碼鍵入

將將將 大功告成 以下圖片是執行畫面



GridView 之所以可以有自訂分頁功能 (DataGrid 不行)
就是在 PagerRow 裡多了個 Table
所以不管使用者如何亂搞
只要把使用者自訂的東西通通塞進去 Table 就對了

了解上面程式碼的人 還可以做出更多變化
比方講 在Pager裡動態地放入控制項、更改 Pager 的樣式....等等
當然 自訂分頁 會更有彈性 (下篇就來講坎尼自製的分頁 sample 好了)

對了 今天似乎是中元節 祝大家中元節快樂 ^^

2008年8月11日

計算使用者自訂日期和今天相差天數

最近這邊陷入水荒 哈哈 坎尼都不知道要寫什麼好
工作上有些瓶頸 加上上週又生大病
對生活感到實在有點無力 還好我有很棒的家人 :)

ok 今天要談的是 計算自訂日期本日相差天數
其實蠻簡單 只要了解 DateTime 中的 Subtract 函數即可

傳入的有 TimeSpan 格式 和 DateTime 格式
本範例是以輸入 DateTime 做示範

這次沒抓 UI 畫面的圖 所以坎尼稍微講一下
畫面上有一個 TextBox (輸入比較的日期) 一個 Button
當按下 Button 之後 就會執行下列程式碼


這邊要注意的就是 Subtract 函數
傳入 DateTime 它就會回傳 TimeSpan 格式
反之 傳入 TimeSpan 它就回傳 DateTime 格式 XDDD
另外,這邊坎尼是用 DateTime.Now 去當比較基準

下面就是結果畫面
若是今天以前的日子 數字會是 正數
若是未來的日子 數字就會是 負數



當然 TimeSpan 提供的不只是有天數的比較
還有 時 分 秒 毫秒 等比較方式 (見下圖)


不過看完圖 你或許會有疑惑 (坎尼一開始也有)
「那 TotalDays 是什麼?」
於是坎尼把程式碼稍微改了一下 輸出畫面如下


看來就是和你所輸入的日期 (這邊沒輸入時分秒 應該是和 00:00:00 比較)
所相差的真正天數

對了 這個會用在什麼地方呢?
坎尼當然是客戶有要求才會去做啊 XD
不過在真正的應用上 可以做成行事曆、鬧鐘....等等

最近坎尼會振作 不然 Tim 都說怎麼文章一月比一月少 囧>

2008年8月4日

Microsoft Security Development Lifecycle

Microsoft Security Development Lifecycle (SDL) 是微軟將 Truthworthy Computing進一步昇華、改良之後的開發方法論,強調將安全性的觀念落實到每一個系統開發的步驟中,更多的資料可至官方網站官方Blog。雖然小公司多半沒時間處理安全性的問題(都要等到問題爆發才會去關注一下),不過還是可以多把握時間自己偷學 :p

Google Spreadsheet 裡用規則運算式

最近因為工作關係,遇到要用 Google Form 及 Google Sheet 所以研究了 Google Sheet 裡的一些 function 怎麼用 首先,分享一下如何在 Google Sheet 裡用規則運算 :D