您的位置:首页 > 产品设计 > UI/UE

IOS_UI_day3_UIImageView

2014-05-23 14:35 344 查看
H:/IOS_UI/day3-01-表情排列-垃圾版-MJViewController.h
//
//  MJViewController.h
//  01-表情排列
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface MJViewController : UIViewController
- (IBAction)indexChange:(UISegmentedControl *)sender;
@end

H:/IOS_UI/day3-01-表情排列-垃圾版-MJViewController.m
//
//  MJViewController.m
//  01-表情排列
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import "MJViewController.h"

#define kImgWH 50

@interface MJViewController ()

@end

@implementation MJViewController

#pragma mark 控制器的view加载完毕就调用一次
- (void)viewDidLoad
{
[super viewDidLoad];

// 1.创建表情
//    [self addImg:@"010.png" x:0 y:0];
//    UIImageView *one = [[UIImageView alloc] init];
//    one.image = [UIImage imageNamed:@"010.png"];
//    one.frame = CGRectMake(0, 0, 40, 40);
//    [self.view addSubview:one];

//    [self addImg:@"011.png" x:50 y:0];
//    UIImageView *two = [[UIImageView alloc] init];
//    two.image = [UIImage imageNamed:@"011.png"];
//    two.frame = CGRectMake(50, 0, 40, 40);
//    [self.view addSubview:two];

//    [self addImg:@"012.png" x:100 y:0];
//    UIImageView *three = [[UIImageView alloc] init];
//    three.image = [UIImage imageNamed:@"010.png"];
//    three.frame = CGRectMake(100, 0, 40, 40);
//    [self.view addSubview:three];
//
//    [self addImg:@"013.png" x:150 y:0];
//
//    [self addImg:@"014.png" x:200 y:0];
//
//    [self addImg:@"015.png" x:250 y:0];
//
//    [self addImg:@"016.png" x:0 y:50];
//
//    [self addImg:@"017.png" x:50 y:50];
//
//    [self addImg:@"018.png" x:100 y:50];

// 1.定义列数、间距
// 每行3列
int columns = 2;
// 每个表情之间的间距 = (控制器view的宽度 - 列数 * 表情的宽度) / (列数 + 1)
CGFloat margin = (self.view.frame.size.width - columns * kImgWH) / (columns + 1);

// 2.定义第一个表情的位置
// 第一个表情的Y值
CGFloat oneY = 100;
// 第一个表情的x值
CGFloat oneX = margin;

// 3.创建所有的表情
for (int i = 0; i<11; i++) {
int no = i % 9; // no == [0, 8]
NSString *imgName = [NSString stringWithFormat:@"01%d.png", no];

// i这个位置对应的列数
int col = i % columns;
// i这个位置对应的行数
int row = i / columns;

// 列数(col)决定了x
CGFloat x = oneX + col * (kImgWH + margin);
// 行数(row)决定了y
CGFloat y = oneY + row * (kImgWH + margin);

[self addImg:imgName x:x y:y];
}
}

#pragma mark 添加表情 icon:表情图片名
- (void)addImg:(NSString *)icon x:(CGFloat)x y:(CGFloat)y
{
UIImageView *one = [[UIImageView alloc] init];
one.image = [UIImage imageNamed:icon];
one.frame = CGRectMake(x, y, kImgWH, kImgWH);
[self.view addSubview:one];
}

#pragma mark 更改表情的列数
- (IBAction)indexChange:(UISegmentedControl *)sender {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];

//    sender.selectedSegmentIndex == 3
// 1.定义列数、间距
// 每行的列数
int columns = sender.selectedSegmentIndex + 2;

// 每个表情之间的间距 = (控制器view的宽度 - 列数 * 表情的宽度) / (列数 + 1)
CGFloat margin = (self.view.frame.size.width - columns * kImgWH) / (columns + 1);

// 2.定义第一个表情的位置
// 第一个表情的Y值
CGFloat oneY = 100;
// 第一个表情的x值
CGFloat oneX = margin;

