美文网首页
经典九宫格布局总结

经典九宫格布局总结

作者: 姚姚先生 | 来源:发表于2017-09-28 17:04 被阅读20次
1.首先在控制器定义 常量
#define PIC_WIDTH 20
#define PIC_HEIGHT 50
#define COL_WIDTH 20
2.遍历初始化控件
- (void)test
{
    //for循环添加控件
    for (int i = 0; i < pictureArr.count; i++) {
        //创建图片
        UIImageView *imageView = [[UIImageView alloc] init];
        imageView.image = [UIImage imageNamed:pictureArr[i]];
        [self.view addSubview:imageView];
        
        //计算行
        NSInteger row = i / COL_COUNT;
        //计算列
        NSInteger col = i % COL_COUNT;
        //间距
        CGFloat margain = (self.view.bounds.size.width - (PIC_WIDTH * COL_COUNT)) / (COL_COUNT+1);
        //X
        CGFloat picX = margain +(PIC_WIDTH + margain) * col;
        //Y
        CGFloat picY = margain +(PIC_HEIGHT + margain) * row;
        
        //设置frame
        imageView.frame = CGRectMake(picX, picY, PIC_WIDTH, PIC_HEIGHT);
    }
}

相关文章

  • 经典九宫格布局总结

    1.首先在控制器定义 常量 2.遍历初始化控件

  • 常见自适应布局/等分布局/九宫格布局

    自适应布局/等分布局/九宫格布局是面试常考的内容,通常要求掌握几种实现方法,以下是我自己准备秋招总结的布局,方便记...

  • 详解自动布局(Masonry)实现九宫格

    以前写TimeLine中照片九宫格布局是直接计算frame,今天想用自动布局实现。 九宫格布局 使用自动布局,首先...

  • OC_九宫格布局工具

    实现基于: iOS Masonry九宫格布局 - 一行代码实现九宫格 demo点这里 以后你可能会这样布局九宫格 ...

  • CSS经典布局

    CSS经典布局 本文主要对一些常见的CSS布局问题进行总结,涉及三栏布局、负margin、清除浮动、居中布局、Fl...

  • css经典布局总结

    布局类型 浮动布局 流式布局 定位布局 flex布局 grid布局 布局详解 1.浮动布局。 浮动布局是利用flo...

  • 用CSS实现布局(两栏布局,多栏布局)

    在网页上的布局比较经典的是两栏布局和三栏布局。下面简单总结自己对这两种布局的实现过程。 两栏布局 两栏布局是主内容...

  • Autolayout布局九宫格

    Autolayout纯代码布局九宫格 单行固定间隔排列: 水平布局设置 垂直布局设置 固定宽度设置: 水平布局 垂...

  • web学习CSS8:CSS网页布局基础

    1.经典的行布局 2.经典的两列布局 3.经典的三列布局 4.混合布局 5.圣杯布局 6.双飞翼布局

  • 02-UI基础第2天

    一、九宫格设计思路 根据九宫格内各控件的索引,先考虑行布局的问题,然后考虑列布局的问题 控件的整体性考虑,将控件组...

网友评论

      本文标题:经典九宫格布局总结

      本文链接:https://www.haomeiwen.com/subject/gdkvextx.html