Posted on by

AutoLayout介紹

投影片分享

過去的作法…

  1. 使⽤用frame和bounds去決定物件的位置和⼤小。
  2. 使用autosizing masks
    1. 設定當畫⾯面⼤大⼩小變動時,要固定 那些值(struts)。
    2. 在view的⼤大⼩小改變時,可以偵測 super view的⼤大⼩小改變去改變物 件的寬和⾼高的值(springs)。

AUTOLAYOUT和AUTORESIZING MASK的區別

Autoresizing Mask是AutoLayout的⼦子集。 AutoLayout更多的功能

    1. 指定任意兩個view的相對位置
    2. 可指定⾮非相等約束(⼤大於或者⼩小於等)
    3. 可以設定約束的優先級

WHAT IS AUTO LAYOUT

一種基於約束的,描述性的佈局系統。 Auto Layout Is a Constraint-Based, Descriptive Layout System.

      • 基於約束 – 以所謂相對位置的約束來定義的
      • 描述性 – 使⽤用接近⾃自然語⾔言的⽅方法來進⾏行描 述
      • 佈局系統 – 設計界⾯面的各個元素的位置。

使⽤用約束條件來描述佈局,view的frame會依據這 些約束來進⾏行計算。
Describe the layout with constraints, and frames are calculated automatically.

影片分享

Posted on by

在Windows下產生.p12及.mobileprovision

在 Windows 產生憑證簽名要求