// 3.创建所有的表情
for (int i = 0; i<11; i++) {
// i这个位置对应的列数
int col = i % columns;
// i这个位置对应的行数
int row = i / columns;

// 列数(col)决定了x
CGFloat x = oneX + col * (kImgWH + margin);
// 行数(row)决定了y
CGFloat y = oneY + row * (kImgWH + margin);

// 取出i + 1位置对应的imageView,设置x、y值
// + 1是为了跳过最前面的UISegmentControl
UIView *child = self.view.subviews[i + 1];

// 取出frame
CGRect tempF = child.frame;

// 修改x、y
//        tempF.origin.x = x;
//        tempF.origin.y = y;
tempF.origin = CGPointMake(x, y);

// 重新赋值
child.frame = tempF;

//        [self addImg:imgName x:x y:y];
}

NSLog(@"子控件数量:%d", self.view.subviews.count);

[UIView commitAnimations];
}
@end

H:/IOS_UI/day3-02-表情排列-优化-MJViewController.h
//
//  MJViewController.h
//  01-表情排列
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface MJViewController : UIViewController
- (IBAction)indexChange:(UISegmentedControl *)sender;

@end

H:/IOS_UI/day3-02-表情排列-优化-MJViewController.m
//
//  MJViewController.m
//  01-表情排列
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import "MJViewController.h"

/*
1.adjust....方法去掉第2个参数----add:(BOOL)add (不能增加全局变量或者成员变量)
2.在表情最后面增加一个“+”按钮,添加按钮在尾部添加一个表情(表情图片随机)
*/

#define kImgWH 50
#define kInitCount 13

@interface MJViewController ()

@end

@implementation MJViewController

#pragma mark 控制器的view加载完毕就调用一次
- (void)viewDidLoad
{
[super viewDidLoad];

[self adjustImagePosWithColumns:2 add:YES];
}

#pragma mark 调整图片的位置
- (void)adjustImagePosWithColumns:(int)columns add:(BOOL)add
{
// 1.定义列数、间距
// 每行3列
//#warning 不一样
//    int columns = 3;
// 每个表情之间的间距 = (控制器view的宽度 - 列数 * 表情的宽度) / (列数 + 1)
CGFloat margin = (self.view.frame.size.width - columns * kImgWH) / (columns + 1);

// 2.定义第一个表情的位置
// 第一个表情的Y值
CGFloat oneY = 100;
// 第一个表情的x值
CGFloat oneX = margin;

// 3.创建所有的表情
for (int i = 0; i<kInitCount; i++) {
// i这个位置对应的列数
int col = i % columns;
// i这个位置对应的行数
int row = i / columns;

// 列数(col)决定了x
CGFloat x = oneX + col * (kImgWH + margin);
// 行数(row)决定了y
CGFloat y = oneY + row * (kImgWH + margin);

//#warning 不一样
if (add) { // 添加新的imageView
int no = i % 9; // no == [0, 8]
NSString *imgName = [NSString stringWithFormat:@"01%d.png", no];
[self addImg:imgName x:x y:y];
} else { // 取出旧的imageview 设置x、y
// 取出i + 1位置对应的imageView,设置x、y值
// + 1是为了跳过最前面的UISegmentControl
UIView *child = self.view.subviews[i + 1];
// 取出frame
CGRect tempF = child.frame;
// 修改x、y
tempF.origin = CGPointMake(x, y);
// 重新赋值
child.frame = tempF;
}
}
}

#pragma mark 添加表情 icon:表情图片名
- (void)addImg:(NSString *)icon x:(CGFloat)x y:(CGFloat)y
{
UIImageView *one = [[UIImageView alloc] init];
one.image = [UIImage imageNamed:icon];
one.frame = CGRectMake(x, y, kImgWH, kImgWH);
[self.view addSubview:one];
}

#pragma mark 更改表情的列数
- (IBAction)indexChange:(UISegmentedControl *)sender {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];

int columns = sender.selectedSegmentIndex + 2;
[self adjustImagePosWithColumns:columns add:NO];

[UIView commitAnimations];
}
@end

H:/IOS_UI/day3-03-UIButton和UIImageView-MJViewController.h
//
//  MJViewController.h
//  02-UIButton和UIImageView
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface MJViewController : UIViewController

@end

H:/IOS_UI/day3-03-UIButton和UIImageView-MJViewController.m
//
//  MJViewController.m
//  02-UIButton和UIImageView
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import "MJViewController.h"

