Masonry and Fdtemplatelayoutcell Use the sample demo

We know that the interface layout can be implemented with storyboard or xib combination of AutoLayout, if using a pure code layout, compared to the popular masonry, sdautolayout, the following simple demo, using a pure code layout, to achieve the indefinite high tableview.

Implementation mode: Masonry + Fdtemplatelayoutcell

First:

Among them: 1 and 2 are Uilabel, the content is not fixed, so the height is not fixed, 3 is view, can be used for point like and comments or other purposes.

Words don't say much, on the code:

1. Preparatory work

Pods Integration:

Pod ' uitableview+fdtemplatelayoutcell ' pod ' masonry '

2, the new cell, because the avatar I use the network picture, to advance the integration of Sdwebimage

#import "FDTMasoryCell.h" #import "Masonry.h" #import "uiimageview+webcache.h"

-(Instancetype) Initwithstyle: (Uitableviewcellstyle) style Reuseidentifier: (NSString *) reuseidentifier{self = [super    Initwithstyle:style Reuseidentifier:reuseidentifier];        if (self) {self.backgroundcolor = [uicolor Clearcolor];            [Self initviews]; } return self;}    -(void) initviews{//Avatar icon icon = [[Uiimageview alloc] init];    [Self.contentview Addsubview:icon]; Height width 40, top and left distance 10px [icon mas_makeconstraints:^ (Masconstraintmaker *make) {make.left.equalTo (self.contentview). O        Ffset (10);        Make.top.equalTo (Self.contentview). Offset (10);    Make.width.and.height.offset (40);        }];    Title Lbltitle = [UILabel new];    [Self.contentview Addsubview:lbltitle]; Height 20, left distance avatar 10px, top distance contentview10px, right distance 15px (why is-15, because iOS internal origin is the upper left corner, so the right and bottom spacing to negative) [Lbltitle mas_makeconstraints        : ^ (Masconstraintmaker *make) {make.left.equalTo (icon.mas_right). Offset (10);        Make.top.equalTo (Self.contentview). Offset (10); Make.riGht.equalto (Self.contentview). Offset (-15);    Make.height.mas_equalTo (20);        }];    Description content 1 Lbldesc = [UILabel new];    Lbldesc.backgroundcolor = [Uicolor Redcolor];    Lbldesc.numberoflines = 0;    [Self.contentview Addsubview:lbldesc]; Indefinite high label, top distance title 10px, left distance icon 10px, right distance 15px [Lbldesc mas_makeconstraints:^ (Masconstraintmaker *make) {ma        Ke.top.equalTo (Lbltitle.mas_bottom). Offset (10);        Make.left.equalTo (icon.mas_right). Offset (10);    Make.right.equalTo (Self.contentview). Offset (-15);    }];    Description Content 2 LBLDESC2 = [UILabel new];    Lbldesc2.numberoflines = 0;    Lbldesc2.backgroundcolor = [Uicolor Yellowcolor];    [Self.contentview ADDSUBVIEW:LBLDESC2]; Indefinite high label, top distance description content 1 10px, left distance icon 10px, right distance 15px [lblDesc2 mas_makeconstraints:^ (Masconstraintmaker *make) {m        Ake.top.equalTo (Lbldesc.mas_bottom). Offset (10);        Make.left.equalTo (icon.mas_right). Offset (10);    Make.right.equalTo (Self.contentview). Offset (-15);    }];    Other viewcomment = [[UIView alloc] init];    Viewcomment.backgroundcolor = [Uicolor Orangecolor];    [Self.contentview addsubview:viewcomment]; Height 25, top distance content 2 10px, left distance and content 2 flush, right distance 15px [viewcomment mas_makeconstraints:^ (Masconstraintmaker *make) {make.top        . Equalto (Lbldesc2.mas_bottom). Offset (10);        Make.left.equalTo (LBLDESC2);        Make.height.mas_equalTo (25);    Make.right.bottom.equalTo (Self.contentview). Offset (-15); }];} -(void) Fill: (Fdtmodel *) model{[icon Sd_setimagewithurl:[nsurl URLWITHSTRING:MODEL.ICONURL] placeholderimage:[    UIImage imagenamed:@ "Icondefault"];    Lbltitle.text = Model.title;    Lbldesc.text = Model.desc;    Lbldesc2.text = Model.desc; }

　　

3, Controller Tableviewview

#import "FDTMasoryCell.h" #import "FDTModel.h" #import "uitableview+fdtemplatelayoutcell.h"

-(void) viewdidload {[Super viewdidload];    Do any additional setup after loading the view.        Self.view.backgroundColor = [Uicolor Whitecolor]; _tableview = [[UITableView alloc] Initwithframe:cgrectmake (0, 0, kscreenwidth, kscreenheight) style:    Uitableviewstyleplain];    _tableview.delegate = self;    _tableview.datasource = self;    [_tableview registernib:[uinib nibwithnibname:@ "Fdtcell" Bundle:nil] forcellreuseidentifier:cellid];    [_tableview Registerclass:[fdtmasorycell class] Forcellreuseidentifier:cellmasonryid];        [Self.view Addsubview:_tableview];    } #pragma mark-tableview-(Nsinteger) TableView: (UITableView *) TableView numberofrowsinsection: (Nsinteger) section{ return self.dataArry.count;} -(UITableViewCell *) TableView: (UITableView *) TableView Cellforrowatindexpath: (Nsindexpath *) indexpath{//fdtcell *    cell = [TableView dequeuereusablecellwithidentifier:cellid];   Fdtmasorycell *cell = [TableView Dequeuereusablecellwithidentifier:cellmasonryid]; Fdtmodel *model = Self.dataarry[indexpath.row];    [Cell Fill:model];    return cell; }-(CGFloat) TableView: (UITableView *) TableView Heightforrowatindexpath: (Nsindexpath *) indexpath{return [TableView FD _heightforcellwithidentifier:cellmasonryid Cachebyindexpath:indexpath configuration:^ (id cell) {FDTModel *model =        Self.dataarry[indexpath.row];    [Cell Fill:model];    }]; }

Ps:

1, TableView here usage as usual, the only difference and the most critical is the agent: Heightforrowatindexpath method

Here uses the Uitableview+fdtemplatelayoutcell processing height, the usage is simple and clear, no longer does not have oneself to calculate according to the content!

2, cell, I am simple to use a three-layer view, we can also change the cell according to their own needs.

3, here cell, I use masonry layout, of course, can also use the System AutoLayout add constraints to achieve the layout, sometimes in the cell if the content is not much, with constraints but more simple.

Last, after the above three steps, a simple arrangement effect came out, everyone try it.

Have any questions, welcome message ~ ~ ~

Masonry and Fdtemplatelayoutcell Use the sample demo