본문 바로가기

맥, iOS

iOS library 002 - MBProgressHUD (progress ...)

iOS library .... 은  iOS에서 쓸만하다고 생각되는 라이브러리를 소개하고, 간단하게 만들어보는 ... 그런.. 거에요.


첫 번째는 progress 였구요. 이번에도 progress에요 :)


하하;;; 


절대 다른 라이브러리들이 길어서, 포스팅이 길어질까바, 짧은 것 찾아내서 하는거에요.


암튼 이번 라이브러리는 MBProgressHUD 라는 것인데요. MIT 라이센스로 사용할 수 있습니다. 


아래는 git 주소구요.


https://github.com/jdg/MBProgressHUD


음 그럼 준비하기 부터 보시죠.



1. 준비하기


- git에 가셔서 zip 파일로 다운로드 하십니다.

- 압축을 적당한 곳에 풀어버립니다.

- 소스 중에 MBProgressHUD.h 와 MBProgressHUD.m을 사용하고자 하는 프로젝트로 불러옵니다.


불러오는 방법은 다들 아시겠지만 간략하게..  먼저 Fig. 1은 프로젝트에서 추가하려는 그룹에 오른쪽 버튼을 클릭하면 나오는 화면이죠?


거기서 Add Files to "프로젝트 이름"... 을 클릭하시면요. Fig. 2와 같이 화면이 나오지요. 거기서 MBProgressHUD.h 와 m을 불러오세영.


Fig. 1. 프로젝트에서 오른쪽 마우스 클릭하면 보이는... 화면.



Fig. 2. Fig. 1에서 Add Files to "프로젝트 이름"... 을 클릭하면 나오는 화면.


그래서 나온 결과가 아래와 같아요 ㅋ 


Fig. 3. MBProgressHUD를 추가한 화면이죠.


준비 끝. 


그럼 사용을 위해서 Storyboard에서 버튼들을 추가해서, 한 번 잘 돌아가는지 확인해보죠.




2. 사용하기


사용 방법이 몇 가지 있는데요. 여기서는 라이브러리 git 사이트에서 제공하고 있는 것 중에 가장 간단한 것을 테스트해볼께요.


일단 Fig. 4와 같이 스토리보드에 버튼을 하나 만들구요.


Fig. 4. 버튼을 하나 만들었어요.


버튼을 ViewController에 Action으로 연결해줍니다. 저는 progressStart 라고 만들었구요. 


ViewController 헤더에 #import "MBProgressHUD.h"를 추가합니다. 아래 그림과 같이 하시면 되겠죠.


Fig. 5. ViewController.h 캡춰.


헤더의 소스 코드는 여기요.


#import <UIKit/UIKit.h>


#import "MBProgressHUD.h"


@interface PEViewController : UIViewController


- (IBAction)progressStart:(UIButton *)sender;


@end



그럼 버튼을 누르면 아래와 같은 그림에 나타낸 것 처럼 소스를 작성하시면 progress가 작동합니다. 


저는 sleep(5)를 통해서 5초 동안 프로그래스가 돌아가는 화면을 캡춰했구요. 


여러분들은 실제 처리 과정을 넣으시면, 그 동안 progress가 나타나겠죠? 


Fig. 6. ViewController.m 파일 캡춰.

소스는 여기요.


#import "PEViewController.h"


@interface PEViewController ()


@end


@implementation PEViewController


- (void)viewDidLoad

{

    [super viewDidLoad];

// Do any additional setup after loading the view, typically from a nib.    

}


- (void)didReceiveMemoryWarning

{

    [super didReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}


- (IBAction)progressStart:(UIButton *)sender {

    [MBProgressHUD showHUDAddedTo:self.view animated:YES];

    dispatch_async(dispatch_get_global_queue( DISPATCH_QUEUE_PRIORITY_LOW, 0), ^{

        // Do something...

        sleep(5);

        

        dispatch_async(dispatch_get_main_queue(), ^{

            [MBProgressHUD hideHUDForView:self.view animated:YES];

        });

    });

}

@end


자. 그럼 실행 화면은요?



3. 실행화면


끝 !