How to create a calendar like this - iphone

Question

I want to create a week based calendar, it should show the days in UITableView as a list. Below is image i have posted to clear the required output. Have gone through google a lot, but doesn't got any solution.. Have gone throgh many calendars KAl, Tapku and also Mukhu but not got any solution for it. Please guide.

Answer 1

Dude try this for week and day view
https://github.com/muhku/calendar-ui?
week or day view might get you started with or if you wan to start afresh fetch events from the ios EventStore and make a datasource that feeds data to your table. Mostly all calendar components do that, you can even take that from the above component.
Use these methods to make dates:
#define DATE_COMPONENTS (NSYearCalendarUnit| NSMonthCalendarUnit | NSDayCalendarUnit | NSWeekCalendarUnit | NSHourCalendarUnit | NSMinuteCalendarUnit | NSSecondCalendarUnit | NSWeekdayCalendarUnit | NSWeekdayOrdinalCalendarUnit)
#define CURRENT_CALENDAR [NSCalendar currentCalendar]
+ (NSDate *)nextDayFromDate:(NSDate *)date {
NSDateComponents *components = [CURRENT_CALENDAR components:DATE_COMPONENTS fromDate:date];
[components setDay:[components day] + 1];
[components setHour:0];
[components setMinute:0];
[components setSecond:0];
return [CURRENT_CALENDAR dateFromComponents:components];
}
+ (NSDate *)previousDayFromDate:(NSDate *)date {
NSDateComponents *components = [CURRENT_CALENDAR components:DATE_COMPONENTS fromDate:date];
[components setDay:[components day] - 1];
[components setHour:0];
[components setMinute:0];
[components setSecond:0];
return [CURRENT_CALENDAR dateFromComponents:components];
}
Organise dates into a week - group those dates to form a week. Take day of week by day number using this method:
+ (NSString *)dayNameForWeekDay:(int)weekday
{
switch (weekday) {
case 1:
return #"Sunday";
break;
case 2:
return #"Monday";
break;
case 3:
return #"Tuesday";
break;
case 4:
return #"Wednesday";
break;
case 5:
return #"Thursday";
break;
case 6:
return #"Friday";
break;
case 7:
return #"Saturday";
break;
default:
break;
}
return #"";
}
And using the datasource show the events. Customizing your table is not a big deal, expanding collapsing is so simple.

Answer 2

I roughed out something using a tableview. The basic behavior you are looking for is to add rows when a date is selected (and hide those previously selected). I did a tableView with a section for each day, and added events below it.
I added a TableView from a xib, but should have done it in code for this setup.
//
// TCViewController.m
// TableCalendarTest
//
// Created by Brian Broom on 6/18/13.
// Copyright (c) 2013 Brian Broom. All rights reserved.
//
#import "TCViewController.h"
#interface TCViewController ()
{
int selectedSection;
}
#end
#implementation TCViewController
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
return 3;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
if (section == selectedSection) {
return 3;
} else {
return 1;
}
}
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
if (indexPath.row == 0) {
[tableView beginUpdates];
[self.tableView deselectRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:selectedSection] animated:YES];
NSMutableArray *oldRows = [[NSMutableArray alloc] init];
[oldRows addObject:[NSIndexPath indexPathForRow:1 inSection:selectedSection]];
[oldRows addObject:[NSIndexPath indexPathForRow:2 inSection:selectedSection]];
selectedSection = indexPath.section;
[tableView deleteRowsAtIndexPaths:oldRows withRowAnimation:UITableViewRowAnimationTop];
NSMutableArray *newRows = [[NSMutableArray alloc] init];
[newRows addObject:[NSIndexPath indexPathForRow:1 inSection:selectedSection]];
[newRows addObject:[NSIndexPath indexPathForRow:2 inSection:selectedSection]];
[tableView insertRowsAtIndexPaths:newRows withRowAnimation:UITableViewRowAnimationBottom];
[tableView endUpdates];
}
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}
if (indexPath.row == 0) {
[cell.textLabel setText:[NSString stringWithFormat:#"Day"]];
} else {
[cell.textLabel setText:[NSString stringWithFormat:#"Event %d", indexPath.row]];
}
return cell;
}
#end
The tricky part is getting the date information, and the customization.