I need to access the UIView array items (where all UIView will have its own independent activity). But while assigning as #property (assign, nonatomic) UIView *ui_view[MAXIMUM_UIVIEW];, its causing the build to fail.
is there anyway to make it work the way i am trying or some other better way?
ERROR:
CODE:
#import "ViewController.h"
const int MAXIMUM_UIVIEW = 50;
#interface ViewController ()
#property (assign, nonatomic) UIView *ui_view[MAXIMUM_UIVIEW];
#property (assign, nonatomic) NSInteger phone_height;
#property (assign, nonatomic) NSInteger phone_width;
-(void)func_draw_wall:(int)argument_count;
#end
#implementation ViewController
-(void)ui_button_submit:(UIButton*)sender {
int __chronological__;
//UIView *ui_view[MAXIMUM_UIVIEW];
//int phone_height = self.view.frame.size.height;
//int phone_width = self.view.frame.size.width;
int phone_height = self.view.frame.size.height;
int phone_width = self.view.frame.size.width;
self.phone_height = phone_height;
self.phone_width = phone_width;
for (__chronological__ = 0 ; __chronological__ <= 50 ; __chronological__++ ) {
[self func_draw_wall:__chronological__];
}
}
-(void)func_draw_wall:(int)__chronological__ {
self.ui_view[__chronological__] =
[[UIView alloc] initWithFrame:CGRectMake(0, 0, 50,50)];
[self.view addSubview:self.ui_view[__chronological__]];
NSLog(#"Mem Address of localView[%d] = %x\n", __chronological__, self.ui_view);
}
-(void)ui_button {
self.view.backgroundColor = [UIColor blackColor];
UIButton *but = [[UIButton alloc] init];
[but setTitle:#"--- Add ---" forState:UIControlStateNormal];
[but setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
[but addTarget:self action:#selector(ui_button_submit:)
forControlEvents:UIControlEventTouchUpInside];
int startHeight = 167;
int frameHeight = self.view.frame.size.height - startHeight;
[but setFrame:CGRectMake(0, startHeight, 320, frameHeight)];
[but setTranslatesAutoresizingMaskIntoConstraints:false];
[but setImage:[UIImage imageNamed:#"Image"] forState:UIControlStateNormal];
[self.view addSubview:but];
NSDictionary *viewsDict = #{#"button" : but};
[self.view addConstraints:[NSLayoutConstraint
constraintsWithVisualFormat:#"V:[button]-0-|"
options:0 metrics:nil views:viewsDict]];
NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:but
attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual
toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1.0
constant:0];
constraint.active = true;
[self.view addConstraint:constraint];
[self.view layoutIfNeeded];
}
- (void)viewDidLoad {
[super viewDidLoad];
[self ui_button];
}
#end
Make the type NSArray *, not UIView *[]
You should be able to use a generic type parameter, so NSArray<UIView *> *
Related
I have a problem
i created 6 UIButtons put them in a UIView1
then put the UIView1 into another UIView2
then return UIView2 as UITableView.tableHeaderView
now the problem is when i touch the buttons
no responsiblity
here is some information
1. UIButtons UIView1 UIView2 fremes are these
2017-06-04 16:26:40.014 LOLHelper[8590:223132] BUT frame is :8.000000 8.000000 70.500000 18.000000
2017-06-04 16:26:40.014 LOLHelper[8590:223132] BUT frame is :86.500000 8.000000 71.000000 18.000000
2017-06-04 16:26:40.014 LOLHelper[8590:223132] BUT frame is :165.500000 8.000000 70.500000 18.000000
2017-06-04 16:26:40.015 LOLHelper[8590:223132] BUT frame is :244.000000 8.000000 70.500000 18.000000
2017-06-04 16:26:40.015 LOLHelper[8590:223132] BUT frame is :322.500000 8.000000 71.000000 18.000000
2017-06-04 16:26:40.015 LOLHelper[8590:223132] BUT frame is :401.500000 8.000000 70.500000 18.000000
2017-06-04 16:26:40.015 LOLHelper[8590:223132] SubView frame is: :-3.000000 0.000000 480.000000 20.000000
2017-06-04 16:26:40.015 LOLHelper[8590:223132] headerView frame is: :0.000000 0.000000 320.000000 20.000000
2.i turn on the userInteractionEnabled of UIButtons UIView1 UIView2 , u can see in the code :
#import "TableViewDataSource.h"
#implementation TableViewDataSource
#synthesize tableView;
#synthesize tableCell;
#synthesize LHfetchedResultsController;
#synthesize numberOfRows;
#synthesize dataTemp;
#synthesize paused;
#synthesize type;
#synthesize imgAche;
#synthesize cellHeight;
#synthesize subHeaderViewFrame;
-(id)initWithTableView:(UITableView *) tableView
{
self = [super init];
if (self) {
self.tableView = tableView;
self.tableView.dataSource = self;
self.tableView.delegate = self;
self.tableView.tableHeaderView = [self setHeaderView];
}
return self;
}
-(UIView *)setHeaderView
{
CGSize screenSize = [UIScreen mainScreen].bounds.size;
UIView * container = [[UIView alloc] init];
container.frame = CGRectMake(0, 0, screenSize.width, 20);
container.userInteractionEnabled = YES;
UIView * headerView = [[UIView alloc] init];
headerView.frame = CGRectMake(0, 0, screenSize.width*1.5, 20);
headerView.tag = 01;
headerView.userInteractionEnabled = YES;
[container addSubview:headerView];
for (int i = 1; i < 7; i++) {
UIButton * button = [[UIButton alloc] init];
button.tag = i+10;
button.titleLabel.font = [UIFont boldSystemFontOfSize:12];
[button setTitle:[NSString stringWithFormat:#"but0%d",i] forState:UIControlStateNormal];
[button setTitle:[NSString stringWithFormat:#"but0%d s",i] forState:UIControlStateSelected];
[button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
button.translatesAutoresizingMaskIntoConstraints = NO;
[button setTitleColor:[UIColor brownColor] forState:UIControlStateSelected];
button.enabled = YES;
button.userInteractionEnabled = YES;
[headerView addSubview:button];
}
UIButton *button01 = [headerView viewWithTag:11];
UIButton *button02 = [headerView viewWithTag:12];
UIButton *button03 = [headerView viewWithTag:13];
UIButton *button04 = [headerView viewWithTag:14];
UIButton *button05 = [headerView viewWithTag:15];
UIButton *button06 = [headerView viewWithTag:16];
NSDictionary * views = NSDictionaryOfVariableBindings(button01,button02,button03,button04,button05,button06);
NSString * vflV1 = #"V:|-1-[button01]-1-|";
NSString * vflV2 = #"V:|-1-[button02]-1-|";
NSString * vflV3 = #"V:|-1-[button03]-1-|";
NSString * vflV4 = #"V:|-1-[button04]-1-|";
NSString * vflV5 = #"V:|-1-[button05]-1-|";
NSString * vflV6 = #"V:|-1-[button06]-1-|";
NSString * vflH1 = #"H:|-[button01]-[button02(==button01)]-[button03(==button01)]-[button04(==button01)]-[button05(==button01)]-[button06(==button01)]-|";
NSArray * constraintsV1 = [NSLayoutConstraint constraintsWithVisualFormat:vflV1 options:0 metrics:NULL views:views];
NSArray * constraintsV2 = [NSLayoutConstraint constraintsWithVisualFormat:vflV2 options:0 metrics:NULL views:views];
NSArray * constraintsV3 = [NSLayoutConstraint constraintsWithVisualFormat:vflV3 options:0 metrics:NULL views:views];
NSArray * constraintsV4 = [NSLayoutConstraint constraintsWithVisualFormat:vflV4 options:0 metrics:NULL views:views];
NSArray * constraintsV5 = [NSLayoutConstraint constraintsWithVisualFormat:vflV5 options:0 metrics:NULL views:views];
NSArray * constraintsV6 = [NSLayoutConstraint constraintsWithVisualFormat:vflV6 options:0 metrics:NULL views:views];
NSArray * constraintsH1 = [NSLayoutConstraint constraintsWithVisualFormat:vflH1 options:0 metrics:NULL views:views];
[headerView addConstraints:constraintsV1];
[headerView addConstraints:constraintsV2];
[headerView addConstraints:constraintsV3];
[headerView addConstraints:constraintsV4];
[headerView addConstraints:constraintsV5];
[headerView addConstraints:constraintsV6];
[headerView addConstraints:constraintsH1];
return container;
}
i have not find the reason
anyone could help me?
i also add some UISwipeGestureRecognizer into UIView2
thank u
Thank u Guys
i got the solution
reason is that
[button addTarget:NULL action:#selector(click:) forControlEvents:UIControlEventTouchUpInside];
i set target NULL, and write click: in the same file, but actually i get the table from the main controller, so when i click button, xcode will find click: in the main controller, then can not find, so no responsibility.
after i set target self or write click: in main controller
it works
Hi i am beginner for Auto-Layouts and i am inserting some fields on my UIScrollView they are UILabels and UIButtons and UITextfields using Masonry but i am very ignore about Masonry concept please help me.
I want screen exactly like below image using Masonry concept and i have started some code for doing this requirement but middle of moments i was strucked to do this requirement please help me how to full fill my requirement
my code:-
#import "ViewController.h"
#import "Masonry.h"
#interface ViewController ()
#end
#implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
UIScrollView *scrollView = [[UIScrollView alloc] init];
scrollView.translatesAutoresizingMaskIntoConstraints = NO;
scrollView.backgroundColor = [UIColor greenColor];
[self.view addSubview:scrollView];
UITextField * textfield1 = [[UITextField alloc]init];
textfield1.translatesAutoresizingMaskIntoConstraints = NO;
textfield1.backgroundColor = [UIColor blackColor];
[scrollView addSubview:textfield1];
UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);
[scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.view.mas_top).with.offset(padding.top);
make.left.equalTo(self.view.mas_left).with.offset(padding.left);
make.bottom.equalTo(self.view.mas_bottom).with.offset(-padding.bottom);
make.right.equalTo(self.view.mas_right).with.offset(-padding.right);
}];
UIEdgeInsets padding1 = UIEdgeInsetsMake(10, 100, 10, 0);
[textfield1 mas_makeConstraints:^(MASConstraintMaker *make1){
make1.top.equalTo(scrollView.mas_top).width.offset(padding1.top);
make1.left.equalTo(scrollView.mas_left).with.offset(padding1.left);
make1.height.equalTo(scrollView.mas_height).with.offset(30);
make1.right.equalTo(scrollView.mas_right).with.offset(-padding1.right);
}];
}
#end
Here is an example on how to make it work. I did not do all labels but enough to give you an idea how this should be implemented:
#interface ViewController ()
#property (nonatomic) UIScrollView *scrollView;
#property (nonatomic) UILabel *label1;
#property (nonatomic) UITextField *textField1;
#property (nonatomic) UITextField *textField2;
#property (nonatomic) UITextField *textField3;
#property (nonatomic) UIButton *leftButton;
#property (nonatomic) UIButton *rightButton;
#end
#implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
self.view.backgroundColor = [UIColor colorWithWhite:0.95 alpha:1];
self.scrollView = [[UIScrollView alloc] init];
self.label1 = [[UILabel alloc] init];
self.textField1 = [[UITextField alloc] init];
self.textField2 = [[UITextField alloc] init];
self.textField3 = [[UITextField alloc] init];
self.leftButton = [UIButton buttonWithType:UIButtonTypeCustom];
self.rightButton = [UIButton buttonWithType:UIButtonTypeCustom];
self.label1.text = #"Label 1";
self.leftButton.backgroundColor = [UIColor greenColor];
[self.leftButton setTitle:#"Left Button" forState:UIControlStateNormal];
self.rightButton.backgroundColor = [UIColor greenColor];
[self.rightButton setTitle:#"Right Button" forState:UIControlStateNormal];
self.textField1.placeholder = #"TextField 1";
self.textField2.placeholder = #"TextField 2";
self.textField3.placeholder = #"TextField 3";
self.textField1.backgroundColor = [UIColor colorWithWhite:0 alpha:0.1];
self.textField2.backgroundColor = [UIColor colorWithWhite:0 alpha:0.1];
self.textField3.backgroundColor = [UIColor colorWithWhite:0 alpha:0.1];
[self.view addSubview:self.scrollView];
[self.scrollView addSubview:self.label1];
[self.scrollView addSubview:self.textField1];
[self.scrollView addSubview:self.textField2];
[self.scrollView addSubview:self.textField3];
[self.scrollView addSubview:self.leftButton];
[self.scrollView addSubview:self.rightButton];
[self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.view).insets(UIEdgeInsetsMake(30, 10, 10, 10));
}];
[self.label1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.left.right.equalTo(#0);
make.width.equalTo(self.scrollView);
}];
[self.textField1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.label1.mas_bottom);
make.left.right.equalTo(#0);
make.height.equalTo(#30);
}];
[self.textField2 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.textField1.mas_bottom).offset(20);
make.left.equalTo(#0);
make.height.equalTo(self.textField1);
}];
[self.textField3 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.textField2);
make.left.equalTo(self.textField2.mas_right).offset(20);
make.right.equalTo(#0);
make.width.equalTo(self.textField2).multipliedBy(0.7);
make.height.equalTo(self.textField1);
}];
[self.leftButton mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.textField2.mas_bottom).offset(40);
make.left.equalTo(#0);
make.bottom.equalTo(#0);
}];
[self.rightButton mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.leftButton);
make.right.equalTo(#0);
make.bottom.equalTo(#0);
make.width.equalTo(self.leftButton);
}];
}
This is what it looks like:
If you want to know a bit more about UIScrollViews and AutoLayout, here is a short blog post I wrote about this topic: UIScrollView and Auto Layout
I'm learning Objective C & working on an Instagram clone for a class assignment. Currently I have a problem with auto layout. Specifically, images & comments are overlapping on each other:
I believe the problem is in the auto layout:
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
// Initialization code
self.mediaImageView = [[UIImageView alloc] init];
self.usernameAndCaptionLabel = [[UILabel alloc] init];
self.usernameAndCaptionLabel.numberOfLines = 0;
self.commentLabel = [[UILabel alloc] init];
self.commentLabel.numberOfLines = 0;
for (UIView *view in #[self.mediaImageView, self.usernameAndCaptionLabel, self.commentLabel]) {
[self.contentView addSubview:view];
view.translatesAutoresizingMaskIntoConstraints = NO;
}
NSDictionary *viewDictionary = NSDictionaryOfVariableBindings(_mediaImageView, _usernameAndCaptionLabel, _commentLabel);
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_mediaImageView]|" options:kNilOptions metrics:nil views:viewDictionary]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_usernameAndCaptionLabel]|" options:kNilOptions metrics:nil views:viewDictionary]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_commentLabel]|" options:kNilOptions metrics:nil views:viewDictionary]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[_mediaImageView][_usernameAndCaptionLabel][_commentLabel]"
options:kNilOptions
metrics:nil
views:viewDictionary]];
self.imageHeightConstraint = [NSLayoutConstraint constraintWithItem:_mediaImageView
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:nil
attribute:NSLayoutAttributeNotAnAttribute
multiplier:1
constant:100];
self.usernameAndCaptionLabelHeightConstraint = [NSLayoutConstraint constraintWithItem:_usernameAndCaptionLabel
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:nil
attribute:NSLayoutAttributeNotAnAttribute
multiplier:1
constant:100];
self.commentLabelHeightConstraint = [NSLayoutConstraint constraintWithItem:_commentLabel
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:nil
attribute:NSLayoutAttributeNotAnAttribute
multiplier:1
constant:100];
[self.contentView addConstraints:#[self.imageHeightConstraint, self.usernameAndCaptionLabelHeightConstraint, self.commentLabelHeightConstraint]]; }
return self;
}
I've gone through the class tutorial several time and have researched iOS SDK Table Cell Overlapping but have not been able to find a suitable answer.
Here is the entire code:
#import "AppDelegate.h"
#import "UITableViewCell+BLCMediaTableViewCell.h"
#import "NSObject+BLCMedia.h"
#import "NSObject+BLCComment.h"
#import "NSObject+BLCUser.h"
//#implementation UITableViewCell (BLCMediaTableViewCell)
#interface BLCMediaTableViewCell() {
BLCMedia* _mediaItem;
}
#property (nonatomic, strong) UIImageView *mediaImageView;
#property (nonatomic, strong) UILabel *usernameAndCaptionLabel;
#property (nonatomic, strong) UILabel *commentLabel;
// Assignment: Added auto layout
#property (nonatomic, strong) NSLayoutConstraint *imageHeightConstraint;
#property (nonatomic, strong) NSLayoutConstraint *usernameAndCaptionLabelHeightConstraint;
#property (nonatomic, strong) NSLayoutConstraint *commentLabelHeightConstraint;
#end
static UIFont *lightFont;
static UIFont *boldFont;
static UIColor *usernameLabelGray;
static UIColor *commentLabelGray;
static UIColor *linkColor;
static NSParagraphStyle *paragraphStyle;
#implementation BLCMediaTableViewCell : UITableViewCell
- (void) layoutSubviews
{
[super layoutSubviews];
// Before layout, calculate the intrinsic size of the labels (the size they "want" to be), and add 20 to the height for some vertical padding.
self.imageView.contentMode = UIViewContentModeScaleAspectFill;
self.imageView.frame = CGRectMake(self.imageView.frame.origin.x, self.imageView.frame.origin.y, 100, 100);
CGSize maxSize = CGSizeMake(CGRectGetWidth(self.bounds), CGFLOAT_MAX);
CGSize usernameLabelSize = [self.usernameAndCaptionLabel sizeThatFits:maxSize];
CGSize commentLabelSize = [self.commentLabel sizeThatFits:maxSize];
self.usernameAndCaptionLabelHeightConstraint.constant = usernameLabelSize.height + 20;
self.commentLabelHeightConstraint.constant = commentLabelSize.height + 20;
// Hide the line between cells
self.separatorInset = UIEdgeInsetsMake(0, 0, 0, CGRectGetWidth(self.bounds));
}
+ (void)load {
lightFont = [UIFont fontWithName:#"HelveticaNeue-Thin" size:11];
boldFont = [UIFont fontWithName:#"HelveticaNeue-Bold" size:11];
usernameLabelGray = [UIColor colorWithRed:0.933 green:0.933 blue:0.933 alpha:1]; /*#eeeeee*/
commentLabelGray = [UIColor colorWithRed:0.898 green:0.898 blue:0.898 alpha:1]; /*#e5e5e5*/
linkColor = [UIColor colorWithRed:0.345 green:0.314 blue:0.427 alpha:1]; /*#58506d*/
NSMutableParagraphStyle *mutableParagraphStyle = [[NSMutableParagraphStyle alloc] init];
mutableParagraphStyle.headIndent = 20.0;
mutableParagraphStyle.firstLineHeadIndent = 20.0;
mutableParagraphStyle.tailIndent = -20.0;
mutableParagraphStyle.paragraphSpacingBefore = 5;
paragraphStyle = mutableParagraphStyle;
}
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
// Initialization code
self.mediaImageView = [[UIImageView alloc] init];
self.usernameAndCaptionLabel = [[UILabel alloc] init];
self.usernameAndCaptionLabel.numberOfLines = 0;
self.commentLabel = [[UILabel alloc] init];
self.commentLabel.numberOfLines = 0;
for (UIView *view in #[self.mediaImageView, self.usernameAndCaptionLabel, self.commentLabel]) {
[self.contentView addSubview:view];
view.translatesAutoresizingMaskIntoConstraints = NO;
}
NSDictionary *viewDictionary = NSDictionaryOfVariableBindings(_mediaImageView, _usernameAndCaptionLabel, _commentLabel);
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_mediaImageView]|" options:kNilOptions metrics:nil views:viewDictionary]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_usernameAndCaptionLabel]|" options:kNilOptions metrics:nil views:viewDictionary]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_commentLabel]|" options:kNilOptions metrics:nil views:viewDictionary]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[_mediaImageView][_usernameAndCaptionLabel][_commentLabel]"
options:kNilOptions
metrics:nil
views:viewDictionary]];
self.imageHeightConstraint = [NSLayoutConstraint constraintWithItem:_mediaImageView
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:nil
attribute:NSLayoutAttributeNotAnAttribute
multiplier:1
constant:100];
self.usernameAndCaptionLabelHeightConstraint = [NSLayoutConstraint constraintWithItem:_usernameAndCaptionLabel
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:nil
attribute:NSLayoutAttributeNotAnAttribute
multiplier:1
constant:100];
self.commentLabelHeightConstraint = [NSLayoutConstraint constraintWithItem:_commentLabel
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:nil
attribute:NSLayoutAttributeNotAnAttribute
multiplier:1
constant:100];
[self.contentView addConstraints:#[self.imageHeightConstraint, self.usernameAndCaptionLabelHeightConstraint, self.commentLabelHeightConstraint]]; }
return self;
}
- (NSAttributedString *) usernameAndCaptionString {
CGFloat usernameFontSize = 15;
// Make a string that says "username caption text"
NSString *baseString = [NSString stringWithFormat:#"%# %#", self.mediaItem.user.userName, self.mediaItem.caption];
// Make an attributed string, with the "username" bold
NSMutableAttributedString *mutableUsernameAndCaptionString = [[NSMutableAttributedString alloc] initWithString:baseString attributes:#{NSFontAttributeName : [lightFont fontWithSize:usernameFontSize], NSParagraphStyleAttributeName : paragraphStyle}];
NSRange usernameRange = [baseString rangeOfString:self.mediaItem.user.userName];
[mutableUsernameAndCaptionString addAttribute:NSFontAttributeName value:[boldFont fontWithSize:usernameFontSize] range:usernameRange];
[mutableUsernameAndCaptionString addAttribute:NSForegroundColorAttributeName value:linkColor range:usernameRange];
return mutableUsernameAndCaptionString;
}
- (void) setMediaItem:(BLCMedia *)mediaItem {
_mediaItem = mediaItem;
self.mediaImageView.image = _mediaItem.image;
self.usernameAndCaptionLabel.attributedText = [self usernameAndCaptionString];
self.commentLabel.attributedText = [self commentString];
self.imageHeightConstraint.constant = self.mediaItem.image.size.height / self.mediaItem.image.size.width * CGRectGetWidth(self.contentView.bounds);
}
//Added
- (CGSize) sizeOfString:(NSAttributedString *)string {
CGSize maxSize = CGSizeMake(CGRectGetWidth(self.contentView.bounds) - 40, 0.0);
CGRect sizeRect = [string boundingRectWithSize:maxSize options:NSStringDrawingUsesLineFragmentOrigin context:nil];
sizeRect.size.height += 20;
sizeRect = CGRectIntegral(sizeRect);
return sizeRect.size;
}
- (NSAttributedString *) commentString {
NSMutableAttributedString *commentString = [[NSMutableAttributedString alloc] init];
for (BLCComment *comment in self.mediaItem.comments) {
// Make a string that says "username comment text" followed by a line break
NSString *baseString = [NSString stringWithFormat:#"%# %#\n", comment.from.userName, comment.text];
// Make an attributed string, with the "username" bold
NSMutableAttributedString *oneCommentString = [[NSMutableAttributedString alloc] initWithString:baseString attributes:#{NSFontAttributeName : lightFont, NSParagraphStyleAttributeName : paragraphStyle}];
NSRange usernameRange = [baseString rangeOfString:comment.from.userName];
[oneCommentString addAttribute:NSFontAttributeName value:boldFont range:usernameRange];
[oneCommentString addAttribute:NSForegroundColorAttributeName value:linkColor range:usernameRange];
[commentString appendAttributedString:oneCommentString];
}
return commentString;
}
+ (CGFloat) heightForMediaItem:(BLCMedia *)mediaItem width:(CGFloat)width {
// Make a cell
BLCMediaTableViewCell *layoutCell = [[BLCMediaTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:#"layoutCell"];
[layoutCell setNeedsLayout];
[layoutCell layoutIfNeeded];
// Get the actual height required for the cell
return CGRectGetMaxY(layoutCell.commentLabel.frame);
}
#end
So I figured out what I was doing wrong. My layoutSubViews were incorrect. I've included a screenshot of the bad version & the corrected version in my public Dropbox. I hope this can help someone else later down the road.
The original code was:
- (void) layoutSubviews
{
[super layoutSubviews];
// Before layout, calculate the intrinsic size of the labels (the size they "want" to be), and add 20 to the height for some vertical padding.
self.imageView.contentMode = UIViewContentModeScaleAspectFill;
self.imageView.frame = CGRectMake(self.imageView.frame.origin.x, self.imageView.frame.origin.y, 100, 100);
CGSize maxSize = CGSizeMake(CGRectGetWidth(self.bounds), CGFLOAT_MAX);
CGSize usernameLabelSize = [self.usernameAndCaptionLabel sizeThatFits:maxSize];
CGSize commentLabelSize = [self.commentLabel sizeThatFits:maxSize];
self.usernameAndCaptionLabelHeightConstraint.constant = usernameLabelSize.height + 20;
self.commentLabelHeightConstraint.constant = commentLabelSize.height + 20;
// Hide the line between cells
self.separatorInset = UIEdgeInsetsMake(0, 0, 0, CGRectGetWidth(self.bounds));
}
It should have read:
- (void) layoutSubviews
{
[super layoutSubviews];
if (self.mediaItem == nil){
return;
}
// Before layout, calculate the intrinsic size of the labels (the size they "want" to be), and add 20 to the height for some vertical padding.
CGSize maxSize = CGSizeMake(CGRectGetWidth(self.bounds), CGFLOAT_MAX);
CGSize usernameLabelSize = [self.usernameAndCaptionLabel sizeThatFits:maxSize];
CGSize commentLabelSize = [self.commentLabel sizeThatFits:maxSize];
self.usernameAndCaptionLabelHeightConstraint.constant = usernameLabelSize.height + 20;
self.commentLabelHeightConstraint.constant = commentLabelSize.height + 20;
if (_mediaItem.image)
{
self.imageHeightConstraint.constant = self.mediaItem.image.size.height / self.mediaItem.image.size.width * CGRectGetWidth(self.contentView.bounds);
}
else
{
self.imageHeightConstraint.constant = 100;
}
//Hide the line between cells
self.separatorInset = UIEdgeInsetsMake(0, 0, 0, CGRectGetWidth(self.bounds));
}
I'm basically trying to achieve this effect: http://youtu.be/VBW2i0P11iI
The tableview is a basic one that's pinned to it's superview with autolayout. The view underneath is added with the classic insertSubview:belowSubview: / addChildViewController combo.
I've tried a couple of approaches. What I have now is:
if (scrollOffset >= -scrollView.contentInset.top) {
self.resultsTableViewContainerTopConstraint.constant = 0;
} else {
self.resultsTableViewContainerTopConstraint.constant = MAX(self.resultsTableViewContainerTopConstraint.constant, self.resultsTableViewContainerTopConstraint.constant - scrollDiff);
}
}
So I'm basically changing the top constraint based on the delta of contentOffset. The problem with this is that the uitableview bounces back so it always gets into the first branch of the if. But even if I solve this problem I feel like I'll just patch it. I'm sure there's a way more elegant way of achieving the effect in the video having the same responsiveness.
Any suggestion will be much appreciated.
Thanks
I'm not sure if this is what you want but I hacked up a quick demo:
ViewController.h
#import <UIKit/UIKit.h>
#interface ViewController : UIViewController <UITableViewDataSource, UITableViewDelegate, UIScrollViewDelegate>
#property (nonatomic, strong) UIView *headerView;
#property (nonatomic, strong) UILabel *lblTitle;
#property (nonatomic, strong) UIButton *btnReset;
#property (nonatomic, strong) UIImageView *imageView;
#property (nonatomic, strong) UIScrollView *scrollView;
#property (nonatomic, strong) UITableView *tableView;
#property (nonatomic, strong) NSLayoutConstraint *scrollViewTopConstraint;
#end
ViewController.m
#import "ViewController.h"
#interface ViewController ()
#end
#implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
//self.view.backgroundColor = [UIColor whiteColor];
[self initViews];
[self initConstraints];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
-(void)initViews
{
self.view.backgroundColor = [UIColor colorWithRed:43.0/255.0 green:39.0/255.0 blue:55.0/255.0 alpha:1.0];
self.scrollView = [[UIScrollView alloc] init];
self.scrollView.backgroundColor = [UIColor clearColor];
self.scrollView.alwaysBounceVertical = YES;
self.scrollView.delegate = self;
self.headerView = [[UIView alloc] init];
self.headerView.backgroundColor = [UIColor colorWithRed:43.0/255.0 green:39.0/255.0 blue:55.0/255.0 alpha:1.0];
self.headerView.layer.shadowColor = [UIColor blackColor].CGColor;
self.headerView.layer.shadowOffset = CGSizeMake(0,0);
self.headerView.layer.shadowOpacity = 0.25;
self.headerView.layer.shadowRadius = 4;
self.lblTitle = [[UILabel alloc] init];
self.lblTitle.text = #"HEADER VIEW";
self.lblTitle.textColor = [UIColor whiteColor];
self.lblTitle.textAlignment = NSTextAlignmentCenter;
self.btnReset = [[UIButton alloc] init];
[self.btnReset setTitle:#"Reset" forState:UIControlStateNormal];
self.btnReset.backgroundColor = [UIColor colorWithRed:0.75 green:0.0 blue:0.0 alpha:1.0];
self.btnReset.layer.cornerRadius = 5.0;
[self.btnReset addTarget:self action:#selector(resetView) forControlEvents:UIControlEventTouchUpInside];
self.imageView = [[UIImageView alloc] init];
self.imageView.backgroundColor = [UIColor colorWithRed:43.0/255.0 green:39.0/255.0 blue:55.0/255.0 alpha:1.0];
self.tableView = [[UITableView alloc] init];
self.tableView.delegate = self;
self.tableView.dataSource = self;
self.tableView.rowHeight = 150.0;
self.tableView.layer.shadowColor = [UIColor blackColor].CGColor;
self.tableView.layer.shadowOffset = CGSizeMake(0,-5);
self.tableView.layer.shadowOpacity = 0.5;
self.tableView.layer.shadowRadius = 20;
self.tableView.backgroundColor = [UIColor clearColor];
self.tableView.scrollEnabled = NO;
self.tableView.clipsToBounds = NO;
[self.headerView addSubview:self.lblTitle];
[self.headerView addSubview:self.btnReset];
[self.scrollView addSubview:self.tableView];
[self.view addSubview:self.imageView];
[self.view addSubview:self.scrollView];
[self.view addSubview:self.headerView];
}
-(void)initConstraints
{
self.scrollView.translatesAutoresizingMaskIntoConstraints = NO;
self.headerView.translatesAutoresizingMaskIntoConstraints = NO;
self.lblTitle.translatesAutoresizingMaskIntoConstraints = NO;
self.btnReset.translatesAutoresizingMaskIntoConstraints = NO;
self.imageView.translatesAutoresizingMaskIntoConstraints = NO;
self.tableView.translatesAutoresizingMaskIntoConstraints = NO;
id views = #{
#"scrollView": self.scrollView,
#"headerView": self.headerView,
#"lblTitle": self.lblTitle,
#"btnReset": self.btnReset,
#"imageView": self.imageView,
#"tableView": self.tableView
};
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[scrollView]|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:[scrollView]" options:0 metrics:nil views:views]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.scrollView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0.0]];
self.scrollViewTopConstraint = [NSLayoutConstraint constraintWithItem:self.scrollView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0];
[self.view addConstraint:self.scrollViewTopConstraint];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.scrollView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0.0]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[headerView(320)]|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[headerView(50)]" options:0 metrics:nil views:views]];
[self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[tableView(320)]|" options:0 metrics:nil views:views]];
[self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|-150-[tableView(300)]|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[imageView(320)]|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[imageView(320)]" options:0 metrics:nil views:views]];
[self.headerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[lblTitle]|" options:0 metrics:nil views:views]];
[self.headerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[lblTitle]|" options:0 metrics:nil views:views]];
[self.headerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:[btnReset(80)]-5-|" options:0 metrics:nil views:views]];
[self.headerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|-8-[btnReset]-8-|" options:0 metrics:nil views:views]];
}
-(BOOL)prefersStatusBarHidden
{
return YES;
}
#pragma mark - TableView Methods -
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return 2;
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *cellID = #"cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID];
if(cell == nil)
{
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellID];
}
cell.backgroundColor = [UIColor colorWithRed:0.5 green:0.5 blue:0.5 alpha:1.0];
return cell;
}
#pragma mark - ScrollView Delegate -
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
//NSLog(#"scrollView offset = %lf", scrollView.contentOffset.y);
if(scrollView.contentOffset.y <= -145)
{
//self.scrollView.scrollEnabled = NO;
self.scrollViewTopConstraint.constant = self.view.bounds.size.height;
[UIView animateWithDuration:0.5 delay:0.0 options:UIViewAnimationOptionCurveEaseOut animations:^{
[self.scrollView layoutIfNeeded];
} completion:^(BOOL finished) {
}];
}
}
-(void)resetView
{
self.scrollViewTopConstraint.constant = 0;
[UIView animateWithDuration:0.5 delay:0.0 options:UIViewAnimationOptionCurveEaseIn animations:^{
[self.scrollView layoutIfNeeded];
} completion:^(BOOL finished) {
}];
}
What you get when you open the app:
Then you drag down to the edge, the view snaps open:
Press the red reset button to bring it back up :D
First of all I've been reading all questions similar to this one, but with no success, so finally I'll try asking my specific case.
I have a UIScrollView that I fill with components programmatically this way:
- (void) fillScrollView(int numItems)
{
float posY = 10.0;
for(int i = 0; i < numItems; i++)
{
UIImageView *leftImg = [[UIImageView alloc] init];
[leftImg setTranslatesAutoresizingMaskIntoConstraints:NO];
[leftImg setFrame:CGRectMake(10.0, posY, 20.0, 20.0)];
[leftImg setImage:[UIImage imageNamed:#"img1"]];
UILabel *txtLb = [[UILabel alloc] init];
[txtLb setTranslatesAutoresizingMaskIntoConstraints:NO];
[txtLb setFont:[UIFont systemFontOfSize:15.0]];
[txtLb setNumberOfLines:0];
[txtLb setLineBreakMode:NSLineBreakByWordWrapping];
[txtLb setFrame:CGRectMake(40.0, posY, 240.0, 20.0)];
NSString *data = #"This is my example text, it could be longer.";
[txtLb setText:data];
CGRect paragraphRect = [dato boundingRectWithSize:CGSizeMake(txtLb.frame.size.width, 9999.0)
options:(NSStringDrawingUsesLineFragmentOrigin|NSStringDrawingUsesFontLeading)
attributes:#{NSFontAttributeName: txtLb.font}
context:nil];
float height = paragraphRect.size.height;
CGRect frame = txtLb.frame;
frame.size.height = ceil(height);
[txtLb setFrame:frame];
UIImageView *rightImg = [[UIImageView alloc] init];
[rightImg setTranslatesAutoresizingMaskIntoConstraints:NO];
[rightImg setFrame:CGRectMake(290.0, posY, 20.0, 20.0)];
[rightImg setImage:[UIImage imageNamed:#"img2"]];
[_scrollV addSubview:leftImg];
[_scrollV addSubview:txtLb];
[_scrollV addSubview:rightImg];
height = height + 20.0;
if(height < 40.0) height = 40.0;
posY = posY + height;
}
[_scrollV setContentSize:CGSizeMake(_scrollV.frame.size.width, posY)];
}
I would like that theis constraints were:
H:|-10-[leftImg(20)]-10-[txtLb]-10-[rightImg(20)]-10-|
And vertically each row has a space of 10px of vertical separation from the row above.
I've tried using constraintWithItem but I'm confused about how to use it in this case.
Any help would be very appreciated. Kind regards!
EDIT
Following Zhang's suggestion I've put the 3 components inside a UIView. This way I can use autolayout between them without problems and everything is in the correct position inside each UIView.
However I'm still having problems using autolayout between UIViews inside the loop. I'm doing this:
All blocks have no left/right margin with the UIScrollView.
// 0px to the left of the UIScrollView
NSLayoutConstraint *constraintLeft = [NSLayoutConstraint constraintWithItem:block
attribute:NSLayoutAttributeLeftMargin
relatedBy:NSLayoutRelationEqual
toItem:_scrollV
attribute:NSLayoutAttributeRightMargin
multiplier:1.0
constant:0.0];
// 0px to the right of the UIScrollView
NSLayoutConstraint *constraintRight = [NSLayoutConstraint constraintWithItem:block
attribute:NSLayoutAttributeRightMargin
relatedBy:NSLayoutRelationEqual
toItem:_scrollV
attribute:NSLayoutAttributeLeftMargin
multiplier:1.0
constant:0.0];
[_scrollV addConstraint:constraintLeft];
[_scrollV addConstraint:constraintRight];
Regarding to the vertical separation between blocks, when the UIView is the first block of the UIScrollView:
// 10px below UIScrollView top
NSLayoutConstraint *constraintTop = [NSLayoutConstraint constraintWithItem:block
attribute:NSLayoutAttributeTopMargin
relatedBy:NSLayoutRelationEqual
toItem:_scrollV
attribute:NSLayoutAttributeBottomMargin
multiplier:1.0
constant:10.0];
[_scrollV addConstraint:constraintTop];
And when the UIView has any block above it:
// 10px below previous block
NSLayoutConstraint *constraintTop = [NSLayoutConstraint constraintWithItem:block
attribute:NSLayoutAttributeTopMargin
relatedBy:NSLayoutRelationEqual
toItem:previousBlock
attribute:NSLayoutAttributeBottomMargin
multiplier:1.0
constant:10.0];
[_scrollV addConstraint:constraintTop];
This shows all blocks without vertical separation, all in the same Y position, and also give errors applying constraints.
I'm sure I'm not using the right way constraintWithItem, but I can not find examples for this use.
It seems like you're trying to reinvent the wheel mate. You probably should be using UICollectionView or UITableView instead of UIScrollView and manually adding your cells.
Anyhow, for your scrollView method, one way you can implement it is like this:
ViewController Header File
#import <UIKit/UIKit.h>
#interface ViewController : UIViewController
#property (nonatomic, strong) UIScrollView *scrollView;
#property (nonatomic, strong) UIView *contentView;
#end
ViewController Implementation File
#import "ViewController.h"
#import "Cell.h"
#interface ViewController ()
#end
#implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
[self initViews];
[self initConstraints];
[self fillScrollView:15];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
-(BOOL)prefersStatusBarHidden
{
return YES;
}
-(void)initViews
{
self.scrollView = [[UIScrollView alloc] init];
// ------------------------------------------------------------------
// This content view will be the only child view of scrollview
// ------------------------------------------------------------------
self.contentView = [[UIView alloc] init];
// add content view to scrollview now
[self.scrollView addSubview:self.contentView];
// add scrollview to main view
[self.view addSubview:self.scrollView];
}
-(void)initConstraints
{
self.scrollView.translatesAutoresizingMaskIntoConstraints = NO;
self.contentView.translatesAutoresizingMaskIntoConstraints = NO;
id views = #{
#"scrollView": self.scrollView,
#"contentView": self.contentView
};
// setup scrollview constraints
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[scrollView]|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[scrollView]|" options:0 metrics:nil views:views]];
// ---------------------------------------
// setup content view constraint
//
// note: need to pin all four side of
// contentView to scrollView
// ---------------------------------------
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[contentView]|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[contentView]|" options:0 metrics:nil views:views]];
}
-(void)fillScrollView:(int) numItems
{
// clear any previous cells before adding new ones
[self.contentView.subviews makeObjectsPerformSelector:#selector(removeFromSuperview)];
// Need to construct the layout visual format string
NSMutableString *strVerticalConstraint = [[NSMutableString alloc] init];
[strVerticalConstraint appendString:#"V:|"];
// this dictionary will hold all the key-value pair that identifies all the subviews
NSMutableDictionary *subviews = [[NSMutableDictionary alloc] init];
for(int i = 0; i < numItems; i++)
{
Cell *cell = [[Cell alloc] init];
// customize the cell's appearance here
cell.leftImage.image = [UIImage imageNamed:#"leftImage.png"];
cell.textLabel.text = #"This is my example text, it could be longer.";
cell.rightImage.image = [UIImage imageNamed:#"rightImage.png"];
[self.contentView addSubview:cell];
cell.translatesAutoresizingMaskIntoConstraints = NO;
id views = #{
#"cell": cell
};
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[cell]|" options:0 metrics:nil views:views]];
// prevent cell's width to extend beyond screen width
[self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:cell attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeWidth multiplier:1.0 constant:self.view.bounds.size.width]];
// cell name
NSString *cellName = [[NSString alloc] initWithFormat:#"cell%d", i];
// construct each cell's vertical constraint to add it strVerticalConstraint
NSString *viewName = nil;
if(i < numItems - 1)
{
viewName = [[NSString alloc] initWithFormat:#"[%#(50)]-10-", cellName];
}
else
{
viewName = [[NSString alloc] initWithFormat:#"[%#(50)]", cellName];
}
[strVerticalConstraint appendString:viewName];
// add cell name to dictionary
[subviews setValue:cell forKey:cellName];
}
[strVerticalConstraint appendString:#"|"];
NSLog(#"strVerticalConstraint: \n%#", strVerticalConstraint);
// Finally, use the long vertical constraint string
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:strVerticalConstraint options:0 metrics:nil views:subviews]];
}
#end
Cell Header File
#import <UIKit/UIKit.h>
#interface Cell : UIView
#property (nonatomic, strong) UIImageView *leftImage;
#property (nonatomic, strong) UILabel *textLabel;
#property (nonatomic, strong) UIImageView *rightImage;
#end
Cell Implementation File
#import "Cell.h"
#implementation Cell
-(id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if(self)
{
[self initViews];
[self initConstraints];
}
return self;
}
-(void)initViews
{
self.backgroundColor = [UIColor grayColor];
self.leftImage = [[UIImageView alloc] init];
self.leftImage.contentMode = UIViewContentModeScaleAspectFill;
self.leftImage.clipsToBounds = YES;
self.leftImage.layer.cornerRadius = 10.0;
self.textLabel = [[UILabel alloc] init];
self.textLabel.numberOfLines = 0;
self.textLabel.lineBreakMode = NSLineBreakByWordWrapping;
self.rightImage = [[UIImageView alloc] init];
self.rightImage.contentMode = UIViewContentModeScaleAspectFill;
self.rightImage.layer.cornerRadius = 10.0;
self.rightImage.clipsToBounds = YES;
[self addSubview:self.leftImage];
[self addSubview:self.textLabel];
[self addSubview:self.rightImage];
}
-(void)initConstraints
{
self.leftImage.translatesAutoresizingMaskIntoConstraints = NO;
self.textLabel.translatesAutoresizingMaskIntoConstraints = NO;
self.rightImage.translatesAutoresizingMaskIntoConstraints = NO;
id views = #{
#"leftImage": self.leftImage,
#"textLabel": self.textLabel,
#"rightImage": self.rightImage
};
// horizontal constraints
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|-10-[leftImage(20)]-10-[textLabel]-[rightImage(20)]-10-|" options:0 metrics:nil views:views]];
// vertical constraints
[self addConstraint:[NSLayoutConstraint constraintWithItem:self.leftImage attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];
[self addConstraint:[NSLayoutConstraint constraintWithItem:self.textLabel attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];
[self addConstraint:[NSLayoutConstraint constraintWithItem:self.rightImage attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:[leftImage(20)]" options:0 metrics:nil views:views]];
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:[rightImage(20)]" options:0 metrics:nil views:views]];
}
#end
You should see something like this:
Maybe you have your reason's for using a scrollView and manually adding each row, otherwise, if you're open to alternative, you can use UICollectionView or UITableView.
The method above will result in a lot of memory use as you can imagine if you had 1000 rows, the app needs to calculate, rendering and store 1000 rows in memory. Not scalable, and not feasible.
That's where UITableView or UICollectionView comes in, they reuse each cell when it goes offscreen that way, you'll only ever need to render and store the visible cells on screen.
UICollectionView Demo
So, if you want to see a UICollectionView approach, this is a demo of how you can do it:
ViewController Header File
#import <UIKit/UIKit.h>
#interface ViewController : UIViewController <UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout>
#property (nonatomic, strong) UICollectionView *collectionView;
#property (nonatomic, strong) NSArray *items;
#end
ViewController Implementation File
#import "ViewController.h"
#import "CustomCell.h"
#interface ViewController ()
#end
#implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
[self initViews];
[self initConstraints];
// --------------------------------------------------------
// Hardcoding 15 sample items as the data source.
// Your data might be from a JSON webservice REST API.
// --------------------------------------------------------
self.items = #[
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer.",
#"This is my example text, it could be longer."
];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
-(void)initViews
{
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
flowLayout.minimumInteritemSpacing = 0;
flowLayout.minimumLineSpacing = 10;
self.collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:flowLayout];
self.collectionView.backgroundColor = [UIColor whiteColor];
// need to tell CollectionView beforehand the cell class you want to use
[self.collectionView registerClass:[CustomCell class] forCellWithReuseIdentifier:#"cellID"];
self.collectionView.delegate = self;
self.collectionView.dataSource = self;
[self.view addSubview:self.collectionView];
}
-(void)initConstraints
{
self.collectionView.translatesAutoresizingMaskIntoConstraints = NO;
id views = #{
#"collectionView": self.collectionView
};
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[collectionView]|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[collectionView]|" options:0 metrics:nil views:views]];
}
#pragma mark - UICollectionView Methods -
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return self.items.count;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
// note: reuse identifier must match what you specified in the register cell above
CustomCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:#"cellID" forIndexPath:indexPath];
// ---------------------------------------------------------------
// hardcoding images here, you might load your images from JSON
// data using an image caching library like SDWebImage
// ---------------------------------------------------------------
cell.leftImage.image = [UIImage imageNamed:#"leftImage.png"];
// getting text data from data source "self.items"
cell.textLabel.text = self.items[indexPath.row];
cell.rightImage.image = [UIImage imageNamed:#"rightImage.png"];
return cell;
}
// ----------------------------------------------------------------
// Tells the collection view the width and height of each cell
// ----------------------------------------------------------------
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
CGSize size = CGSizeMake(self.view.frame.size.width, 50.0);
return size;
}
#end
CustomCell Header File
#import <UIKit/UIKit.h>
#interface CustomCell : UICollectionViewCell
#property (nonatomic, strong) UIImageView *leftImage;
#property (nonatomic, strong) UILabel *textLabel;
#property (nonatomic, strong) UIImageView *rightImage;
#end
CustomCell Implementation File
#import "CustomCell.h"
#implementation CustomCell
-(id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if(self)
{
[self initViews];
[self initConstraints];
}
return self;
}
-(void)initViews
{
self.backgroundColor = [UIColor grayColor];
self.leftImage = [[UIImageView alloc] init];
self.leftImage.contentMode = UIViewContentModeScaleAspectFill;
self.leftImage.clipsToBounds = YES;
self.leftImage.layer.cornerRadius = 10.0;
self.textLabel = [[UILabel alloc] init];
self.textLabel.numberOfLines = 0;
self.textLabel.lineBreakMode = NSLineBreakByWordWrapping;
self.rightImage = [[UIImageView alloc] init];
self.rightImage.contentMode = UIViewContentModeScaleAspectFill;
self.rightImage.layer.cornerRadius = 10.0;
self.rightImage.clipsToBounds = YES;
[self.contentView addSubview:self.leftImage];
[self.contentView addSubview:self.textLabel];
[self.contentView addSubview:self.rightImage];
}
-(void)initConstraints
{
self.leftImage.translatesAutoresizingMaskIntoConstraints = NO;
self.textLabel.translatesAutoresizingMaskIntoConstraints = NO;
self.rightImage.translatesAutoresizingMaskIntoConstraints = NO;
id views = #{
#"leftImage": self.leftImage,
#"textLabel": self.textLabel,
#"rightImage": self.rightImage
};
// horizontal constraints
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|-10-[leftImage(20)]-10-[textLabel]-[rightImage(20)]-10-|" options:0 metrics:nil views:views]];
// vertical constraints
[self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:self.leftImage attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.contentView attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];
[self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:self.textLabel attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.contentView attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];
[self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:self.rightImage attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.contentView attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:[leftImage(20)]" options:0 metrics:nil views:views]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:[rightImage(20)]" options:0 metrics:nil views:views]];
}
#end
You end up with something like this:
Look the same but more efficient :D
No I didn't upload the same screenshot :P
Hope that helps?