2014年12月26日 星期五

多螢幕應用 App,duet

duet 這一款應用在 App Store 的分類上是屬於「生產力軟體」,不果我認為他是娛樂性與實用性兼具的應用就是了,只要你的 iPad 或是 iPhone 系統版本在 5.1.1 以上,只要接上舊式的 30 Pin 或是 Lightning ,開啟對應程式都可以變成螢幕,而且還是觸控螢幕

2014_12_25_152524
這是 iPad Mini 的主畫面,duet 就是正中央那個
2014_12_25_152527
第一次開啟 duet 時會提示要你去官網抓取 Mac 端的程式,在安裝好後會要注意 Mac 會重開機一次
2014_12_25_162238
將 HDMI 與 Lightning 都連接上
2014_12_25_162216

這裡要注意一下,如果其他外接螢幕也要使用(建構出三螢幕環境)的話,先連接一般的外接螢幕(使用 HDMI 或是 Mini DP 介面),然後在開啟兩邊的 duet 進行連接,不然主要次要螢幕的判定怪怪的


2014_12_25_162228

iPad 上顯示的畫面,我是 iPad Mini 初代,所以解析度不高,我是拿來當成監控螢幕用,Retina 系的 iPad 可以直接當次要螢幕用,而且解析度可以到 Retina,秒幀數還有六十

2014_12_26_184310
不過在支援觸控方面,說實在還是有點兩光,所以用 iPad 玩艦娘還是不太方便

論用途的話,出門在外可以有一個螢幕向他人展示,對於影片編輯、音樂創作、程式設計等職業的應該很有用,當然天生就喜歡多螢幕的朋友也適合,四百五十塊小錢啦,不過我認為依蘋果的個性,會把這 App 買下來變成內建的功能

2014年12月15日 星期一

Pixmicat!自適版型撰寫與應用

在 Komica 所使用的討論版程式中,主要有兩種,一種是由 futaba.php 所改寫成的專用程式,而另一種是以 futaba.php 為基礎所加強的 php 網頁討論版程式,Pixmicat!

而 Pixmicat!,也就是圖咪貓貼圖版程式,其優點主要在於高度的模組化,以及支援多種後端儲存資料庫,包括 MySQL、PostgreSQL 與 SQLite,基本上只要你有一個支援 PHP 的空間,不論是虛擬主機或是個人架設的伺服器就可以運行 Pixmicat!

而 Fenrisulfr 從 Pixmicat!第六版時期開始營運,到現今的第八版,經歷過三次的更新,而在同時,我也儘量簡化它的使用者操作流程與程式檔案數量,也以 Google 的 PageSpeed Insights 網頁測試器為基礎,試著讓 Pixmicat!的運作效率更好,包括使用 JavaScript 延遲載入,以及透過經由 CDN 網路分流的資源網站減少網路頻寬的影響

而 Pixmicat!在網頁的輸出上,是以所謂的樣板檔案(TPL)為輸出範本,輔以 CSS 樣式去做各種效果,不過這裡會產生一個很好的問題,就是你要在 CSS 上面玩花樣的話,通常無法即時看到,因為 CSS 會被快取,只有 TPL 會在每次輸出網頁時重新讀取,對於開發者而言,清自己瀏覽器的快取是小事,問題是使用著不一定會隨時清理自己的快取,結果就是你努力撰寫的「驚喜」使用著們往往要四小時甚至一週,瀏覽器裡面的快取過期之後才會看到


2014_12_14_124125
一般 Pixmicat!的網頁樣式是儲存在 mainstyle.css 中,並且藉由樣板檔案 inc_pixmicat.tpl 導入
2014_12_14_124209
我將 mainstyle.css 導入 inc_pixmicat.tpl,讓轉譯速度加快

然而,mainstyle.css 中關於行動裝置樣式的撰寫有點「彆腳」,在加入了許多功能、並加入廣告樣板之後,往往會「板塊大移動」,讓行動裝置的使用者十分的痛苦,因為要不停的左右滑動、放大與縮小,也因此有一段時間裡,我直接把針對行動裝置的 CSS 刪除掉,還可以讓檔案小一點