對 Windows 開發人員而言，最簡單的方法是取得 Mac 電腦上的 iPhone 開發人員憑證。不過，他們也可以在 Windows 電腦上取得憑證。首先，使用 OpenSSL 建立憑證簽名要求 (CSR 檔)：

  1. 在 Windows 電腦上安裝 OpenSSL (移至http://www.openssl.org/related/binaries.html，或直接在此下載openssl-0.9.8k_X64)。
    開啟 Windows 命令工作階段，然後使用 CD 命令切換至 OpenSSL bin 目錄 (例如 c:\OpenSSL\bin\)。在命令列輸入以下命令以建立專用密鑰：
    openssl genrsa -out mykey.key 2048
    儲存此專用密鑰。您稍後將會用到它。使用 OpenSSL 時，請勿忽略錯誤訊息。OpenSSL 即使產生錯誤訊息，可能仍會輸出檔案。但這些檔案可能無法使用。如果發生錯誤，請檢查您的語法並重新執行命令。
  2. 在命令列輸入以下命令以建立 CSR 檔：
    openssl req -new -key mykey.key -out CertificateSigningRequest.certSigningRequest -subj “/emailAddress=yourAddress@example.com, CN=John Doe, C=US”
    以您自己的值取代電子郵件地址、CN (憑證名稱) 及 C (國家/地區) 值。

至APPLE申請.cer檔案

  1. 至https://developer.apple.com/membercenter/index.action以開發者身份登入。
  2. 選擇Certificates, Identifiers & Profiles，如下圖
    2014-01-07_153638
  3. 選擇Certificates
    2014-01-07_153659
  4. 接著按右上角的+
    2014-01-07_155542
  5. 身份選【iOS App Development】
    2014-01-07_155602
  6. 在最後會要求上傳.certSigningRequest，選擇剛剛在【在 Windows 產生憑證簽名要求】所產生的檔案，按確認。
    2014-01-07_155713
  7. 下載.cer檔
    2014-01-07_155843

將開發人員憑證轉換成 P12 檔案

  1. 將從 Apple 收到的開發人員憑證檔案轉換成 PEM 憑證檔案。從 OpenSSL bin 目錄執行以下命令列陳述式：
    openssl x509 -in developer_identity.cer -inform DER -out developer_identity.pem -outform PEM
  2. 現在可以根據 iPhone 開發人員憑證的密鑰及 PEM 密鑰，產生有效的 P12 檔案：
    openssl pkcs12 -export -inkey mykey.key -in developer_identity.pem -out iphone_dev.p12

產生.mobileprovision檔案

  1. 首先先產生一個APP的ID(已註冊過1~2項可跳過)，選左側的”Identifier=>App IDs”，註冊一個APP的ID。
    2014-01-07_160759
  2. 填寫你要做的APP的前置字等識別，若是只想練習則選”Wildcard App ID”，然後Bundle ID填入”*”
    2014-01-07_161119
  3. 接著註冊你的測試機(已註冊過3~5項可跳過)，再選左邊側欄的Devices=>All，新增開發機的UUID
    2014-01-07_162122
  4. 打開iTunes，連接iPhone，打開摘要頁，點紅框處的序號一下，會變成顯示UUID，把它記下來。
    2014-01-07_162323
  5. 回到網頁，把上面的UUID填入下面UUID那欄，並且為這隻手機取個名字
    2014-01-07_162508
  6. 現在要去產生.mobileprovision檔案。點選左邊側欄的”Provisioning Profiles”，接著按右上的+號新增一個Profiles
    2014-01-07_160633
  7. 身份選擇【iOS App Development】
    2014-01-07_160650
  8. App ID選擇剛剛所產生的ID
    2014-01-07_161714
  9. 選擇剛剛產生的certificates身份
    2014-01-07_161843
  10. 選擇要測試發佈的手機
    2014-01-07_163645
  11. 為這個發佈設定命名
    2014-01-07_163655
  12. 下載.mobileprovision檔案，完成。

在Flex裡設定發佈檔案

  1. 在專案點右鍵，選Properties，在此選擇要使用的檔案
    2014-01-07_164424
Posted on by

自適網頁RWD開發心得

最近大家有發現部落格的樣子隨著日子在偷偷的改變嗎?

是的！最近我在進行部落格的版面小修改！
主要訴求是要將版面改版成具有專業感、清楚、易讀，
然後呀，本部落格現在開始支援Responsive Web Design囉!(灑花~~灑花!!

其實自適網頁說穿了，只是用多組的CSS，可以在不同瀏覽環境下切換畫面的CSS，
這可以讓同一個網頁在手機以及電腦上，呈現不一樣的樣子。

RWD一般最常見是使用media queries，利用條件設定去設定裡面所設定的CSS要在何種狀況被使用。

我的開發心得

那這次的改版過程中，下面幾點是我覺得在開發RWD時要去注意的

  1. 若有需要使用JS去做網頁動態，不要將CSS直接在JS裡面加，例如 
    $(".content").css("display","none");//js

    類似上面的這種的作法都要通通避免，JS一定要避免掉所有和版面有關的設定。
    像上面這種寫法，應改成：

    $(".content").addClass("display-none");//js
    .display-none{display:none;}/*CSS*/

    這樣可以避免在切換為不同顯示方式時彼此互鄉干擾到。

  2. CSS選擇器的優先順序：
    因為在套用時，會有共通的、在某些解析度才要使用的CSS設定。
    假如當今天總共有四種不同瀏覽裝置有四種不同版面，其中想在某一種特別的裝置上套用一系列不同的CSS(只是改字體什麼等)。會需要更清楚的了解各種選擇方法在執行時的優先順序，才能用不同的選擇器去覆蓋原有設定。
    這邊有關於選擇器優先順序的詳細說明：如何撰寫有效率的CSS選擇器(CSS Selector)
  3. HTML格式架構：
    因為要應付多種的CSS套版，HTML的格式設計就很重要，應要能夠清楚表達各元素之間的子從關係，並且符合W3C的規範，這樣子在換CSS時才可以順利在不更改HTML的狀況下去更動顯示方式。

Media Queries設定方式

  1. 直接分成不同的CSS檔案，在HTML載入時宣告此CSS作用的對象 
    		<link href="/style.css" rel="stylesheet" media="all and (color)" type="text/css" />

<!--?xml-stylesheet media="all and (color)" rel="stylesheet" href="example.css" ?-->
  2. 在CSS檔裡面設定作用對象 
    @import url(/style.css) all and (color);

@media all and (color) {
  ⋮ one or more rule sets…
}

條件的用法

@media [media type] and [(media feature)]

例：如果視窗最小寬度為500px，就套用這些CSS
@media screen and (min-width:500px) {.....}

例：如果視窗為直立，就套用這些CSS
@media screen and (orientation: portrait) {.....}

例：如果視窗在400px和700px之間(兩者需同時符合)，就套用這些CSS
@media screen and (min-width: 400px) and (max-width: 700px)

例：如果是彩色螢幕或彩色投影機兩者之一(兩者符合一種即可)，就套用這些CSS
@media screen and (color), projection and (color) {.....}

屬性和值

  1. media type類型：
    2013-12-30_175631
    比較要注意的是，handheld這個值其實並沒有辦法有效的判別是否為手持設備，現在會讀handheld的手機瀏覽器有：OpenWave, Nokia lite-web browsers, Netfront, Digia, BlackBerry browser, Opera Mini until v4, Opera Mobile until v9,Palm’s Blazer, Nokia S40 browser, IEMobile 6.x and 8.x。所以若是要判別是否是使用iPhone或Android手機，可以使用下面的判斷式：

    // target mobile devices
@media only screen and (max-device-width: 480px) {
    body { max-width: 100%; }
}

// recent Webkit-specific media query to target the iPhone 4's high-resolution Retina display
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    // CSS goes here
}

// should technically achieve a similar result to the above query,
// targeting based on screen resolution (the iPhone 4 has 326 ppi/dpi)
@media only screen and (min-resolution: 300dpi) {
    // CSS goes here
}
  2. media features
    * (max-或min-)width:[數字]
    * (max-或min-)height:[數字]
    * (max-或min-)device-width:[數字]
    * (max-或min-)device-height:[數字]
    * orientation:portrait 或 landscape
    * aspect-ratio:[比值]
    * (max-或min-)device-aspect-ratio:[比值]
    * color
    * color-index
    * monochrome
    * (max-或min-)resolution:[數字]dpi
    * scan(只對tv)
    * grid
  3. 在JS裡取得螢幕的真實寬度： 
    function getWindowWidth() {
	var windowWidth = 0;
	if (typeof(window.innerWidth) == 'number') {
		windowWidth = window.innerWidth;
	}
	else {
		if (document.documentElement &amp;&amp; document.documentElement.clientWidth) {
			windowWidth = document.documentElement.clientWidth;
		}
		else {
			if (document.body &amp;&amp; document.body.clientWidth) {
				windowWidth = document.body.clientWidth;
			}
		}
	}
	return windowWidth;
}

參考資料

Posted on by

[2013-GDC]製作一個全球熱銷的遊戲

這是第一天下午的第一場演講

講者相關資訊

講者：Tap4Fun創意總監 Charlie Moseley
Email：charlie!@tap4fun.com
Twitter：@justcharlie

我的小小心得

這一場演講的講者，主要是在開發手機的APP遊戲。

手機遊戲由於可以很容易的在世界各國上架，在行銷費用不足的前提下，多一個市場就等於多一個機會，很多時候，你的遊戲會在那一個國家突然紅起來，其實是很難預測的。因此他們建議盡量要選擇一個適合在全世界都可以發行的主題來做遊戲發想。

首先他們講到的是文化，應該要選擇世界各國的人都較能了解的文化做為遊戲背景。

在最後在地化的地方，他有講一句話我很喜歡：【當你的團隊裡，有越多不同屬性的人聚集在一起，你的團隊就會更強大】。他鼓勵不同國家、不同語言、不同文化的人一起共事，並認為這會讓整個團隊更加強大。我覺得這是開發遊戲非常重要的一個重點【兼容】，我們必須放開心胸去接受更多與我們不同的背景與知識，這樣我們才可以變得更加強壯。(並且可以發想的遊戲類型也會更多)

如何發想一個國際化的遊戲

Creating concepts可以有很多創意，喜歡簡單、直觀的概念。概念越簡單越好。

  1. 概念要簡單(Simple ideas)
  2. 可以用一句話形容這個GAME
  3. 在新舊概念、熟悉與不熟間取得一個平衡(創新與熟悉的平衡)
    dd
  4. 最大挑戰：怎麼吸引所有文化的人(要了解不同文化的交集在那邊，是否有文化偏見，是否有別人不熟悉的文化背景)。例如創意來自文化或歷史，像美國禁酒時代的故事，但這段歷史很多人不了解。
  5. 以成功的Spartan Wars這個遊戲為例，這遊戲主題為斯巴達戰役及嚴酷的訓練，因為有【300壯士】這部電影為其打了基礎，人們透過這部電影，能夠對斯巴達的文化有基礎的認識，那以此為基礎的遊戲也才容易被使用者所接受。
    未命名-1
  6. 關於歷史的東西對於國際市場會較難推動(除了有該文化的國家外會不能了解)，因此要檢視人們對於這些概念可以激起一些火花，文化高速公路讓大家可以理解並感受到這些概念。

自己一定要愛自己所做的事和遊戲，如果不是很愛，就繼續找下一個idea，很多好的概念不會被實現。不要擔心失敗也不要擔心失敗了會如何，失敗的教訓是很重要的。

賈伯斯說：”The only way to do great work is to love what you do. If you haven’t found it yet, keep looking.”

一定會犯錯，不能怕犯錯，要去了解如何面對失敗。成功的人知道成功前要歷經失敗。行動遊戲非常年輕，大家都在學習。

螢幕快照 2013-12-22 下午8.24.55

不能只想著如何賺錢，舉例來說，Zynga因為花了太多時間研究使用者心態，怎麼讓使用者沉迷，怎樣賺更多錢，但因為他們要賺錢，卻賺不到。在做遊戲時，賺錢很重要，但弱因此忽略了要做『好的遊戲』的想法，卻反而會賺不到錢。

另一款遊戲Punch Quest，則是因為給玩家太多甜頭，使得玩家幾乎不用花錢就可以玩，所以下載量很高，收入卻不高。所以一開始時就要把賺錢的因素考慮進去。

另一款Tiny Tower，則是一個成功讓使用者願意花錢的遊戲。這個遊戲在猴子靈藥的部落格上面，有很詳細的遊戲性分析，請見此文：http://blog.monkeypotion.net/gamedesign/case/tiny-tower

Data Analysis

看資料要很小心，要了解使用者為什麼砍掉你的APP，一個人不可能又開發又分析，所以一定要有人來看，看資料分析可以獲得非常多的獲益。跳入資料海才可以找出獲益的供應鍊。

螢幕快照 2013-12-22 下午8.25.05

螢幕快照 2013-12-22 下午8.10.51
Monetization funnel

行銷是必需的

行銷不是一個選擇，而是必需的，要成為國際熱銷的遊戲，一定要行銷，不然太難了。一般遊戲分為大眾遊戲及小眾遊戲，在投入太多的資源之前，應審慎的評估。
螢幕快照 2013-12-22 下午8.18.01

遊戲很難預期在那個市場會特別成功，都會需要一個個去試試，在每個市場都應做好在地化。

日本、英國、南韓、美國是競爭大、收益高的國家，或也可選擇市場小、競爭小的市場，有時遊戲在那紅也很難預料，因此嘗試各國的在地化非常重要。

同時包括客服、語言支援也要有在地化支援，願意給你回應的使用者是最需要去重視的。

螢幕快照 2013-12-22 下午8.22.17

講者亦有嘗試過把同樣語言、不同國家的玩家放在一起，結果反應還蠻成功的。

Posted on by

[2013-GDC]探索過場動畫的故事

這是GDC第一天的第三場演講

講者相關資訊

講者：Brian Kindregan 首席文案 暴雪娛樂
講者信箱：bkindregan@blizzard.com
巴哈報導：探討過場動畫的故事

我的小小心得

我對過場動畫的製作比較沒有去用心了解過，之前玩魔獸時的過場動畫其實我也都是【SKIP】….(遮臉)。

所以對於這場主題比較沒有共鳴性，但據我所知，還是很多人會想要了解遊戲的故事的。雖然像我，都打到巫妖王困難模式了，還搞不清楚阿薩斯就是巫妖王的人也是有的啦….。

演講主題

  1. 過場動畫究竟有多難
  2. 很多遊戲都有動畫，怎麼串很重要

為何要有過場動畫

做動畫的，要先想為什麼要用動畫來表現效果，在玩時是讓玩家變成主角，動畫則變成旁觀者。

  1. 可用動畫重現場景。(或許玩家玩GAME時沒注意到場景的宏偉，用動畫可以更突顯場景的宏偉
  2. 其他角色更人性化。(表現其他角色個性)
  3. 衝擊最大化。(讓玩家感覺到更在槍林彈雨中)=>更了解下一個GAME在幹麻
  4. 華麗視覺的呈現。
  5. 呈現玩家的希望即恐懼感
  6. 創造一個挑戰或很艱辛的故事
  7. 遊戲的主題是什麼，讓玩家看到遊戲的進程

開場動畫讓你感到有興趣(What happen?)、希望和恐懼，女主在那?怎麼了，讓玩家有好奇心想玩下去。

開場動畫的目的

  1. 大量問題
  2. 串連兩個遊戲
  3. 引入GAME

優先選項

  1. 權力轉移
  2. 故事的建構

通常過場動畫都很緊張，要去思考這樣做好嗎?  關鍵信息有沒有表現出來。

上一段動畫裡，有表現出中心思想，吉姆代表希望，莎拉代表憤怒，以及兩者之間的核心衝突。

但沒起作用的則有：吉姆的戰敗(不再像之前一樣是個英雄，而很背動)、劇情(這兩者之前的糾結)、刀鋒女王莎拉(這次GAME的主角)、答案、故事節奏(太慢會讓玩家沒耐心)

具體實例如吉姆酗酒(電梯時已不再喝酒)

在製作動畫時，要小心不要自己沉浸在動畫裡。有幾個點要注意：

  1. 長度：兩個角色的糾葛很多，要確保對話是牽著中心思想盡量越少越好
  2. 人物與動作：要用過場動畫說明或解釋主角的狀況

因此，他們製作了第二個動畫

下面幾項在第二段動畫中有了表現

  1. 人物的動力
  2. 權力的轉移
  3. 吉姆與莎拉的角色張力
  4. 人物張力：記取教訓，問題從來不是我們看到的，像影片中硬漢對Sara束手無策(衝突感)，去體現兩個關係

回到中心思想，當今天要截短節奏，要對照一下遊戲的中心思想，去比對一下，再決定內容的時候，不管講什麼都會有人有意見，所以要知道自己要的是什麼，別人要的是什麼，要記得別人的評語，但不一定要聽他的。(了解，但要知道自己的立場和一致的信念)

Posted on by

[2013-GDC]創造遊戲之新體驗與故事性的重要性

這是我去GDC大會早上的第二場演講

講者相關資訊

講者：馬場英雄 總監製 NAMCO BANDAI
維基資料：傳奇系列
遊戲影片：時空幻境：無盡傳奇 宣傳影片
巴哈報導：GDC 台北峰會《時空幻境》製作人馬場英雄 闡述家用遊戲開發要旨

我的小小心得

這一場演講算是這兩天GDC大會中我很喜歡的演說之一。

這位製作人在看待遊戲的出發點，讓我回想起小時候玩遊戲時所獲得的那種感動。在他的想法中，遊戲是一種傳達思想與理念的方式，並期待能帶給使用者成長與感動。

現在很多人在發想遊戲時，總是會變得先去思考【如何讓使用者付錢】，而不是想做個好玩的、讓玩家感動、陪伴他成長的遊戲。【回歸最初的感動】，是我從這場演講中所獲得的收獲。

演講筆記

在這場演講中，NAMCO講了幾點他認為在遊戲中很重要的要素：

  1. 主題
  2. 信息

首先，一個遊戲一定要有主要想讓使用者獲得的東西，像是訓練反應(像Dimond Dash)、腦力激盪(Candy Crush)、物理計算(小頑皮、憤怒鳥)。
或者是像RPG，則可以傳達一個故事，讓使用者感動、或從中體驗到一些我們想傳達的東西，例如他們就有說，在他們最新的一款遊戲裡，想傳達給使用者的意念就是【選擇】，讓他們了解，人生的現在，是過去眾多的選擇所演變而成的，而未來，則是由現在的每個小選擇去決定的。

另外，因為遊戲很容易一玩就玩很久，因此信息也格外重要，要能夠讓使用者在進行遊戲的當中得到樂趣。以動作遊戲而言，就是像音效、特效等感觀刺激，以RPG而言，就是戰鬥系統(因為要練功)的製作。
玩家在玩遊戲的過程中所得到的反饋，也是遊戲裡很重要的要素之一。

Tales 系列遊戲介紹

【戰鬥系統】

戰鬥系統的操作，應要讓輕度玩家和重度玩家同時可以上手，不應只針對重度玩家，要讓所有人都可以上手。

在Tales系列開發了一個線性動作戰鬥系統，同一個場地的所有敵人怪物及小組成員，以即時反應行動進行戰鬥。戰鬥系統設計為在戰鬥時可以前後左右移動時釋出他的絕招，不需要很困難的操作就可以有一定的攻擊水準，但可以經由技術去更加加強攻擊力。

有些角色的魔法強，有些則是速度強，另外，沒有直接操作的角色可以用AI去指定。

用刀箭也有它的技巧，例如：屬性、風屬性特色等。在戰鬥時就可以抓住對方弱點去行使技巧。

在戰鬥系統要創造新的體驗，讓使用者不要膩，自己也要有成長，在這個戰鬥和遊戲的過成要伴隨著成長。

要怎麼創造新的體驗，讓玩家體驗什麼，是非常重要的!

【和主角一起成長】

遊戲應要有故事性，並且讓玩家能把自己代入遊戲的角色之中。就像電影或小說，可以從電影內容或小說情節裡面獲得感動，並隨著遊戲情節而獲得成長(傳達具有教育性的思想)。

一款好的遊戲，要讓玩家從遊戲裡可以有新的體驗。

信息的傳遞非常重要(音效、特效)

和電影或小說不同的是，遊戲是透過【操作】來讓玩家和遊戲世界互動，所以操作很重要，透過操作可以傳遞多少的訊息給使用者，讓使用者能融入這個遊戲世界，隨著角色的境遇而覺得感動或傷心，是成功的遊戲不可缺少的要素。怪物和成員角色都應該有各自的個性和特性。

舉例來說，在Tales裡的戰鬥系統有以下特色：

  1. 要考量雙方位置後去操作
  2. 速度感、快感、動態
  3. 操作簡單
  4. 有協助的角色
  5. 透過不同的角色的合作還深化遊戲性。(要怎麼提供新的玩法)

一個吸引人的遊戲-故事性

遊戲應要有故事的，不只是故事，而且要透過這個故事，去傳達一個想法、感受給使用者，每一個GAME都會有它的故事概念，透過故事可以把主題傳遞給使用者。(例：不可動搖的信念、貫徹正義)

樂趣(融入遊戲世界)

自己是否能夠讓玩家透過操控性去讓玩家演變成主角，像是玩家玩一玩流淚、融入故事當中。因此主題和訊息非常重要也是遊戲的特色。

去創造新玩法體驗，要傳遞什麼要去思考。

共存(用正反兩面角色去體現非單一的價值觀)

大家都有不同的想法，有時會衝擊思考，但大家都是共存的，要透過合作去達到目標，在說故事中，主角有各種類型的，不論是主角或敵人都應該有想法，每種想法都有正確的一面，最後若無法讓步就要透過劍與劍來戰鬥。

不同的價值感非常重要，但透過討論可以互相理解對方，Tales系列非常重視這點，小組成員也是。(傳遞訊息)

透過遊戲玩家可以去思考這些事情，這可以提高玩家對這些遊戲的認知度，帶給玩家正向影響和思考上的鼓勵。

透過遊戲的完成可以有所成長、去思考，這是為什麼Tales系列如此重視【傳遞的訊息】這塊的原因。

傳遞思想-遊戲中心思想

最新的game以【選擇】為主題，人生因為選擇而讓每個人的未來有所不同，現在是由過去的許多選擇所累積而來的

Posted on by

UITableView的小問題

紀錄一下今天開發我的APP時遇到的小問題，
因為要使用UITableView，發現UITableView放在UIView裡時，
若要使用static cells是不能直接使用的。

當我們要用UIView，裡面有放一些自己的東西，再加上一個Static cells的UITableView時，
會發現雖然在storyboard裡能夠正常的顯示表格的樣子，如下圖
螢幕快照 2013-12-11 下午6.28.52
但是當執行出來卻無法顯示已設定好的static cells，而會顯示為一片空白，如下圖
螢幕快照 2013-12-11 下午6.31.55
查問Google大神後，在這邊有看到文章有相關的建議，也就是要我們不要實作下面這三個方法

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
}

不過，我檢查過後，我並沒有設定這三種方法，但是還是一樣無法正常顯示定義好的static cells，
最後這篇文章解決了我的疑問：How do I put a UITableView into a UIView
原來，我們不能夠直接在UITableView裡直接使用static cells，
如果必需在static cells的畫面裡加上其他元素，則應該要在該位置放入Container，然後Container連接至UITableViewController畫面，
如下圖：
螢幕快照 2013-12-11 下午6.41.42

這樣子便能夠正常的顯示在storyboard裡設定的static cells的樣式了！
螢幕快照 2013-12-11 下午8.15.14
PS:這邊有Container View與母容器互動的範例文章與範例專案

Posted on by

iOS6以上控制螢幕旋轉

一般的設定方式

//支援Xcode 4.5
- (NSUInteger) supportedInterfaceOrientations{
//僅正面
// return UIInterfaceOrientationMaskPortrait;

//支援縱向 （利用 | 設定多參數）
// return UIInterfaceOrientationMaskPortrait
// | UIInterfaceOrientationMaskPortraitUpsideDown;

//支援橫向
//UIInterfaceOrientationMaskLandscape: 支援按鈕在左、按鈕在右
// return UIInterfaceOrientationMaskLandscape;

//支援四個方向
return UIInterfaceOrientationMaskAll;

}

- (BOOL) shouldAutorotate {
return YES;
}

TabBarController設定方式

假使今天要控制所有畫面中，某些可支援旋轉，某些不行，
在有使用Navigation Controller和TabBarController的狀況時，
則需要這樣設定：

  1. 勾選支援畫面旋轉
    螢幕快照 2013-12-11 下午3.36.26
  2. 在AppDelegate加上這段程式碼 
    - (NSUInteger)application:(UIApplication *)application supportedInterfaceOrientationsForWindow:(UIWindow *)window
{
    NSUInteger orientations = UIInterfaceOrientationMaskAll;

    if (self.window.rootViewController) {
        UIViewController* presented = [[(UINavigationController *)self.window.rootViewController viewControllers] lastObject];
        orientations = [presented supportedInterfaceOrientations];
    }
    return orientations;
}
  3. 在tabBarController裡加上 
    -(BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation{
    return [self.selectedViewController shouldAutorotateToInterfaceOrientation:interfaceOrientation];
}

-(NSUInteger)supportedInterfaceOrientations{
    if (self.selectedViewController)
        return [self.selectedViewController supportedInterfaceOrientations];

    return UIInterfaceOrientationMaskPortrait;
}

-(BOOL)shouldAutorotate{
    return [self.selectedViewController shouldAutorotate];
}
  4. 不支援旋轉的子畫面加上 
    - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
    return (interfaceOrientation == UIInterfaceOrientationPortrait);
}

- (BOOL)shouldAutorotate
{
    return NO;
}

- (NSUInteger)supportedInterfaceOrientations
{
    return UIInterfaceOrientationMaskPortrait;
}
  5. 要支援旋轉的子畫面加上 
    - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
    return YES;
}

