UITableViewHeaderFooterView的使用+自己主动布局

Posted 2020-06-16

UITableViewHeaderFooterView的使用+自己主动布局

使用UITableView的header或footer复用时，假设採用自己主动布局，你会发现有约束冲突，以下这样写能够消除约束冲突：

#import <UIKit/UIKit.h>

@interface SectionView : UITableViewHeaderFooterView

@property (nonatomic, copy) NSString *sectionTitle;

@end

#import "SectionView.h"

@interface SectionView ()
{
    UIImageView *titleBgImageView;
    UIImageView *timePonitImageView;
    UIImageView *circleImageView;
    UILabel *titleLabe;
}
@end

@implementation SectionView

// 带有复用
- (instancetype)initWithReuseIdentifier:(NSString *)reuseIdentifier
{
    self = [super initWithReuseIdentifier:reuseIdentifier];
    if (self) {
        [self createUI];
    }
    return self;
}


- (void)createUI
{
    titleBgImageView = [[UIImageView alloc] initForAutoLayout];
    titleBgImageView.userInteractionEnabled = NO;
    UIImage *image = [UIImage imageNamed:@"event_bottom_line"];
    image = [image stretchableImageWithLeftCapWidth:image.size.width*0.5 topCapHeight:image.size.height*0.5];
    titleBgImageView.image = image;
    [self.contentView addSubview:titleBgImageView];
    
    
    circleImageView = [[UIImageView alloc] initForAutoLayout];
    UIImage *circleImage = [UIImage imageNamed:@"event_blue1"];
    circleImage = [circleImage stretchableImageWithLeftCapWidth:circleImage.size.width*0.5 topCapHeight:circleImage.size.height*0.5];
    
    circleImageView.image = circleImage;
    [self.contentView addSubview:circleImageView];

    
    timePonitImageView = [[UIImageView alloc] initForAutoLayout];
    timePonitImageView.image = [UIImage imageNamed:@"event_write_line"];
    [self.contentView addSubview:timePonitImageView];
    
    
    titleLabe = [[UILabel alloc] initForAutoLayout];
    titleLabe.font = [UIFont systemFontOfSize:13];
    titleLabe.textColor = [UIColor whiteColor];
    titleLabe.textAlignment = NSTextAlignmentCenter;
    [circleImageView addSubview:titleLabe];
   
}

把布局代码写到这里
- (void)layoutSubviews
{
    [super layoutSubviews];
    
    [titleBgImageView autoPinEdgesToSuperviewEdgesWithInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
    
    [circleImageView autoPinEdgeToSuperviewEdge:ALEdgeLeading withInset:8];
    [circleImageView autoPinEdgeToSuperviewEdge:ALEdgeTrailing withInset:8];
    [circleImageView autoSetDimension:ALDimensionHeight toSize:23];
    [circleImageView autoAlignAxisToSuperviewAxis:ALAxisHorizontal];
    
    [timePonitImageView autoPinEdgeToSuperviewEdge:ALEdgeLeading withInset:16];
    [timePonitImageView autoPinEdgeToSuperviewEdge:ALEdgeTop withInset:39/2.0-4];
    [timePonitImageView autoSetDimensionsToSize:CGSizeMake(9, 23.5)];
    
    [titleLabe autoCenterInSuperview];
    [titleLabe autoSetDimension:ALDimensionWidth toSize:200];
    
}