/*
1.显示图片
1> UIImageView只能一种图片(图片默认会填充整个UIImageView)  image\setImage:
2> UIButton能显示2种图片
* 背景 (背景会填充整个UIButton)  setBackroungImage:forState:
* 前置(覆盖在背景上面的图片,按照之前的尺寸显示)  setImage:forState:
* 还能显示文字

2.点击事件
1> UIImageView默认是不能响应点击事件
2> UIButton能响应点击事件 : addTarget:action:forControlEvents:

3.使用场合
1> UIImageView : 只显示图片,不监听点击,点击了图片后不做任何反应
2> UIButton : 既显示图片,又监听点击,点击了图片后做一些其他事情

4.继承结构
1> UIButton之所以能添加监听器来监听事件,是因为它继承自UIControl
2> UIImagevIew之所以不能添加监听器来监听事件,是因为它直接继承自UIView
*/

@interface MJViewController ()

@end

@implementation MJViewController

- (void)viewDidLoad
{
[super viewDidLoad];

// 1.添加ImageView
UIImageView *imageView = [[UIImageView alloc] init];
imageView.image = [UIImage imageNamed:@"014.png"];
imageView.frame = CGRectMake(0, 0, 150, 150);
[self.view addSubview:imageView];

// 2.UIButton
UIButton *btn = [[UIButton alloc] init];
// 设置背景图片
[btn setBackgroundImage:[UIImage imageNamed:@"bg.png"] forState:UIControlStateNormal];
// 设置前置图片
[btn setImage:[UIImage imageNamed:@"016.png"] forState:UIControlStateNormal];
btn.frame = CGRectMake(0, 100, 150, 150);

[btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];

[btn setTitle:@"我是按钮" forState:UIControlStateNormal];
[self.view addSubview:btn];

//    UISlider *slider = [[UISlider alloc] init];
//    slider.frame = CGRectMake(10, 250, 200, 50);
//    slider.minimumValue = 10;
//    slider.maximumValue = 20;
//    [slider addTarget:self action:@selector(sliderChange:) forControlEvents:UIControlEventValueChanged];
//    [self.view addSubview:slider];
}

- (void)sliderChange:(UISlider *)s
{
NSLog(@"%f", s.value);
}

- (void)btnClick:(UIButton *)mybtn
{
NSLog(@"%@", mybtn);
}
@end

H:/IOS_UI/day3-04-Tom喵-MJViewController.h
//
//  MJViewController.h
//  03-Tom
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface MJViewController : UIViewController
@property (weak, nonatomic) IBOutlet UIImageView *tom;
//- (IBAction)fangpi:(UIButton *)sender;
//- (IBAction)pie:(UIButton *)sender;
//- (IBAction)zhua:(UIButton *)sender;

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

@end

H:/IOS_UI/day3-04-Tom喵-MJViewController.m
//
//  MJViewController.m
//  03-Tom
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//
#import "MJViewController.h"
@interface MJViewController ()
{
NSDictionary *_dict; // 保存所有图片的个数
}
@end
@implementation MJViewController
- (void)viewDidLoad
{
[super viewDidLoad];
// 1.获得tom.plist的全路径
NSBundle *bundle = [NSBundle mainBundle];
NSString *path = [bundle pathForResource:@"tom" ofType:@"plist"];
// 2.根据文件全路径加载字典
_dict = [NSDictionary dictionaryWithContentsOfFile:path];
}
- (void)playAnim:(int)count fliename:(NSString *)filename
{
// 1.创建可变数组
NSMutableArray *images = [NSMutableArray array];
// 2.添加图片
for (int i = 0; i<count; i++) {
// 拼成图片名
NSString *name = [NSString stringWithFormat:@"%@_%02d.jpg", filename, i];
// 加载图片(有缓存,不释放)
//        UIImage *img = [UIImage imageNamed:name];
// 根据图片名,获得全路径
NSString *path = [[NSBundle mainBundle] pathForResource:name ofType:nil];
// 堆空间,没有缓存,下次点击事件
UIImage *img = [[UIImage alloc] initWithContentsOfFile:path];
[images addObject:img];
}
// 3.设置动画图片(有顺序)
_tom.animationImages = images;// 序列帧动画
// 4.只播放一次
_tom.animationRepeatCount = 1;
// 5.设置动画的持续时间
_tom.animationDuration = 0.1 * count;
// 5.开始动画
[_tom startAnimating];
//    // 1.有缓存(无法释放,参数传的是文件名)
//    [UIImage imageNamed:@""];
//    // 2.无缓存(用完就会释放,参数传的是全路径)
//    [[UIImage alloc] initWithContentsOfFile:];
}
#pragma mark 监听所有的按钮点击
- (IBAction)btnClick:(UIButton *)sender {
// 1.如果ImageView类型的对象tom正在播放动画,直接返回
if (_tom.isAnimating) return;
// 2.取出按钮文字
NSString *title = [sender titleForState:UIControlStateNormal];
// 3.根据key取出字典里面的value即图片数量
int count = [_dict[title] intValue];
// 4.播放动画
[self playAnim:count fliename:title];
}
@end