- (BOOL)shouldAutorotate
{
    return YES;
}

- (NSInteger)supportedInterfaceOrientations
{
    return UIInterfaceOrientationMaskAllButUpsideDown;
}

Navigation Controller設定方式

若要控制在Navigation Controller之下的單獨畫面是否支援旋轉，則需要在Controller裡加上這段

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
    return [self.visibleViewController shouldAutorotateToInterfaceOrientation:interfaceOrientation];
}

- (BOOL)shouldAutorotate {
    return [self.visibleViewController shouldAutorotate];
}

- (NSUInteger)supportedInterfaceOrientations {
    return [self.visibleViewController supportedInterfaceOrientations];
}
Posted on by

What’s New in Xcode 5

Asset catalogs (圖片結構)

  1. 在XCode5，因為要支援在不同設備使用不同解析度的圖片，我們可能有很多種不同版本且不同檔名的圖片。這時便可以使用Xcode5的新功能Asset catalogs，它會提供一個介面，讓我們可以將一組圖片設定為一個群組，以及要使用的裝置對象。
    如下圖
    2013-11-22_173500
    然後在程式裡使用

    UIImage *myImage = [UIImage imageNamed:@"blueBG"];

    來使用圖檔。

  2. 這個功能最大的好處就是，圖片不再需要強制要用名稱來代表針對的裝置，如@2x, ~iphone,~ipad或-568h，而可以由使用者來定義那些圖是針對那種裝置的。
  3. 假使將發佈目標設定為IOS7，Xcode會將asset catalogs編成二進位檔案，這將可以讓APP的下載時間縮短。

