0

I am an beginner in iPhone Development , and unable to create a expandable view. Like on click tableview row , they expanding into more row. I want to create two header with some title , when user click on first then their detail view is open , on agin click detail view is hide with animation . same in second header.

There should some difference between these two header. Please help me . I found a link regarding my requirement shown in a image on this link, But unable to implement it.

rmaddy
  • 314,917
  • 42
  • 532
  • 579
KDRocks
  • 161
  • 3
  • 18
  • Why can't you use a table view if you know how to do that? – Wain Apr 11 '14 at 07:25
  • Thanks for reply , Actually Only two header in my case, On their click a detail view is open on their bottom, and hide on again click on that header, Can I create same like shown in image on this http://stackoverflow.com/questions/1944428/how-to-implement-an-accordion-view-for-an-iphone-sdk-app . If yes Please guide me , I am also want to confirm can I use https://github.com/appsome/AccordionView Library in my project and modified it according to my requirement . Please help me. – KDRocks Apr 11 '14 at 07:41

1 Answers1

0

You could have a UIView which height is 0 and then expand it when clicking on your button : 

UIView *expandableView = [[UIView alloc] initWithFrame:CGRectMake(0,0,320,0)];
expandableView.backgroundColor = [UIColor redColor];
expandableView.alpha = 0;

And then when you click on your button you do an animation

[self.view addSubview:expandableView];
CGRect newFrame = expandableView.frame;
newFrame.size.height = 100;

//If this is the first view you would have to move the second header below 
CGRect newHeaderFrame = header2.frame;
newHeaderFrame.origin.y += expandableView.frame.size.height; 

[UIView animateWithDuration:0.3 animations:^{
    expandableView.frame = newFrame;
    expandableView.alpha = 1;
    header2.frame = newHeaderFrame;
}];

And when you want to shrink it :

CGRect newFrame = expandableView.frame;
newFrame.size.height = 0;

//If this is the first view you would have to move back to header 2
CGRect newHeaderFrame = header2.frame;
newHeaderFrame.origin.y -= newFrame.size.height; 

[UIView animateWithDuration:0.3 animations:^{
    expandableView.frame = newFrame;
    expandableView.alpha = 0;
    header2.frame = newHeaderFrame;
} completion:^{
    [expandableView removeFromSuperview];
}];
streem
  • 9,044
  • 5
  • 30
  • 41
  • Thank you very much , But there is two header , So how to manage container height ,means there are two header everybody is expand on click then , first user click on first then first expand and second will automatically show on bottom of first expanded view . Please tell me , how to manage this – KDRocks Apr 11 '14 at 07:55
  • If there is only the second header to move, you could change its frame as well in the animations. I've just edited my answer. But if there are other views to move i would highly suggest to use UITableView. – streem Apr 11 '14 at 08:05
  • Means , I have to use tableview and hide their border and add as a subview. Please tell me is it work ,Because I have to add these expanding view at bottom of view , other part of view is already filled wit some label and imageView . – KDRocks Apr 11 '14 at 08:27
  • I don't understand exactly what you want. What i'm saying is my solution is great if you only have a few headers (not dynamic), not many views to move and don't want to use a uitableview. Otherwise it becomes messy. If you eventually want to use a uitableview take a look at the links given by Harsh. – streem Apr 11 '14 at 08:40