1. 程式人生 > >iOS_4_表情排列

iOS_4_表情排列

eve idt csdn out segmented make obj bounds 位置

終於效果圖:


技術分享


BeyondViewController.h

//
//  BeyondViewController.h
//  04_表情排列
//
//  Created by beyond on 14-7-22.
//  Copyright (c) 2014年 com.beyond. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface BeyondViewController : UIViewController
@property (weak, nonatomic) IBOutlet UISegmentedControl *segment;
- (IBAction)segmentValueChanged:(UISegmentedControl *)sender;

@end






BeyondViewController.m

//
//  BeyondViewController.m
//  04_表情排列
//
//  Created by beyond on 14-7-22.
//  Copyright (c) 2014年 com.beyond. All rights reserved.
//

#import "BeyondViewController.h"
// 加入button的tag,由於segment值改變時,要將button置於數組最後面
#define kAddButton_Tag 99
@interface BeyondViewController ()

@end

@implementation BeyondViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    NSLog(@"view did load");
    
    
    int colsNum = _segment.selectedSegmentIndex + 2;
    // 調用自己定義方法  加入images
    [self alinmentWithCols:colsNum];
    // 加入一個 button放到最後面,目的是:點擊button就能夠加入一個imageView到最後
    [self addBtn];
}

// 加入一個 button放到最後面,目的是:點擊button就能夠加入一個imageView到最後
- (void)addBtn
{
    // sg_btn 代碼生成button 1,實例化
    UIButton *btn = [[UIButton alloc]init];
    // 2,設定詳情
    // 正常狀態
    btn.tag = kAddButton_Tag;
    [btn setTitle:@"normal" forState:UIControlStateNormal];
    [btn setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
    
    [btn setBackgroundImage:[UIImage imageNamed:@"sub_black_add.png"] forState:UIControlStateNormal];
    // 點擊時高亮狀態
    [btn setTitle:@"highlighted" forState:UIControlStateHighlighted];
    [btn setTitleColor:[UIColor blueColor] forState:UIControlStateNormal];
    
    [btn setBackgroundImage:[UIImage imageNamed:@"sub_blue_add.png"] forState:UIControlStateHighlighted];
    // 為button加入點擊事件
    [btn addTarget:self action:@selector(addBtnClick:) forControlEvents:UIControlEventTouchUpInside];
    
#warning 以下全是通過i 計算i的排列坐標
    NSArray *array = self.view.subviews;
    // button的排號為i,通過 i 算出行號,列號,坐標x y
    int i = array.count-1;
    // 調用自己定義的方法,通過控件在格子中的索引即排號,算出其應該在哪一行,哪一列,從而得到其坐標
    CGPoint btn_pos = [self getPositionByIndexInCell:i];
    btn.frame = CGRectMake(btn_pos.x, btn_pos.y, 60, 60);
    
    // 3,加入button到self.view
    [self.view addSubview:btn];
}
// 通過控件位於格子裏面的i,即排號,得到它位於哪一行哪一列,從而返回其x,y
- (CGPoint)getPositionByIndexInCell:(int)i
{
    int colsNum = _segment.selectedSegmentIndex + 2;
    //NSLog(@"在格子裏面的排號i為 %d",i);
    // 第0個即排頭的表情的y
    int firstImgY = 60;
    // 表情之間的凈間距
    int imgMargin = (self.view.frame.size.width-60*colsNum)/(colsNum+1);
    // 第0個即排頭的表情的x
    int firstImgX = imgMargin;
    
    // 第i個表情(這兒是button) 所在的行號
    int row = i/colsNum;
    // 第i個表情(這兒是button) 所在的列號
    int cols = i%colsNum;
    int x = cols * (60+imgMargin)+firstImgX;
    int y = row * (60+imgMargin)+firstImgY;
    return CGPointMake(x, y);
}
// 當點擊 + 號button的時候,創建 一個隨機的imgView,並加入到self.view裏面,註意imgView位置,以及btn的位置
- (void)addBtnClick:(UIButton *)sender
{
    // 1,類方法創建控件
    UIImageView *imgView = [[UIImageView alloc]init];
    // 2,控件細節
    int rand = arc4random_uniform(9);
    NSString *imgName = [NSString stringWithFormat:@"01%d.png",rand];
    imgView.image = [UIImage imageNamed:imgName];
    // 屏幕寬高
    CGSize winSize = self.view.bounds.size;
    int orgin_x = arc4random_uniform(winSize.width);
    int orgin_y = arc4random_uniform(winSize.height);
    imgView.frame = CGRectMake(orgin_x, orgin_y, 0, 0);
    // 3,將控件加入到當前控制器的view
    [self.view addSubview:imgView];
    [UIView animateWithDuration:1 animations:^{
        // 動畫實現2個要求:1,為新加入的imgView設置x y 2,為button又一次設置x y
        NSArray *array = [self.view subviews];
        // 排號為i,通過 i 算出行號,列號,坐標x y
        int imgView_i = array.count-3;
        int sender_i = array.count-2;
        // 調用自己定義的方法,通過控件在格子中的索引即排號,算出其應該在哪一行,哪一列,從而得到其坐標
        CGPoint imgView_pos = [self getPositionByIndexInCell:imgView_i];
        CGPoint sender_pos = [self getPositionByIndexInCell:sender_i];
        
        
        // 又一次設置新加入的imgview的位置 以及 加入button的位置
        imgView.frame = CGRectMake(imgView_pos.x, imgView_pos.y, 60, 60);
        sender.frame = CGRectMake(sender_pos.x, sender_pos.y, 60, 60);
    }];
}
// 自己定義方法,參數:圖片名 010.png ~ 018.png x坐標 y坐標
- (void) addImg:(NSString *)imgName x:(CGFloat)x y:(CGFloat)y
{
    // 1,實例化
    UIImageView *imgView = [[UIImageView alloc]init];
    // 2,設置細節
    UIImage *img = [UIImage imageNamed:imgName];
    imgView.image = img;
    imgView.frame = CGRectMake(x, y, 60, 60);
    // 3,加入到self的view裏面,以便顯示
    [self.view addSubview:imgView];
    
}

- (IBAction)segmentValueChanged:(UISegmentedControl *)sender {
    // 索引的值為0 1 2 3 -------2列 3列 4列 5列
    // NSLog(@"%d",sender.selectedSegmentIndex);
    int segmentIndex = sender.selectedSegmentIndex;
    int colsNum = segmentIndex + 2;
    
    // 在調整位置之前,先要在self.view.subViews數組裏面,將加入button放到最一個位置
    // 通過tag取到addButton
    UIButton *addBtn = [self.view viewWithTag:kAddButton_Tag];
    // 為了能夠始終讓addBtn在self.view的最後一個,先將其移出父控件,再加到父控件
    [addBtn removeFromSuperview];
    [self.view addSubview:addBtn];
    // 調用自己定義方法  調整原來的位置
    [self alinmentWithCols:colsNum];
        
   

}
// 抽取出來的方法,分為加入和取出又一次調整2種處理方式,推斷方法是 view中的子控件數目是否僅僅有一個segmentControl
- (void) alinmentWithCols:(int)colsNum
{
    // 假設子控件個數為 1 即僅僅有 segmentControl這一個控件,那麽加入,否則,又一次調整位置
    int subViewsCount = [[self.view subviews] count];
    //NSLog(@"子控件個數:%d---",subViewsCount);
    // 抽取出來的共同代碼
    
    int n = subViewsCount - 1;
    // 假設 n = 0,說明僅僅有一個segment,此時要加入3個imageView
    // 否則,取出全部的子控件,又一次 設置位置
    for (int i=0; i<=(n==0?3:n-1); i++) {
        
        // 調用自己定義的方法,通過控件在格子中的索引即排號,算出其應該在哪一行,哪一列,從而得到其坐標
        CGPoint pos = [self getPositionByIndexInCell:i];
        
        
        // 不同處理方式
        if (subViewsCount == 1) {
            NSString *imgName = [NSString stringWithFormat:@"01%d.png",i];
            [self addImg:imgName x:pos.x y:pos.y];
        } else {            // 當點擊 segment的時候,不應該再次加入imageView,而是應該取出,又一次設置xy
            // [self addImg:imgName x:x y:y];
            NSArray *array = [self.view subviews];
            NSLog(@"[email protected]
/* */",[array[i+1] class]); UIView *view = array[i+1]; [UIView animateWithDuration:1 animations:^{ // 以下三步為OC標準代碼,由於OC中不同意直接修該對象中結構體屬性的成員的值,要通過中間的暫時結構體變量 CGRect frame = view.frame; frame.origin = CGPointMake(pos.x, pos.y); view.frame=frame; }]; } // end of if else } // end of for 循環 } // end of function @end

效果圖1

技術分享

效果圖2

技術分享
















iOS_4_表情排列