Image slicing

  1. 現在XCode新增對圖片的”九宮格縮放”設定，這是為了讓同一張圖片可以針對不同的裝置、不同解析度的狀況下做縮放，而不致讓圖片變型。
    2013-11-22_174607
    下圖是選擇Stretches和Tiles的差異，可以看出，是中間的圖片的拉長方式有所差異。
    2013-11-22_175913
  2. 這個功能可以使圖片可以輕易縮放至任意大小，只需設定center mode以及把素材使用至專案裡就好。

Auto Layout improvements

  1. 在iOS7的autoLayout有很大的改變，幾乎所有的設定都可以在storybaord上面來做。差異點大置有：
    1. Interface Builder不再會在移動物件後，自動改變constraints，但可以選擇是使用原本設定或是接受新的條件
    2. 可以輕易的設定兩個UIView之間的constraints(按control+拖曳)
    3. There are new controls to solve common Auto Layout problems, such as the Pin
      and Resolve Auto layout Issues buttons in interface builder, which let you
      clear constraints, reset to the suggested constraints in Interface Builder, add
      missing constraints, updates constraints, update frames, and more
    4. 有更直觀的設定constraints介面
      2013-11-22_181904

Preview window

XCode5可以預覽APP在ios6及ios7的顯示差異，首先點Assistant Editor(右上方)
2013-11-22_182338
然後點下圖紅圈處
2013-11-22_182353

