2013年2月26日 星期二

iOS-PhotoLibrary

利用剛開學趕快惡補上學期iOS沒學好的部分,上學期一直沒碰到相簿QQ
這次寫的code目前還是半成品,不過簡單的相簿瀏覽功能至少沒問題,稍微筆記一下,之後再把拍照的功能補上
1. 先做了簡單的layout

2. 在相簿的部分需要注意的幾個步驟:
a. create UIImagePickerController的物件
b. 需要遵守兩個protocol
   |- UINavigationControllerDelegate
   |- UIImagePickerControllerDelegate
c. 把delegate設為自己(ie. picker.delegate = self)
d. 設定sourceType為UIImagePickerControllerSourceTypePhotoLibrary
e. 最後用presentViewController(用model的方式)的方式開啓的方式開啓

完成上面的5個步驟後,按下button "PhotoAlbum"就可以顯示相簿惹:)
3. sample code:
- (IBAction)PhotoAlbumBtn:(id)sender {
    
    //建立UIImagePickerController的物件
    UIImagePickerController *picker = [[UIImagePickerController alloc]init];
    //把delegate設為自己
    picker.delegate = self;
    //設定sourceType為UIImagePickerControllerSourceTypePhotoLibrary
    picker.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
    //以model的方式把頁面轉換到picker的頁面
    [self presentViewController:picker animated:YES completion:nil];
}
4. 上面程式碼run的結果:

5. UIImagePickerController需要注意的幾件事:
a. UIImagePickerController的sourceType主要來源有
   |- UIImagePickerControllerSourceTypeSavedPhotosAlbum(從相機照相後產生的圖片庫)
   |- UIImagePickerControllerSourceTypePhotoLibrary(包含電腦同步和相機的圖片庫)
   |- UIImagePickerControllerSourceTypeCamera(從相機鏡頭取得的動態相片)

b. 呈現UI界面是用[self presentViewController:picker animated:YES completion:nil]

6. 最後實作點擊照片後顯示照片的頁面
a. 先實作picker的delegate
//此delegate處理的是當用者選取完照片之後的動作
//裡面的變數info的每個element代表的是每一張照片
- (void)imagePickerController:(UIImagePickerController *)picker 
didFinishPickingMediaWithInfo:(NSDictionary *)info
c. 實作點開後的頁面
7. delegate內的實作
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info{
    //用UIImagePickerControllerOriginalImage來獲得使用者點了哪張照片
    UIImage *image = [info objectForKey:UIImagePickerControllerOriginalImage];
    //設定照片
    PADetailViewController *detailPage = [self.storyboard
                                          instantiateViewControllerWithIdentifier:@"detailPageController"];
    detailPage.image = image;
    [picker pushViewController:detailPage animated:YES];
}
從官網上查到UIImagePickerControllerOriginalImage的敘述:
Specifies the media type selected by the user -> 指定user選取到的照片
8. 在detailViewController需要實作
- (void)awakeFromNib
這個function
按照官網的敘述:
Prepares the receiver for service after it has been loaded from an Interface Builder archive, or nib file.
表示當receiver load interface Builder或nib/xib檔案之後,提供一個service給此receiver(物件)
簡單來說就是當detail page load view之後提供自定的服務功能給detail page
9. 實作awakeFromNib:
- (void)awakeFromNib{
    
    //設定width和height
    float width = [[UIScreen mainScreen] bounds].size.width;
    float height = [[UIScreen mainScreen] bounds].size.height;
    //creat scrollView的object
    scrollView = [[UIScrollView alloc]init];
    //讓scrollView能夠zoom
    scrollView.minimumZoomScale = 0.1f;
    scrollView.maximumZoomScale = 2.0f;
    
    //設定scrollView的frame大小
    scrollView.frame = CGRectMake(0, 0, width, height);
    //設定scrollView裡面的image邊框的距離
    //按照官網的敘述 -> The distance that the content view is inset from the enclosing scroll view.
    //UIEdgeInsets UIEdgeInsetsMake (
    //                               CGFloat top,
    //                               CGFloat left,
    //                               CGFloat bottom,
    //                               CGFloat right
    //                               );
    scrollView.contentInset = UIEdgeInsetsMake(50, 0, 0, 0);
    //設定背景顏色
    scrollView.backgroundColor = [UIColor blackColor];
    scrollView.delegate = self;
    scrollView.contentSize = CGSizeMake(1024, 1024);
    
    imageView = [[UIImageView alloc]init];
    //把imageView加入到scrollView中
    [scrollView addSubview:imageView];
}
10. 我的程式碼(用git clone下載)
myCode

沒有留言:

張貼留言