I am using https://github.com/alekseyn/EasyTableView to create a scrollable table view with images. It works very well as given int the demo.
But my custom requirement is to have 2 rows instead of 1 row. So i decided to add 2 image views instead of 1 for a single cell in the table.
- (UIView *)easyTableView:(EasyTableView *)easyTableView viewForRect:(CGRect)rect {
// Create a container view for an EasyTableView cell
UIView *container = [[UIView alloc] initWithFrame:rect];;
// Setup an image view to display an image
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(1, 0, rect.size.width-2, rect.size.height/2)];
imageView.tag = IMAGE_TAG;
imageView.contentMode = UIViewContentModeScaleAspectFill;
[container addSubview:imageView];
// Setup a label to display the image title
CGRect labelRect = CGRectMake(10, rect.size.height/2-20, rect.size.width-20, 20);
UILabel *label = [[UILabel alloc] initWithFrame:labelRect];
label.textAlignment = UITextAlignmentCenter;
label.textColor = [UIColor colorWithWhite:1.0 alpha:0.5];
label.backgroundColor = [UIColor clearColor];
label.font = [UIFont boldSystemFontOfSize:14];
label.tag = LABEL_TAG;
[container addSubview:label];
// Setup an image view to display an image
UIImageView *imageView2 = [[UIImageView alloc] initWithFrame:CGRectMake(1, rect.size.height/2, rect.size.width-2, rect.size.height)];
imageView.tag = IMAGE_TAG2;
imageView.contentMode = UIViewContentModeScaleAspectFill;
[container addSubview:imageView2];
// Setup a label to display the image title
CGRect labelRect2 = CGRectMake(10, rect.size.height-20, rect.size.width-20, 20);
UILabel *label2 = [[UILabel alloc] initWithFrame:labelRect2];
label.textAlignment = UITextAlignmentCenter;
label.textColor = [UIColor colorWithWhite:1.0 alpha:0.5];
label.backgroundColor = [UIColor clearColor];
label.font = [UIFont boldSystemFontOfSize:14];
label.tag = LABEL_TAG2;
[container addSubview:label2];
return container;
}
// Second delegate populates the views with data from a data source
- (void)easyTableView:(EasyTableView *)easyTableView setDataForView:(UIView *)view forIndexPath:(NSIndexPath *)indexPath {
// Set the image title for the given index
UILabel *label = (UILabel *)[view viewWithTag:LABEL_TAG];
label.text = [self.imageStore.titles objectAtIndex:indexPath.row];
// Set the image for the given index
UIImageView *imageView = (UIImageView *)[view viewWithTag:IMAGE_TAG];
imageView.image = [self.imageStore imageAtIndex:indexPath.row];
// Set the image title for the given index
UILabel *label2 = (UILabel *)[view viewWithTag:LABEL_TAG2];
label2.text = [self.imageStore.titles objectAtIndex:indexPath.row];
// Set the image for the given index
UIImageView *imageView2 = (UIImageView *)[view viewWithTag:IMAGE_TAG2];
imageView2.image = [self.imageStore imageAtIndex:indexPath.row];
}
Initially for testing i used same image and label for both cells. But it is suspecious that it is showing images and rows on first row means for first image of any cell.
How can i accomplish my requirement.
Related
I'm looking to create an uitableview with overlapping cells like in the image below. The problem is that even if I set clipsToBounds = NO for the cell's content view, the cell fake header(e.g Spanish which will overlap the previous cell) is not displayed.
Does anyone know how to fix this issue?
Here is my code:
- (UITableViewCell *)tableviewCellTournamentWithReuseIdentifier:(NSString *)identifier andPosition:(NSInteger)pos {
UITableViewCell *cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];
if (pos == 0) {
cell.clipsToBounds = NO;
cell.contentView.clipsToBounds = NO;
cell.frame = CGRectMake(0, 0, tournamentsTableView.frame.size.width, CELL_HEIGHT);
UIView* row = [[UIView alloc] initWithFrame:CGRectMake(0, 0, tournamentsTableView.frame.size.width, CELL_HEIGHT)];
row.clipsToBounds = NO;
row.backgroundColor = [UIColor clearColor];
UIView* topRow = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 10)];
topRow.backgroundColor= [UIColor colorWithRed:210/255.0 green:131/255.0 blue:62/255.0 alpha:1.0];
[row addSubview:topRow];
UILabel* label = [[UILabel alloc] initWithFrame:CGRectMake(0, 10, row.frame.size.width, CELL_HEIGHT-10)];
label.backgroundColor = [UIColor colorWithRed:63*pos/255.0 green:71*pos/255.0 blue:113/255.0 alpha:1.0];
label.font = [UIFont fontWithName:#"HelveticaNeue" size:14];
label.tag = TOURNAMENT_NAME;
label.layer.cornerRadius = 5;
[row addSubview:label];
[cell.contentView addSubview:row];
} else {
cell.clipsToBounds = NO;
cell.contentView.clipsToBounds = NO;
cell.frame = CGRectMake(0, -10, tournamentsTableView.frame.size.width, CELL_HEIGHT);
UIView* row = [[UIView alloc] initWithFrame:CGRectMake(0, -10, tournamentsTableView.frame.size.width, CELL_HEIGHT)];
row.clipsToBounds = NO;
row.backgroundColor = [UIColor clearColor];
UIView* topRow = [[UIView alloc] initWithFrame:CGRectMake(0, -10, 100, 10)];
topRow.backgroundColor= [UIColor colorWithRed:210/255.0 green:131/255.0 blue:62/255.0 alpha:1.0];
[row addSubview:topRow];
[cell bringSubviewToFront:tournamentsTableView];
UILabel* label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, row.frame.size.width, CELL_HEIGHT-10)];
label.backgroundColor = [UIColor colorWithRed:63*pos/255.0 green:71*pos/255.0 blue:113/255.0 alpha:1.0];
label.font = [UIFont fontWithName:#"HelveticaNeue" size:14];
label.tag = TOURNAMENT_NAME;
label.layer.cornerRadius = 5;
[row addSubview:label];
[cell.contentView addSubview:row];
}
return cell;
}
And the result is:
The problem is you are trying to manipulate the tableview its self which is why you are experiencing issues. You will need to include the 'tab' in the cell as its much easier to add as many outlets as you like as the cell its self acts as as a separate view.
add your top row to the cell
UIView *topRow = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, 100.0, 10.0)];
topRow.backgroundColor= [UIColor colorWithRed:210/255.0 green:131/255.0 blue:62/255.0 alpha:1.0];
[cell.contentView addSubview:topRow];
then add your main content to the cell and just move it down
UIView* row = [[UIView alloc] initWithFrame:CGRectMake(0.0, 10.0, tournamentsTableView.frame.size.width, CELL_HEIGHT)];
row.clipsToBounds = NO;
row.backgroundColor = [UIColor clearColor];
[cell.contentView addSubview:row];
finally get rid of the background colour of the cell and you almost have your effect.
cell.backgroundColor = [UIColor clearColor];
cell.contentView.backgroundColor = [UIColor clearColor];
Hope that helps :)
My UIButton doesn't respond. I think it is behind the UIView or that it is not the first responder. I made a custom view which subclass is MKAnnotationView. Maybe this is a part of the problem. I also tried to use userInteractionEnabled, but no luck. Anyone had the same issue?
- (id)initWithAnnotation:(id)annotation reuseIdentifier:(NSString *)reuseIdentifier{
self = [super initWithAnnotation:annotation reuseIdentifier:reuseIdentifier];
// Create selected and un-selected pin images
_normalPin = [UIImage imageNamed:#"map_pin.png"];
_selectedPin = [UIImage imageNamed:#"selected_map_pin.png"];
// Set current pin to unselected image
self.image = _normalPin;
// cast annotation an our expected BLAnnotation
Annotation *blAnnotation = (Annotation *)annotation;
// create title label and size to text
_titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, 5, 280, 20)];
_titleLabel.text = blAnnotation.title;
_titleLabel.textAlignment = UITextAlignmentLeft;
_titleLabel.font = [UIFont fontWithName:#"HelveticaNeue-Bold" size:13];
_titleLabel.textColor = [UIColor whiteColor];
_titleLabel.shadowColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:.7];
_titleLabel.shadowOffset = CGSizeMake(0, -1.0);
_titleLabel.backgroundColor = [UIColor clearColor];
_titleLabel.lineBreakMode = UILineBreakModeWordWrap;
_titleLabel.numberOfLines = 3;
CGSize titleLabelSize = [blAnnotation.title sizeWithFont: _titleLabel.font constrainedToSize: CGSizeMake(280, 600) lineBreakMode: _titleLabel.lineBreakMode];
_titleLabel.frame = CGRectMake(_titleLabel.frame.origin.x, _titleLabel.frame.origin.y, 280, titleLabelSize.height);
// create subtitle label and size to text
_subtitleLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, _titleLabel.frame.size.height + 8, 280, 20)];
_subtitleLabel.text = blAnnotation.subtitle;
_subtitleLabel.textAlignment = UITextAlignmentLeft;
_subtitleLabel.font = [UIFont fontWithName:#"HelveticaNeue" size:11];
_subtitleLabel.textColor = [UIColor whiteColor];
_subtitleLabel.shadowColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:.7];
_subtitleLabel.shadowOffset = CGSizeMake(0, -1.0);
_subtitleLabel.backgroundColor = [UIColor clearColor];
_subtitleLabel.lineBreakMode = UILineBreakModeWordWrap;
_subtitleLabel.numberOfLines = 4;
CGSize subtitleLabelSize = [blAnnotation.subtitle sizeWithFont: _subtitleLabel.font constrainedToSize: CGSizeMake(235, 600) lineBreakMode: _subtitleLabel.lineBreakMode];
_subtitleLabel.frame = CGRectMake(_subtitleLabel.frame.origin.x, _subtitleLabel.frame.origin.y, subtitleLabelSize.width, subtitleLabelSize.height);
// create custom button
_infoButton = [UIButton buttonWithType:UIButtonTypeCustom];
_infoButton.frame = CGRectMake(0, _titleLabel.frame.size.height + _subtitleLabel.frame.size.height + 80, 175, 50);
//_infoButton.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
//_infoButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;
//[_infoButton setImage:[UIImage imageNamed:#"more_info.png"] forState:UIControlStateNormal];
[_infoButton addTarget:self action:#selector(pressButton:) forControlEvents:UIControlEventTouchUpInside];
// create callout view to be shown once a annotation view is selected
_calloutView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 300, _titleLabel.frame.size.height + _subtitleLabel.frame.size.height + _infoButton.frame.size.height + 5)];
_calloutView.hidden = YES;
_calloutView.userInteractionEnabled = YES;
[self addSubview:_calloutView];
// create rounded rect background and size to text
UIImageView *backgroundRect = [[UIImageView alloc] initWithFrame: CGRectMake(0, 0, _calloutView.frame.size.width, _calloutView.frame.size.height)];
//[backgroundRect setAlpha:0.8];
//[backgroundRect setOpaque:NO];
[backgroundRect.image drawInRect:_calloutView.frame];
UIGraphicsBeginImageContext(backgroundRect.frame.size);
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGRect frame = _calloutView.bounds;
[[UIColor colorWithRed:.2 green:.2 blue:.2 alpha:1] set];
CGPathRef roundedRectPath = [self roundedRectPath:frame radius:5];
CGContextAddPath(ctx, roundedRectPath);
CGContextFillPath(ctx);
CGPathRelease(roundedRectPath);
backgroundRect.userInteractionEnabled = YES;
backgroundRect.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
[_calloutView addSubview:backgroundRect];
[_calloutView addSubview:_titleLabel];
[_calloutView addSubview:_subtitleLabel];
[_calloutView addSubview:_infoButton];
// position callout above pin
_calloutView.frame = CGRectMake(-140, -_calloutView.frame.size.height+10, _calloutView.frame.size.width, _calloutView.frame.size.height);
backgroundRect = nil;
return self;
}
My guess is that your button is pointing to itself as the target. If the button is not the first responder and it is tapped, its target function is not called in the above scenario. I fixed my similar issue by using lazy var to declare the UIButton in Swift 4 Xcode 9, pointing the target to the parent view / view controller.
// Sets target to parent view or view controller
// someFunction is called even if the button is not the first responder when tapped
lazy var nextCreateButton: UIButton = {
let button = UIButton(type: .system)
button.addTarget(self, action: #selector(someFunction), for: .touchUpInside)
return button
}()
// Sets target to the button itself
// someFunction is not called when the button is not the first responder
let nextCreateButton: UIButton = {
let button = UIButton(type: .system)
button.addTarget(self, action: #selector(someFunction), for: .touchUpInside)
return button
}()
Try using [self addSubview:_calloutView] after you add your button and your lables to *_calloutView* as subviews, not before.
Let me know how it turns out
Im currently using the code below to render the view for my sectioned tableView
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, tableView.bounds.size.width, 30)] autorelease];
headerView.backgroundColor = [UIColor colorWithRed:30/255 green:30/255 blue:30/255 alpha:1.0];
headerView.layer.masksToBounds = NO;
headerView.layer.shadowOffset = CGSizeMake(0, 0);
headerView.layer.shadowRadius = 3;
headerView.layer.shadowOpacity = 0.5;
headerView.layer.shouldRasterize = YES;
UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(0, headerView.frame.size.height, headerView.frame.size.width, 3)];
headerView.layer.shadowPath = path.CGPath;
UILabel *label = [[[UILabel alloc] initWithFrame:CGRectMake(12, 7, tableView.bounds.size.width - 10, 20)] autorelease];
label.font = [UIFont boldSystemFontOfSize:16];
label.text = header;
label.textColor = [UIColor whiteColor];
label.shadowColor = [UIColor blackColor];
label.shadowOffset = CGSizeMake(0.0f, 1.0f);
label.backgroundColor = [UIColor colorWithRed:30/255 green:30/255 blue:30/255 alpha:1.0];
[headerView addSubview:label];
return headerView;
}
For some reason though the text is being mangled a bit and a little distorted? I have narrowed it down to the effects i am putting on the layer although im not sure why its doing it?
I see you are setting shouldRasterize to YES. Does setting the rasterization scale help? This would only be needed if you are using an iPhone 4.
[[headerView layer] setRasterizationScale:[[UIScreen mainScreen] scale]];
I'm using UINavigationItem's titleView property to set a custom UILabel with my desired font size/color. Here's my code:
self.headerLabel = [[UILabel alloc] initWithFrame:CGRectMake(0.0, 0.0, 400.0, 44.0)];
self.headerLabel.textAlignment = UITextAlignmentCenter;
self.headerLabel.backgroundColor = [UIColor clearColor];
self.headerLabel.font = [UIFont boldSystemFontOfSize:20.0];
self.headerLabel.textColor = [UIColor colorWithRed:0.259 green:0.280 blue:0.312 alpha:1.0];
self.navigationItem.titleView = self.headerLabel;
In the navigation bar I also have a left bar button. The result is: the text isn't properly centered. I've tried setting the x origin of the label, but this has no effect.
In stead of initWithFrame just use init and put [self.headerLabel sizeToFit] after your last line of code.
If you make the headerLabel a subview of the titleView, you can then set headerLabel's frame to control where it goes within the titleView.
The way you are doing it now, you don't have that control. I think the OS chooses the titleView's frame for you based on the space available.
Hope this helps!
I've used custom title labels for my nav bars in every app I have in the app store. I've tested many different ways of doing so and by far the easiest way to use a custom label in a navigation bar is to completely ignore titleView and insert your label directly into navigationController.view.
With this approach, it's easy to have the title label's frame always match the navigationBar's frame -- even if you are using a custom navBar with a non-standard size.
- (void)viewDidLoad {
[self.navigationController.view addSubview:self.titleLabel];
[super viewDidLoad];
}
- (BOOL)shouldAutorotateToInterfaceOrientation:
(UIInterfaceOrientation)interfaceOrientation {
return YES;
}
- (void)didRotateFromInterfaceOrientation:
(UIInterfaceOrientation)fromInterfaceOrientation {
[self frameTitleLabel];
}
- (UILabel *) titleLabel {
if (!titleLabel) {
titleLabel = [[UILabel alloc]
initWithFrame:self.navigationController.navigationBar.frame];
titleLabel.font = [UIFont fontWithName:#"Helvetica-Bold" size:18];
titleLabel.text = NSLocalizedString(#"Custom Title", nil);
titleLabel.textAlignment = UITextAlignmentCenter;
titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
}
return titleLabel;
}
- (void) frameTitleLabel {
self.titleLabel.frame = self.navigationController.navigationBar.frame;
}
The one caveat to this approach is that your title can flow over the top of any buttons you have in the navBar if you aren't careful and set the title to be too long. But, IMO, that is a lot less problematical to deal with than 1) The title not centering correctly when you have a rightBarButton or 2) The title not appearing if you have a leftBarButton.
I have a same problem; I just somehow solved this issue by calculating the title length and set the label frame width accordingly. Although this is not a perfect one but can be manageable. Here is the code.
label = [[UILabel alloc] init];
label.backgroundColor = [UIColor clearColor];
label.font = [ UIFont fontWithName: #"XXII DIRTY-ARMY" size: 32.0 ];
label.shadowColor = [UIColor colorWithWhite:0.0 alpha:0.0f];
label.textAlignment = UITextAlignmentCenter;
label.textColor =[UIColor orangeColor];
//label.text=categoryTitle;
CGFloat verticalOffset = 2;
NSString *reqSysVer = #"5.0";
NSString *currSysVer = [[UIDevice currentDevice] systemVersion];
if ([currSysVer compare:reqSysVer options:NSNumericSearch] != NSOrderedAscending)
{
if (categoryTitle.length > 8)
{
label.frame = CGRectMake(0, 0, 300, 44);
}else {
label.frame = CGRectMake(0, 0, 80, 44);
}
self.navigationItem.titleView = label;
self.navigationItem.title=label.text;
[[UINavigationBar appearance] setTitleVerticalPositionAdjustment:verticalOffset forBarMetrics:UIBarMetricsDefault];
[[UIBarButtonItem appearance] setTintColor:[UIColor newBrownLight]];
}
Just calculate exact frame size needed and align to left:
UIFont* font = [UIFont fontWithName:#"Bitsumishi" size:20];
CGSize maximumLabelSize = CGSizeMake(296,9999);
CGSize expectedLabelSize = [title sizeWithFont:font constrainedToSize:maximumLabelSize lineBreakMode:UILineBreakModeCharacterWrap];
CGRect frame = CGRectMake(0, 0, expectedLabelSize.width, expectedLabelSize.height);
UILabel *label = [[[UILabel alloc] initWithFrame:frame] autorelease];
label.font = font;
label.textAlignment = UITextAlignmentLeft;
label.text = title;
self.titleView = label;
UIView *vw = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 40)];
UILabel *lbl = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 320, 40)];
lbl.text = #"Home";
lbl.textAlignment = UITextAlignmentCenter;
lbl.backgroundColor = [UIColor clearColor];
lbl.textColor = [UIColor whiteColor];
lbl.font = [UIFont fontWithName:#"HelveticaNeue-Bold" size:20];
lbl.shadowColor = [UIColor blackColor];
lbl.shadowOffset = CGSizeMake(0,1);
self.navigationItem.titleView = vw;
[self.navigationItem.titleView addSubview:lbl];
What worked for me was to update the titleView frame in the viewDidAppear method.
- (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
UIView *titleView = self.navigationItem.titleView;
CGRect navBarFrame = self.navigationController.navigationBar.frame;
[titleView setFrame:CGRectMake((CGRectGetWidth(navBarFrame) - TitleWidth) / 2, (CGRectGetHeight(navBarFrame) - TitleHeight) / 2, TitleWidth, TitleHeight)];
}
I know how to customize the tableViewCell.
I have seen many application customizing the tableView Cell.
Similarly, I want to customize TableView Section Header
"Suppose - A section name should be in different font, It has different background images etc."
Is it possible How?
In which method Should I implement the code?
Instead of using the normal method
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
You want to implement this one:
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
As you can see, the second one returns a UIView instead of just string for text. Therefore you can customise your own view (with labels etc) and return it.
Here is an example of how you might do that (to be implemented in the above method):
// create the parent view that will hold header Label
UIView* customView = [[[UIView alloc] initWithFrame:CGRectMake(10,0,300,60)] autorelease];
// create image object
UIImage *myImage = [UIImage imageNamed:#"someimage.png"];;
// create the label objects
UILabel *headerLabel = [[[UILabel alloc] initWithFrame:CGRectZero] autorelease];
headerLabel.backgroundColor = [UIColor clearColor];
headerLabel.font = [UIFont boldSystemFontOfSize:18];
headerLabel.frame = CGRectMake(70,18,200,20);
headerLabel.text = #"Some Text";
headerLabel.textColor = [UIColor redColor];
UILabel *detailLabel = [[[UILabel alloc] initWithFrame:CGRectZero] autorelease];
detailLabel.backgroundColor = [UIColor clearColor];
detailLabel.textColor = [UIColor darkGrayColor];
detailLabel.text = #"Some detail text";
detailLabel.font = [UIFont systemFontOfSize:12];
detailLabel.frame = CGRectMake(70,33,230,25);
// create the imageView with the image in it
UIImageView *imageView = [[[UIImageView alloc] initWithImage:myImage] autorelease];
imageView.frame = CGRectMake(10,10,50,50);
[customView addSubview:imageView];
[customView addSubview:headerLabel];
[customView addSubview:detailLabel];
return customView;