再點右下的控制項來選擇要預覽的版本
2013-11-22_182138

Language improvements

  1. @import允許只單一import一個類別，如： 
    #import "ViewController.h"
 #import "MyScene.h"
@import AddressBookUI.ABNewPersonViewController; @implementation ViewController
 - (void)viewDidLoad
 {
}
  2. instancetype：和id相同功能，但只能用在傳回的參數上。它代表著是自己的類別或自己的子類別，當若是在alloc init時，沒有傳回自己類別或自己的子函數類別時，編譯器會提示錯誤。如： 
    @interface Car : NSObject +(instancetype) car;
@end

    此時若NSString * car = [Car car];
    會出現Incompatiable pointer types initializing 'NSString *' with an expression of type 'Car *'的警告訊息

Documentation improvements

  1. 右邊頁籤有quick help（點option+alt也可以跳窗方試顯示help）
    螢幕快照 2013-11-21 下午5.56.33
  2. 可在自定函數上面使用//增加註解，或用/*! — */增加更詳細的註解，如： 
    /*! 函數說明
* \param 第一個參數
* \param 第二個參數
* \returns 返回值
*/

Debugging improvements

  1. Data Tips: 下中斷點時，游標移到變數上，可以看到此時變數的值。
    Debugging1
  2. Quick Look：讓變數的內容以圖形化的方式呈現，例如
    2013-11-22_1839162013-11-22_183930
  3. 在Debug介面裡新増了CPU和memory的使用量。也可以自己增加要監控的屬性，如用電量、iCloud 活躍度、OpenGL使用的frame rates。
  4. 點選Product > Perform Action > Analyze file name可分析單一檔案的效能