不過,在「CSS 自適版型」出現之後,讓行動裝置順暢瀏覽 Pixmicat!的可能性出現了


2014_12_14_124245
加入給行動裝置使用的版型,當橫向解析度低於 720px 與 640px 時,進行切換
2014_12_14_152929
行動裝置版型部分的程式碼
2014_12_14_124516
橫向解析度 1366px 時,正常版型,完整顯示
2014_12_14_124816
當橫向解析度低於 720px 時,切換到行動裝置版型
2014_12_14_124636
不過仔細想想,行動裝置版型弄兩種解析度真是脫褲子放屁,接著就只有 720px 判定
2014_12_14_153149
720px 判定部分的程式碼

不過,如果要針對行動裝置投放廣告的話?該怎麼辦呢?剛剛行動裝置版型把 inc_pixmicat.tpl 中 HEADER 的部分隱藏掉了,為的是不讓寬度爆衝到廣告樣板的 728px,但這樣一來,不就無法在行動裝置投放廣告嗎?

其實不然,藉由規範不同廣告樣板的出現與否就可以達成,這裡要準備兩種不同解析度的廣告樣板,以 Google AdSense 為例,是「728*90px」與「320*100px」,接著規範兩者在版型中的名稱,在這裡,前者我標示為「NA」,後者則是「MA」

再來則是改變一下剛剛的版型判定部分,先取消隱藏 HEADER 的部分,接著把 720px 改成 728px,也就是說:
當橫向解析度大於 728px 時,顯示「NA」而隱藏「MA」
當橫向解析度小於 728px 時,顯示「MA」而隱藏「NA」


2014_12_15_074351
inc_pixmicat.tpl 中整段版型的程式碼
2014_12_15_074458
細部分,可以看到行數 49~52 ,與 60、61 中,對於「NA」與「MA」的隱藏與否
2014_12_14_131204
這就是結果,可以看到針對不同的橫向解析度(裝置類型),「NA」與「MA」的出現與消失

當然,上述 CSS 語法的應用都可以在關於網頁設計的書籍、網站教學中看到,而這裡是針對 Pixmicat!進行應用,特別是在自適版型的部分

2014年12月13日 星期六

中華電信 4G 測試

掙扎在是否要換 4G 很久了,後來掙扎了半年還是去辦 4G 了

2014_12_01_192140
中華電信 4G 用戶的 Nano-SIM

換了 4G 後大約要等一至兩天,大約是下午辦理當天半夜才會開通新卡的 ICC ID,而舊的 3G SIM 卡會自動失效,開通後不免俗來測試一下,測試軟體是 Ookla 發行的 Speedtest.net Mobile Speed Test,測試機型是蘋果的 iPhone 5s,測試地點是花蓮市區周邊

2014_12_13_044138
在花蓮市區邊緣,接近太昌的地區測出了最高速,40Mbps 下載與 16Mbps 上傳
2014_12_13_044219
花蓮市區的中心部分,4G 用戶較少的地方,30Mbps 下載與 14Mbps 上傳
2014_12_13_044226
花蓮市區的中心部分,4G 用戶較多的地方,12Mbps 下載與 27Mbps 上傳
2014_12_13_044234
所有測試結果,最上方是中華電信光世代 60M/20M 轉無線網路,用於比較

由測試結果來看,與光世代轉無線網路的環境做比較,可見中華電信光世代 60M/20M 在下載上還是有其優勢,不過在上傳速率 4G 有機會追上甚至超越

不過 3G 時代的問題還是有,也就是大量用戶會導致平均降速的現象,但整體而言,目前最低的數據都優於 3G 平均的 7.6Mbps 下載與 1.27Mbps 上傳(國內 2014 年十月測試數據),而在延遲與中華電信光世代轉無線網路相比,平均增加 16 至 20 微秒的延遲,但不玩遊戲的話應該是沒什麼差異