I've seen lots of sources saying it is possible to include a UIScrollView with UIPageControl inside a UITableViewCell to be able to scroll horizontally (through a list of selectable images), but can't find any raw examples that does what I want. I've gotten my scroll view "working", but I am unsure how to go forward - hopefully someone can send me some guidance.
Within my cellForRowAtIndexPath, I create a cell, and add both a scrollView and pageControl as subviews.
UITableViewCell *cell = [self.challengeListView dequeueReusableCellWithIdentifier:SubmitChallengeCellIdentifier];
if(cell == nil){
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SubmitChallengeCellIdentifier] autorelease];
cell.frame = CGRectMake(0, 0, 1000, 50);
}
scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, tv.frame.size.width, 50)];
[scrollView setContentSize:CGSizeMake(1000, 50)];
[[cell contentView] addSubview:scrollView];
pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, 50, tv.frame.size.width, 50)];
[pageControl setNumberOfPages:4];
[[cell contentView] addSubview:pageControl];
I've attached a screenshot of what's being displayed
the bottom portion of the main view is my UITableView that contains the scrollView/pageControl (and it will scroll horizontally, as I can see the scrollerIndicator showing this), and I've got its method's set to the following:
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
return 1;
}
-(NSInteger) tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return 1;
}
My Scroll view will indicate a "horizontalScroller" and I am able to scroll back and forth, but obviously there's no content there. How do I go about populating the tableView/scrollView with say, a list of "clickable" images? Any direction would be greatly appreciated - preferably not a "hey this guy's done it somewhat similar, check out this link" but maybe more an explanation of how this functionality should be implemented correctly (ESPECIALLY in regards to iOS 3.0+ - it is my understanding Apple has made our lives easier in implementing this)
I've solved my own problem; maybe the reason no once answered me is because its a minor implementation once you understand each view's purpose.
From within cellForRowAtIndexPath:
I created a standard UITableViewCell, however I altered the frame of the cell to my own custom frame of 1000 width by 50 height (catered to my needs for project).
I then created a UIScrollView, set it to the following (keep in mind I have my tableView defined in IB, so I'm mapping some of my height/widths to those values):
scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, tv.frame.size.width, 78)];
I then create the desired image view (I realize I will next create a loop that does many images and lays them out across the scroll view):
UIImage *image = [UIImage imageNamed:#"dummy.png"];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
imageView.frame = CGRectMake(0, 0, 80, 78);
[scrollView addSubview: imageView];
Here's the part I was missing. After adding the scrollView to the cell contents, you need to use the UIPageControl (which didn't seem obvious to me for this implementation at first) to setup the actual "visual horizonal scrolling" affect:
[[cell contentView] addSubview:scrollView];
pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, 50, tv.frame.size.width, 50)];
[pageControl setNumberOfPages:4];
[[cell contentView] addSubview:pageControl];
Hope that helps someone's search - I spent quite some time on Google looking for the example I just explained and didn't have much luck other than the general overview of how it would work.
Related
When I create table view with
myTableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, 320, 400) style:UITableViewStyleGrouped];
table view has rounded corners, but I wanna have right angle (so table view cell should look like rectangles, but table view still should have many sections).
The question is: how can I create table view with many sections and right angles?
In the TableView datasource. In the cellForRowAtIndexPath you can set the background of the cell to be blank...
cell.backgroundView = [[UIView alloc] initWithFrame:CGRectZero()];
Then you can put an image or rect or whatever in the back of the cell.
You could even create a new UIView and put that in place of the backgroundView.
Then you can put whatever you want in it, images, labels, etc... and they will go behind the content of the cell.
The rounded corners of the cell in grouped style is just an image so can be replaced by you.
set image as a background image to cell and give the backgroundcolor of UITableView to clearColor and set image like bellow..
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
///write your code..
UIImageView *img = [[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 320, 45)] autorelease]; // set frame as your cell frame
img.image = [UIImage imageNamed:#"yourImageName"];
cell.backgroundView = img;
////write your code
}
For Sections you can code a delegate method like
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
// Return the number of sections.
return 1;//how many sections you want you can write a value after return type
}
Best way I found to make the corners right angled is to set the background view to nil and then put a view in it.
[cell setBackgroundView:nil];
cell.backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
I'm having a lot of trouble dynamically adding subviews to a UIScrollView. The scroll view works fine with content created in a NIB but since the subviews to be displayed depend on data in my application (a mixture of images, labels, radio buttons, etc.) I need to be able to create and display them dynamically.
According to everything I've read it seems pretty straightforward on various sites and in the Apple documentation. In the view controller's viewDidLoad, I've added the following code,
UILabel *testLabel = [[UILabel alloc] init];
[testLabel setFrame:CGRectMake(50, 50, 100, 40)];
[testLabel setText:#"My Test label"];
[scrollView addSubview:testLabel];
[testLabel release];
The label will not appear in the scroll view at all but if I add the testLabel to self.view, then it appears (but not in the scrolling content obviously). I even tried adding the code to viewDidAppear in case I misunderstood the order of events with no luck.
When I checked the debugger, I noticed that the address of the scroll view is 0x0 which I assume means its null for some reason which would explain why its not working. I was under the assumption that if I connected this scrollView pointer to the actual scroll view in IB, it would be automatically assigned the correct address. Is this incorrect? If this is the case, how do I go about getting the address of the view?
-- UPDATE --
Thanks for all the feedback. I checked everything as everybody suggested and it was certainly all correct. I didn't need to set the size of the content as I had some other dummy labels (for testing that the scrolling was working) in the NIB. But I'll remember that for later on :-)
Interestingly, though, after checking the code again and not making any changes, I ran it again and it just worked!! Not sure why but I'll post the reason if I ever figure it out...
When you use scrollView you need to set the content size by doing:
scrollView.contentSize = CGSizeMake(#width,#height);
In this case the size should be bigger the 50,50 if you wanna see the label
Hope it helped
As described in your question You are working with a scrollview which you have added in the XIB.
When you declare an outlet as IBOultlet UIScrollView* scrlvDynamicContent;
and connect the same to your scrollview in interface builder,ideally you will get the allocated scrollview after viewdidLoad method is called.
so doing something as
-(void)viewDidLoad{
[super viewDidLoad];
[self createDynamicView];
}
where you can generate the dynamic view as follows
-(void)createDynamicView{
CGFloat yOffset = 0;
for (int i=0;i<5;i++) {
yOffset += 5;
UILabel* lblHeaderTitle = [[UILabel alloc] initWithFrame:CGRectMake(8, yOffset, 310, 21)];
[lblHeaderTitle setTextAlignment:UITextAlignmentLeft];
[lblHeaderTitle setFont:[UIFont fontWithName:#"Helvetica-Bold" size:16.0f]];
[lblHeaderTitle setText:[currentDict valueForKey:#"TITLE"]];
[lblHeaderTitle setTextColor:[UIColor blackColor]];
[scrlvDynamicContent addSubview:lblHeaderTitle];
[lblHeaderTitle release];
//INCREMNET in yOffset
yOffset += 25;
[scrlvDynamicContent setContentSize:CGSizeMake(320, yOffset)];
}
Just make sure that scrlvDynamicContent is connected properly to its outlet set to its file owner
[scrollView setFrame:CGRectMake(0,0,320,460)];
[scrollView setContentSize:CGSizeMake(100, 40)];
[self.view addSubview:scrollView];
UILabel *testLabel = [[UILabel alloc] init];
[testLabel setFrame:CGRectMake(50, 50, 100, 40)];
[testLabel setText:#"My Test label"];
[scrollView addSubview:testLabel];
[testLabel release];
I'm trying to add a UISegmentedControl in my tableview. I have two sections in my tableview and I want the segmented control to be placed in the 2nd section. In my implementation, I override viewForHeaderInSection as follows.
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
if (section == 1)
{
UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(10, 0,tableView.bounds.size.width, 10)] autorelease];
NSArray *segmentTextContent = [NSArray arrayWithObjects:NSLocalizedString(#"Singles", #""), NSLocalizedString(#"Everyone", #""),nil];
UISegmentedControl *segmentedControl = [[[UISegmentedControl alloc] initWithItems:segmentTextContent] autorelease];
segmentedControl.selectedSegmentIndex = 1;
segmentedControl.autoresizingMask = UIViewAutoresizingFlexibleWidth;
segmentedControl.segmentedControlStyle = UISegmentedControlStyleBar;
segmentedControl.frame = CGRectMake(0, 0, tableView.bounds.size.width+10, 20);
[segmentedControl addTarget:self action:#selector(loadTable:) forControlEvents:UIControlEventValueChanged];
[headerView addSubview:segmentedControl];
return headerView;
}
else
{
UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(10, 0,tableView.bounds.size.width, 10)] autorelease];
return headerView;
}
}
My problem is that once I select a particular segment, it doesn't appear to be selected. i.e. it's not getting dark colored as expected. I have placed the segmented control in my navigation bar earlier and it colors the segment after selection as expected.
Any help would be highly appreciated.
Thanks
This is a late reaction, but I ran into the same issue and figured out the problem. In the code above, the headerView is recreated everytime the tableView calls reloadData (which in my occurs after I resort the data based on a click on the segmentedControl), and therefore the segmented control goes back to its original state, and touches are not apparently reflected.
To solve this, I made segmentedControl an ivar, and check if it already exists. If so, then just call
[headerView addSubview: segmentedControl];
otherwise do the whole setup of the control.
Hope this helps.
Had you ever found the answer to this? I implemented virtually the same thing and it worked fine. My guess is that you have sized you control bigger than the bounds of the view.
CGRectMake(0, 0, tableView.bounds.size.width+10, 20)
I believe this will cause a control not to receive touch events in all cases.
I want to do something pretty simple with my UITableView: I want to add a UIActivityIndicatorView to a section's header view, and make it animate or disappear whenever I want.
I had no trouble adding the UIActivityIndicatorView to the header view using tableView:viewForHeaderInSection:
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIView* customView = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 60.0)];
// create the title
UILabel * headerLabel = [[UILabel alloc] initWithFrame:CGRectMake(15.0, 12.0, 310.0, 22.0)];
headerLabel.text = #"some random title here";
[customView addSubview:headerLabel];
[headerLabel release];
// Add a UIActivityIndicatorView in section 1
if(section == 1)
{
[activityIndicator startAnimating];
[customView addSubview:activityIndicator];
}
return [customView autorelease];
}
activityIndicator is a property of my controller's class.
I alloc it in the viewDidLoad method:
- (void)viewDidLoad
{
(...)
activityIndicator = [[UIActivityIndicatorView alloc] initWithFrame:CGRectMake(200, 10, 25, 25)];
}
This way I can send messages to it (like -startAnimating or -stopAnimating) whenever I want.
The problem is that the activityIndicator disappears as soon as I scroll the tableView (I guess it is because the tableView:viewForHeaderInSection: method is called a second time).
How else can I add an activityIndicatorView to the section's header view and still be able to send messages to it afterwards? (with the activityIndicator not disapearing when I scroll down of course)
Thank you very much!
If you try to use the same activity indicator in multiple places then it is probably getting moved from one place to the other. I believe you need a different one for every single section header. You might want to use a MutableArray to keep track of the header views you create so you can reuse them if you find one in the array that doesn't have a superview, sort of like dequeuing and reusing cells.
This is just a guess as I haven't done this, but I'm pretty sure the issue is trying to reuse the same view in multiple places.
The problem seemed to be caused by re-creating a customView and adding the activityIndicator as a subview every time tableView:viewForHeaderInSection: is called.
Not using subviews helped me fix it:
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
// Add a UIActivityIndicatorView in section 1
if(section == 1)
{
[activityIndicator startAnimating];
return activityIndicator;
}
UIView* customView = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 60.0)];
// create the title
UILabel * headerLabel = [[UILabel alloc] initWithFrame:CGRectMake(15.0, 12.0, 310.0, 22.0)];
headerLabel.text = #"some random title here";
[customView addSubview:headerLabel];
[headerLabel release];
return [customView autorelease];
}
(it looks quite ugly though, the activityIndicator takes the whole width of the section. I'd better create a unique customView for section 1 and add the activityIndicator as a subView once and for all).
all iphone developers
I am currently developing an iphone application in which I am showing a uitableview in grouped style in one of the segments of the segmented control.
My problem is that I don't know how to show a small image dynamically in the table header view.
Another issue is that i don't know how to show labels and button or any other control in one cell of a particular section and also make them multi line.
If any one have code or example please help me doing this.
This one will replace your header with a view, you can add anything there:
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
}
it can be done by this code:
GRect newFrame = CGRectMake(0.0, 0.0, self.myDetailView.bounds.size.width, 50.0);
UIView *trialHeaderView = [[UIView alloc] initWithFrame:newFrame];
trialHeaderView.backgroundColor = [UIColor clearColor];
UIImageView *myImageView = [[UIImageView alloc]initWithFrame:CGRectMake(15, 10, 35, 35)];
myImageView.image = [UIImage imageNamed:#"r1.jpg"];
myImageView.contentMode = UIViewContentModeScaleToFill;
[trialHeaderView addSubview:myImageView];
myDetailView.tableHeaderView = trialHeaderView;
ok..