Source control improvements

Performance improvements

Posted on by

BLE(Bluetooth Low Energy)簡介

參考資料：

  1. TI BLE課程
  2. Core Bluetooth on iOS

Bluetooth Low Energy技術及其特點

  1. BLE是Bluetooth 4.0的一部份
  2. 特點為：低功耗(很省電，可以用一顆鈕扣般大小的電池，維持運作一年以上的壽命)、低延遲、低吞吐量(傳輸速度低)
  3. 不需要像傳統的藍芽，一定要經過MFi認證才可與蘋果設備連接。
  4. 傳輸速率低於100kb/s，而傳統藍芽則大於3mb/s
  5. BLE、傳統藍芽以及Wifi的比較：
    2013-11-15_171626
    如上圖所示，Wifi、傳統藍芽以及BLE都是在同一個頻段下，左圖紅色部份是三個廣播頻道，避開WIFI了幾個常使用到的頻段，也因此wifi與BLE可以有良好的互存性。在右上的圖代表這三種傳輸方式所需要的供電量，右下的圖則是顯示這三種的傳輸量的比較圖。
  6. 現有的Bluetooth類型大致有下面三種，左邊的就是BLE，中間的可以連接BLE及傳統藍芽，右邊的只能與傳統藍芽設備或是Bluetooth Smart Ready連接，Bluetooth Smart Ready則可與這三種任何一種進行連接。
    2013-11-15_172908
  7. Bluetooth Dual Mode也就是上面所畫的Bluetooth Smart Ready設備，可同時與傳統藍芽以及BLE做連接。和BLE連接時便使用BLE的模式、耗電量也與BLE相同。和傳統藍芽則也是使用傳統藍芽的功耗、傳輸速度及模式。