H:/IOS_UI/day3-04-Tom喵-tom.plist
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>angry</key>
<integer>26</integer>
<key>cymbal</key>
<integer>13</integer>
<key>drink</key>
<integer>81</integer>
<key>eat</key>
<integer>40</integer>
<key>fart</key>
<integer>28</integer>
<key>foot_left</key>
<integer>30</integer>
<key>foot_right</key>
<integer>30</integer>
<key>knockout</key>
<integer>81</integer>
<key>pie</key>
<integer>24</integer>
<key>scratch</key>
<integer>56</integer>
<key>stomach</key>
<integer>34</integer>
</dict>
</plist>

H:/IOS_UI/day3-05-联系人管理-MJViewController.h
//
//  MJViewController.h
//  04-联系人管理
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface MJViewController : UIViewController
// 添加
- (IBAction)add:(UIBarButtonItem *)sender;
// 删除
- (IBAction)remove:(UIBarButtonItem *)sender;

@property (weak, nonatomic) IBOutlet UIBarButtonItem *removeItem;
@end

H:/IOS_UI/day3-05-联系人管理-MJViewController.m
//
//  MJViewController.m
//  04-联系人管理
//
//  Created by apple on 13-11-24.
//  Copyright (c) 2013年 itcast. All rights reserved.
//

#import "MJViewController.h"

@interface MJViewController ()

@end

@implementation MJViewController

- (IBAction)add:(UIBarButtonItem *)sender {
// 0.取出最后一个子控件
UIView *last = [self.view.subviews lastObject];
// 这行的Y = 最后一个子控件的Y + 最后一个子控件的高度 + 间距
CGFloat rowY = last.frame.origin.y + last.frame.size.height + 1;

// 1.创建一行
//    UIView *rowView = [[UIView alloc] initWithFrame:CGRectMake(0, 44, 320, 50)];
UIView *rowView = [[UIView alloc] init];
rowView.backgroundColor = [UIColor redColor]; // 红色

// 2.添加一行到控制器的view中
[self.view addSubview:rowView];

// 3.让删除item有效
_removeItem.enabled = YES;

// 4.执行动画
rowView.frame = CGRectMake(320, rowY, 320, 50);
rowView.alpha = 0;

// 4.1.开始动画
//    [UIView beginAnimations:nil context:nil];
//    [UIView setAnimationDuration:1.0];

//    [UIView animateWithDuration:1.0 animations:^{
//
//    }];
//
[UIView animateWithDuration:1.0 animations:^{
rowView.frame = CGRectMake(0, rowY, 320, 50);
rowView.alpha = 1;
} completion:^(BOOL finished) { // 动画执行完毕后会自动调用这个block(这个代码段)
NSLog(@"移动完毕");
}];

//    [UIView commitAnimations];
}

- (IBAction)remove:(UIBarButtonItem *)sender {
// 1.取出最后一个子控件
UIView *last = [self.view.subviews lastObject];
//    Class c = [UIToolbar class];
//    // 是toolbar
//    if ([last isKindOfClass:c]) return;

// 2.移除子控件
//    [last removeFromSuperview];

[UIView animateWithDuration:1.0 animations:^{
CGRect tempF = last.frame;
tempF.origin.x = 320;
last.frame = tempF;

last.alpha = 0;
} completion:^(BOOL finished) {
[last removeFromSuperview];

// 剩下的子控件个数 > 1就能够点击“删除”
_removeItem.enabled = self.view.subviews.count > 1;
}];

// 3.判断剩下的子控件个数
//    if (self.view.subviews.count == 1)
//    {
//        _removeItem.enabled = NO;
//    }
}
@end
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  ios ui imageview