终于效果图:

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(@"正在又一次设置%@的位置",[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

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcHJlX2VtaW5lbnQ=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

iOS_4_表情排列的更多相关文章

  1. cocos2dx 富文本框,支持换行,支持神情(支持汉字截断无乱码)

    cocos2dx 富文本框,支持换行,支持表情(支持汉字截断无乱码) 小工在做了一个游戏聊天功能,里面用到插入表情的富文本和换行的问题: 先看效果,不是你要的效果,可return:(截图由于:输入的问 ...

  2. IOS 学习记录

    表情排列 // // MJViewController.m // 01-表情排列 // // Created by apple on 13-11-24. // Copyright (c) 2013年 ...

  3. iOS开发之自定义表情键盘(组件封装与自动布局)

    下面的东西是编写自定义的表情键盘,话不多说,开门见山吧!下面主要用到的知识有MVC, iOS开发中的自动布局,自定义组件的封装与使用,Block回调,CoreData的使用.有的小伙伴可能会问写一个自 ...

  4. iOS_仿QQ表情键盘

    当UITextFiled和UITextView这种文本输入类控件成为第一响应者时,弹出的键盘由他们的一个UIView类的inputView属性来控制,当inputView为nil时会弹出系统的键盘,想 ...

  5. iOS 自定义emoji表情键盘

    之前走了很多弯路,包括自己定以emoji表情,自己创建view类去处理图文混排 ,当把这些焦头烂额的东西处理完了才发现 ,其实系统自带键盘是如此的方便,iOS 系统自带的表情在view,textfie ...

  6. 获取系统的emoji表情定制键盘

    首先 ,想要获取系统的表情,要首先知道表情对应的UTF8 的编码方式,我将其中一部分的图片展示出来 ,然后用UIButton 排列,iOS 7后又增加了300多个表情符号,这些都可以百度查到,现在上代 ...

  7. html打造动画【系列2】- 可爱的蛙蛙表情

    先感受一下全部表情包: 在开始之前先安利一个知识点:Flex弹性布局 我们一般做水平三列布局都是用的float方法,将每一块浮动显示在同一行.这种方法会导致元素没有原来的高度属性,要用清除浮动来解决空 ...

  8. 【Qt】仿QQ表情选择控件

         表情选择控件在聊天应用中常常要用到,做起来尽管不复杂可是非常繁琐.特别是有些图标须要按顺序排列.每次重做必定是非常费时.所以我将聊天表情选择控件封装成一个独立的类QFaceSelectWid ...

  9. 【UTR #2】[UOJ#278]题目排列顺序 [UOJ#279]题目交流通道 [UOJ#280]题目难度提升

    [UOJ#278][UTR #2]题目排列顺序 试题描述 “又要出题了.” 宇宙出题中心主任 —— 吉米多出题斯基,坐在办公桌前策划即将到来的 UOI. 这场比赛有 n 道题,吉米多出题斯基需要决定这 ...

随机推荐

  1. [Bayesian] “我是bayesian我怕谁”系列 - Variational Autoencoders

    本是neural network的内容,但偏偏有个variational打头,那就聊聊.涉及的内容可能比较杂,但终归会 end with VAE. 各个概念的详细解释请点击推荐的链接,本文只是重在理清 ...

  2. DataFrame使用总结1(超实用)

    DataFrame使用总结1(超实用): 1. 合并两个表 frame = [df1, df2] df = pd.concat(frame) res = pd.merge(df, df1, on=[' ...

  3. C#三大方法:虚方法、静态方法、实例方法

    虚方法:使用virtual关键字定义,当子类继承父类时,可以对父类中的虚方法进行重写. 如下面代码中的类B,它继承类A,类A实现了接口I(实现了接口中的foo()方法).在类A中使用virtual将f ...

  4. Problem D: 来开个书店吧

    某出版社可出版图书和磁带.其中图书按照每页的价格乘以页数进行定价,磁带根据每10分钟的价格乘以磁带录音的分钟数进行定价.请定义Publicatioin.Book.Tape以及BookStore四个类. ...

  5. 菜鸟谈谈C#中的构造函数和析构函数

    本节说明对象的创建.初始化和销毁过程.本节介绍下列主题: l         类构造函数 l         结构构造函数 l         析构函数 类构造函数 本节将讨论三种类构造函数: 类构造 ...

  6. Python之matplotlib学习(四)

    例子12:ipython使用--pylab参数,默认加入matplotlib模块 [root@typhoeus79 guosong]# ipython --pylab WARNING: IPython ...

  7. 11. 配置ZooKeeper ensemble

    一个ZooKeeper集群或复制的ZooKeeper服务器集群应该优化配置,以避免出现脑裂(split-brain)等情况. 由于网络分割,同一ensemble的两个不同服务器可能构成领导者不一致,因 ...

  8. gulp基础操作实践

    按照gulp中文文档对gulp基础操作的一些实践练习,记录以防忘掉. 一,选择并输出文件:gulp.src(globs[,options]) eg:gulp.src('src/less/index.l ...

  9. HTML5到底将给企业带来什么?

    HTML5 是近年来互联网行业的热门词汇,火的很.有人高调宣称"APP 将在几年内灭亡,HTML5 取而代之" 改变企业网络广告的模式与分布 广告是企业网络营销的主要方式之一 十几 ...

  10. TFboy养成记 MNIST Classification (主要是如何计算accuracy)

    参考:莫烦. 主要是运用的MLP.另外这里用到的是批训练: 这个代码很简单,跟上次的基本没有什么区别. 这里的lossfunction用到的是是交叉熵cross_entropy.可能网上很多形式跟这里 ...