Bluetooth Low Energy協議

  1. 分為Controller、Host及App層
    2013-11-15_174159

    1. Physical Layer：物理層
    2. Link Layer：鏈路控制層
    3. HCI：提供標準藍芽事件及通知層
    4. Logical Link Control and Adaption Protocol：負責連接和事件
    5. Security Manager：配對、數據加密這類
    6. Attribute Protocol：所有數據傳輸經過這層實現(ATT)，定義了Client和Server，Client就傳Request，Server傳response。
    7. Generic Attribute Profile：具體實現數據的傳輸(GATT)。Server上所有的ATT都被實作了，成為一個個的。Services，通過這樣的形式把數據包給Client。把ATT定義的屬性根據不同的服務進行歸類、組合，同時把一系列的讀寫整合起來，成為一系列的數據通信操作流程，提供給上層的Profile去用。
    8. Generic Access Prifile：設備查找、連接建立(GAP)，定義了四個角色
      。Peripheral和Central：兩個設備連接後，進行通訊的角色。Peripheral通常是連接外面的設備(從設備)，例如說血壓計等等。而Central則是連接主設備，例如手機、電腦等等。Peripheral通常是ATT及GATT的Client，Central通常是ATT及GATT的Server。
      。Broadcaster和Observer：兩個設備在不見連接的時後，進行通訊的角色。Broadcaster會通過一個簡單的設備，不斷的把數據丟出去，例如一個單純的溫度計。Observer則接收這些封包把相應的溫度值儲存起來。
    9. App層：一些PROFILE和一些應用組成。在APP層經過Profile的實做，來做讀寫操作的動作。

