Just a Computer Graphics Studio & My Life

Posts tagged ‘user interface’

[APP] 小米運動之睡眠

小米運動App最近更新到3.0版,介面看起來更加「討喜」,因為它會分析你的紀錄,來跟所有使用者比較,還會貼心跟你說「入睡太晚」XD~

這張圖表示深淺眠分布狀況,我昨晚深淺比例為2:3,它建議我22時前睡覺比較好!

APP 小米運動之睡眠00003

69分不知道依據為何?我想要觀察一陣子才會知道~

(繼續閱讀…)

廣告

[iOS] Label 文字分散對齊 (Label Text Decentralized Alignment)

原本使用的元件UILabel只有置左、中、右三種選擇,然而有時候我們想要Label文字分散對齊,原本我想要找第三方套件,不過想起上個月研蘋果有在粉絲團上分享解法,於是就拿來嘗試,果真用內建的CATextLayer就能做到!

[iOS] Label 文字分散對齊 (Label Text Decentralized Alignment)

(繼續閱讀…)

[iOS] NSRunLoop和NSTimer

製作一個好的App有非常多因素,而其中使用者體驗非常重要,影響用戶是否會繼續使用我們的App。

原本以為Timer會固定時間就觸發,然而在多線程的狀況下並不是如此,因為每個事件都會被排程,假如前面執行事件會花長時間,就會影響原本我們預定時機點想觸發的Timer。

目前遇到的狀況:

手指滑動TableView,原本每秒執行的Timer卻不運作,直到放開手指。

原來把Timer加入到RunLoop就能解決問題!

程式碼這麼寫:

    timer = [NSTimer timerWithTimeInterval:1.0 target:self selector:@selector(updateTime:) userInfo:nil repeats:YES];

    [[NSRunLoop mainRunLoop] addTimer:timer forMode:NSRunLoopCommonModes];

果真它就如預期運行了!

(繼續閱讀…)

[iOS] NavigationBar 阻擋視圖問題

為了下週五中秋節放連假四天,今天公司在家上班,不過我還是跑來辦公室,因為效率會比較好,尤其在大家都不在的時候XD~

過去我不太想用內建的NavigationBar,因為有一些潛在惱人的問題,所以一直都是自己刻介面。不過總有會用到內建的NavigationBar,還是要來解決一下NavigationBar 阻擋視圖問題

ios-edgesforextendedlayout

(繼續閱讀…)

[iOS] UIAlertController

UIAlertView已經被棄用,iOS 8開始由UIAlertController取代它囉!如此變得更親切迷人~

iOS UIAlertController.jpg

過去能透過UIAlertView做出可填寫欄位UITextField,現在UIAlertController也能實現,而且更加方便好操作。

例如上圖程式碼這麼寫:

/**
 Theme: UIAlertController
 IDE: Xcode 7
 Language: Objective C
 Date: 105/03/30
 Author: HappyMan
 Blog: https://cg2010studio.wordpress.com/
 */
    UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"修改暱稱"
                                                                   message:@""
                                                            preferredStyle:UIAlertControllerStyleAlert];
    [alert addTextFieldWithConfigurationHandler:^(UITextField *textField) {
        // optionally configure the text field
        textField.keyboardType = UIKeyboardTypeDefault;
    }];

    UIAlertAction *okAction = [UIAlertAction actionWithTitle:@"送出"
                                                       style:UIAlertActionStyleDefault
                                                     handler:^(UIAlertAction *action) {
                                                         UITextField *textField = [alert.textFields firstObject];

                                                     }];
    [alert addAction:okAction];

    UIAlertAction *cancelAction = [UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {

    }];
    [alert addAction:cancelAction];

    [self presentViewController:alert animated:YES completion:nil];

看要增加幾個選項按鈕都可以,而且都是用Block來做後續處理,不用再像過去還要跳來跳去的Delegate

參考:About UIAlertView with Textfield

[iOS] 介面陰影效果 (UI Shadow Effect)

想讓介面看起來更加立體,不用再等設計師出圖囉~只要是簡單的陰影效果,我們可以直接使用程式碼做出效果來!

程式碼非常簡單,我是在cell上的cellView做陰影,可以設定顏色、半徑、透明度、位置等等,原本是白色黏在底部,套用後變成漂浮在上頭。

    cell.cellView.layer.shadowColor = [[UIColor blackColor] CGColor];
    cell.cellView.layer.shadowRadius = 2.0;
    cell.cellView.layer.shadowOpacity = 0.3;
    cell.cellView.layer.shadowOffset = CGSizeMake(0.0, 2.0);

原始樣子:

iOS 介面陰影 UI Shadow

應用效果:

iOS 介面陰影 UI Shadow2

有空就美化一下介面吧!該凸的就凸,該凹的就凹,會很吸引眾人的目光:P~

[iOS] 拉伸影像 (Stretch Image)

iPhone發展至今已有至少4種尺寸,如3.5、4、4.7、5.5吋,我們想要在螢幕上顯示等比例的影像,這張影像不是要準備四張圖,就是必須拉伸那一張圖。我們現在想要使用一張按鈕圖,在四種尺寸上顯示為靠左右邊,這麼小張(49×49)的圖勢必要做拉伸影像 (Stretch Image)

button_y

只提供一種尺寸的好處是節省設備的空間,也讓美術設計師省去產生圖檔的時間。

我們想要如下的效果⋯⋯

iOS 拉伸影像 Stretch Image3

(繼續閱讀…)

標籤雲

%d 位部落客按了讚: