美文网首页
iOS的绝对布局(二)

iOS的绝对布局(二)

作者: _feiyu_2100 | 来源:发表于2018-03-12 15:53 被阅读21次

    概括
    iOS绝对布局也就是我们开发最初使用的UI布局了。
    优点: 使用方式很简单,可以搭建任何布局,UI控件都是绝对的位置
    缺点:对于复杂界面的流畅度不能保障

    第一节 使用方式
    1.创建一个宽44,高44 像素位于屏幕中心的UIButton

        UIButton *btn = [[UIButton alloc] init];
        btn.frame = CGRectMake(0, 0, 44, 44);
        btn.backgroundColor = [UIColor cyanColor];
        btn.center = self.view.center;
        [self.view addSubview: btn];
    
    //定义宏
    

    第二节 使用实例
    1.比例适配
    对于绝对布局最头疼的就是适配问题,一下解决方案可以解决你大部分问题,但是iPhoneX、iPhone4、iPhone4s上有些地方需要你单独适配

    型号 尺寸 比例
    iPhone4\4s 320x480 0.666
    iPhone5 320x568 0.563
    iPhone6\7\8 375x667 0.562
    iPhone6\7\8Plus 414x736 0.5625
    iPhoneX 375x812 0.462

    观察以及宽高比例你会发现,除了iPhoneX、iPhone4、iPhone4s比例不一样,其他机型比例是一样的,所以需要将他们单独在进行适配

    
    #define KMainScreenWidth [UIScreen mainScreen].bounds.size.width
    #define KMainScreenHeight  [UIScreen mainScreen].bounds.size.height
    #define kwidthScale (KMainScreenHeight==480?KMainScreenWidth/320.0: (KMainScreenHeight==812?KMainScreenWidth/414.0:KMainScreenWidth/375.0))
    #define kHeightScale (KMainScreenHeight==480?KMainScreenHeight/480.0: (KMainScreenHeight==812?KMainScreenHeight/812.0:KMainScreenHeight/667.0))
    
    

    全部代码

    #import "ViewController.h"
    #define KMainScreenWidth [UIScreen mainScreen].bounds.size.width
    #define KMainScreenHeight  [UIScreen mainScreen].bounds.size.height
    #define kwidthScale (KMainScreenHeight==480?KMainScreenWidth/320.0: (KMainScreenHeight==812?KMainScreenWidth/414.0:KMainScreenWidth/375.0))
    #define kHeightScale (KMainScreenHeight==480?KMainScreenHeight/480.0: (KMainScreenHeight==812?KMainScreenHeight/812.0:KMainScreenHeight/667.0))
    
    @interface ViewController ()
    
    @end
    
    @implementation ViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        // Do any additional setup after loading the view, typically from a nib.
        
        UIButton *btn = [[UIButton alloc] init];
        btn.frame = CGRectMake(60 * kwidthScale, 120 * kHeightScale, 200 * kwidthScale, 100 * kHeightScale);
        btn.backgroundColor = [UIColor cyanColor];
        [self.view addSubview: btn];
    }
    
    
    - (void)didReceiveMemoryWarning {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    
    
    @end
    
    

    2.UITableView的自定义高度

    关于UItableView的复杂页面的自适应高度一直是一件较为头疼的事情,对于一些较为简单的页面,通过动态的计算cell高度,流畅度可以通过,但是对于较为复杂想让FPS达到60是较为复杂的,下面是自定义高度的一个第三方框架计算高度的使用:https://github.com/forkingdog/UITableView-FDTemplateLayoutCell
    1.创建一个自定义Cell并创建自己需要的控件,创建configUI: imageName:数据赋值语句,代码如下

    //TableViewCell.h
    #import <UIKit/UIKit.h>
    
    @interface TableViewCell : UITableViewCell
    - (void)configUI:(NSString *)str imageName:(NSString *)imgName;
    @end
    
    
    //TableViewCell.m
    #import "TableViewCell.h"
    #import "Masonry.h"
    #import <UIImageView+WebCache.h>
    @interface TableViewCell()
    @property (nonatomic, strong) UIImageView *imgV;
    @property (nonatomic, strong) UILabel *titleLB;
    @end
    @implementation TableViewCell
    - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{
        self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
        if (self) {
            
            UIImageView *imgV = [[UIImageView alloc] init];
            imgV.image = [UIImage imageNamed:@"headImg"];
            [self.contentView addSubview:imgV];
            self.imgV = imgV;
            
            UILabel *titleLb = [[UILabel alloc] init];
            titleLb.numberOfLines = 0;
            [self.contentView addSubview:titleLb];
            self.titleLB = titleLb;
            
            UIView *lineView = [[UIView alloc] init];
            lineView.backgroundColor = [UIColor grayColor];
            [self.contentView addSubview:lineView];
            
            [imgV mas_makeConstraints:^(MASConstraintMaker *make) {
                make.top.left.equalTo(self.contentView).offset(10);
                make.height.width.mas_equalTo(40);
            }];
            [titleLb mas_makeConstraints:^(MASConstraintMaker *make) {
                make.top.equalTo(imgV.mas_top).offset(10);
                make.left.equalTo(imgV.mas_right).offset(10);
                make.right.equalTo(self.contentView.mas_right).offset(-10);
                make.bottom.equalTo(self.contentView.mas_bottom).offset(-10);
            }];
            
            [lineView mas_makeConstraints:^(MASConstraintMaker *make) {
                make.right.left.equalTo(self.contentView);
                make.bottom.equalTo(self.contentView.mas_bottom).offset(-2);
                make.height.mas_equalTo(1);
            }];
        }
        return self;
    }
    
    - (void)configUI:(NSString *)str imageName:(NSString *)imgName{
    
        [self.imgV sd_setImageWithURL:[NSURL URLWithString:imgName] placeholderImage:[UIImage imageNamed:@"headImg"] options:SDWebImageRefreshCached completed:nil];
        self.titleLB.text = str;
    }
    - (void)awakeFromNib {
        [super awakeFromNib];
        // Initialization code
    }
    
    - (void)setSelected:(BOOL)selected animated:(BOOL)animated {
        [super setSelected:selected animated:animated];
    
        // Configure the view for the selected state
    }
    
    @end
    
    
    

    2.在UIViewController.m内创建一个UITableView,并实现UITableViewDelegate, UITableViewDataSource代理

    #import "TableViewController.h"
    #import "TableViewCell.h"
    #import <UITableView+FDTemplateLayoutCell.h>
    
    @interface TableViewController ()
    @property (nonatomic, strong) NSArray *strAry;
    @property (nonatomic, strong) NSArray *imgAry;
    
    @end
    
    @implementation TableViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        
        // Uncomment the following line to preserve selection between presentations.
        // self.clearsSelectionOnViewWillAppear = NO;
        
        // Uncomment the following line to display an Edit button in the navigation bar for this view controller.
        // self.navigationItem.rightBarButtonItem = self.editButtonItem;
        self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
        self.tableView.fd_debugLogEnabled = YES;
        [self.tableView registerClass:[TableViewCell class] forCellReuseIdentifier:@"cellIdentifier"];
        self.strAry = @[
                            @"《白夜行》是日本作家东野圭吾创作的长篇小说,也是其代表作。该小说于1997年1月至1999年1月间连载于期刊,单行本1999年8月在日本发行。故事围绕着一对有着不同寻常情愫的小学生展开。1973年,大阪的一栋废弃建筑内发现了一具男尸,此后19年,嫌疑人之女雪穗与被害者之子桐原亮司走上截然不同的人生道路,一个跻身上流社会,一个却在底层游走,而他们身边的人,却接二连三地离奇死去,警察经过19年的艰苦追踪,终于使真相大白。",
                            
                            ];
        self.imgAry = @[
                        @"http://img4.duitang.com/uploads/item/201411/12/20141112115936_zYyEc.jpeg",
                        ];
        
    }
    
    
    #pragma mark - Table view data source
    
    - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
        return 1;
    }
    
    - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
        return self.strAry.count;
    }
    
    
    - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
        TableViewCell *cell = (TableViewCell *)[tableView dequeueReusableCellWithIdentifier:@"cellIdentifier"];
         [self configureCell:cell atIndexPath:indexPath];
        return cell;
    }
    
    - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    
        return [tableView fd_heightForCellWithIdentifier:@"cellIdentifier" configuration:^(TableViewCell *cell) {
              [self configureCell:cell atIndexPath:indexPath];
        }];
    }
    - (void)configureCell:(TableViewCell *)cell atIndexPath:(NSIndexPath *)indexPath {
        //使用Masonry进行布局的话,这里要设置为NO
        cell.fd_enforceFrameLayout = NO;
        [cell configUI:self.strAry[indexPath.row] imageName:self.imgAry[indexPath.row]];
    }
    
    
    @end
    

    点击下载demo
    注意:
    1.在ViewDidLoad内注册Cell,不注册的话程序会崩溃

    TableViewController.h
    报错截图:
    报错截图

    2.tableView:heightForRowAtIndexPath:方法中返回高度,cell的ID一定要和注册cell的ID一致


    [图片上传中...(TableViewController.h)]

    3.如果确定上面没有问题,但是Cell高度还不是自适应,那就是自定义Cell文件的问题,确保控件添加在self.contentView上,以及控件底部的控制

    TableViewCell.m

    以上的方法使用起来很方便,但是对于页面更复杂、样式丰富的页面还是有些会卡顿现象,这就需要我们探索更多、更好的方法,并根据不同的页面选择出最适合的方法。

    相关文章

      网友评论

          本文标题:iOS的绝对布局(二)

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