Connection parameter連接參數

  1. 連接參數會直接影響BLE的性能以及功耗，非常重要
  2. 在兩個BLE設備建立連接以後，所有的通信都是在Connection Event進行通訊，下圖是一張BLE通訊時耗電量的示意圖，橫軸代表時間、縱軸代表耗電量。所以可以看到，設備建立連線的大部份時間，都是處於Sleeping狀態下，並且在此時耗電量很低，這也是BLE省電的主要原因。另外在每次的Connection Event開始時，會由Master發起通訊要求，然後由Slave回覆。
    2013-11-18_174034
  3. 參數介紹：
    。Connection Interval：多久開始一次Connection Events。這會影響到BLE的傳輸速度和耗電。
    。Slave Latency：為了節省Slave的電源，當Slave沒新的事件要傳給Master時，最多可忽略幾個Master發起的通訊要求。
    。Supervision Timeout：設定當多久沒有收到任何通訊要求時，中斷連線。
    上面數值必需滿足以下條件Supervision Timeout > (1 + Slave Latency) * (Connection Interval)
    這是因為Slave Latency不能算在Supervision Timeout裡面，否則會造成不正常斷線
  4. 上面三個參數都是可以在連線建立之後動態修改的，因此實際應用開發的時候，大家可以根據實際需求配置上面三個參數

產品上市

  1. 產品要在全球各地的市場上市，要能夠通過SIG的認證(https://www.bluetooth.org/)
  2. 另外有一個Unplug Fests，可以測試藍芽相關功能
  3. 相關資訊請看：http://v.youku.com/v_show/id_XNTk4MDU1NDY4.html

蘋果對iOS上的BLE開發要求

  1. 在連接時iPhone設備時，不能直接取得IEEE的地址，而是取得一個resolvable address。也因此無法直接對iOS設備做advertisements
  2. 連接參數上，Interval必需大於20毫秒，小於2秒。Supervisor time 小於等於6秒。Slave latency小於等於4秒。
  3. 在iOS裡，會隱藏藍芽物理地址、Characteristic handles、Characteristic descriptors、以及連接參數。雖然連接參數在iOS裡是可以設定的，但假如在連接後，經由Slave去修改連接參數，則這些被修改的數值是沒辦法取得的。
  4. 我們無法直接獲得IEEE地址，但在iOS7裡可以使用UUID來進行連線
    2013-11-18_190345
  5. 重新連線的狀況：分別看前景、背景、暫停狀況下的設定方式
    2013-11-18_190436
  6. 尋找外接設備
    2013-11-18_190810