Just My Life & My Work

Posts tagged ‘user interface’

[APP] 悠遊錢包 (Easy Wallet)

自從八年前上大學開始,搭捷運和搭公車就會使用學生悠遊卡,現在出社會有了信用卡,當然也少不了有悠遊卡功能的悠遊聯名卡

有了這張悠遊卡 (Easy Card),想要搭乘交通工具(如捷運、公車、計程車等)去哪兒都相當方便,現在到某些知名店家(如便利商店、光南、星巴克、四海遊龍等)也能用來付款了!

身為iOS App軟體工程師的我,想要來研究悠遊錢包 (Easy Wallet),因為它的介面做得很吸引我!美中不足的地方在於,它只能顯示近三個月的消費資料,更早以前的紀錄大概都被刪除了,這就像人的記憶,隨著時間被淡忘了~

Easy Wallet00005

這個App設定最多只能登記五張悠遊卡。

(繼續閱讀…)

[iOS] HTML的CSS轉為NSAttributedString

曾經以為TextFieldTextView裡的字只能統一屬性來顯示,從iOS 6開始它們都有了attributedText這個屬性,之後可以在字體間顯示不同的效果。

@property(nonatomic,copy)   NSAttributedString     *attributedText NS_AVAILABLE_IOS(6_0); // default is nil

現在我們想更進一步知道,如何將HTML的CSS轉為NSAttributedString,之後看到網頁排版漂亮,就可直接拿來套用!

這是html呈現的字樣~

CSS to NSAttributedString - web

此外,可參考先前介紹的文章:多重文字屬性 (Multiple Text Attribute)LABEL裡的行距LABEL裡的字距

(繼續閱讀…)

使用者體驗與使用者介面 (UX and UI)

我一直覺得最令人欽佩的人是把事情從複雜變簡單,將專業領域的知識術語用非常「親民」的話描述出來,讓普遍大眾都能「啊哈」這樣驚訝地理解!

UI UX

電腦資訊領域使用者體驗與使用者介面 (UX and UI)時常讓人分不清楚,特別是在智慧手機平板電腦出現後,設計師任何人越來越重視UX和UI,因為可以與這些裝置有更多的「互動」,進而讓生活更加豐富與美好。

(繼續閱讀…)

[iOS] 客製化CollectionViewCell (Customize CollectionViewCell)

雖然可以客製化TableViewCell (Customize TableViewCell)來完成,但是客製化CollectionViewCell (Customize CollectionViewCell)能讓我們更簡單地實作,而且landscape和portrait這兩種界面的轉換它都幫我們處理好,接著只要撰寫幾行程式碼,就可以做出像內建相簿那樣的格子瀑布流喔!

collection view portrait

portrait的樣子。

(繼續閱讀…)

[iOS] 隱藏和出現狀態列 (Hide & Show Status Bar)

既然能夠改變狀態列文字的顏色,那如果我覺得它太醜⋯⋯而想隱藏狀態列的話該怎麼做?

status bar show

在地圖上的狀態列是有愛眼呢~

(繼續閱讀…)

[iOS] Label裡的行距

承接Label裡的字距,也可以調整行距!讓界面越來越好看吧~

Line spacing in UILabel1

此為參數40的效果。

(繼續閱讀…)

[iOS] Label裡的字距

界面是決定使用者持續使用的重要因素之一,文字預設的排版不是很好看,好在有method可以調整之。

character spacing in UILabel2

經過程式設定參數7的字距

(繼續閱讀…)

[iOS] TextField和TextView顯示圓角

視圖圓角這篇文章中介紹過,只要是繼承UIView的子類別都可以實現圓角的效果~所以當然TextField和TextView也可以顯示圓角囉!除了可以變成不同程度的圓角,還可以改變框的厚度和顏色。

Frame of TextField and TextView no round

預設TextField和TextView的角都是直角

Frame of TextField and TextView with round

經過程式設定後變圓,而且顏色設定為灰色

(繼續閱讀…)

[iOS] 影像快取 (Image Cache)

時常需要從網路上抓取影像載入APP裡頭,尤其是在TableView的cell頻繁消失又出現的狀況,會不停地重複同樣(下載顯示)的動作,這樣子做不是不行,然而使用者體驗會有點差,儘管已經用多執行緒去抓圖和載圖,操作上還算相當順暢,然而使用者還是會看到影像怎麼這時候消失變出現,接著又滾回去又從消失變出現,使用者體驗實在相當糟糕⋯⋯

於是想當然爾,我們會想要把已經載入的圖給暫存起來,下次要顯示時直接抓暫存在記憶體中的影像快取 (Image Cache)即可!
(繼續閱讀…)

[iOS] 使用界面載入視圖

假如我在.xib有以下的元件,想要載入到ViewController中,該怎麼做呢?並且要能在ViewController中控制兩個元件。

iOS 使用界面載入視圖

(繼續閱讀…)

標籤雲