Creating a UISearchBar and UITableView inside a UIView - ios

Disclaimer: I'm something of an iOS n00b. I have a navigation-based app -- i.e., in my AppDelegate, I create the nav frame:
self.navigation_controller = [[UINavigationController alloc] initWithRootViewController:home_view_controller];
self.window = [[UIWindow alloc] initWithFrame:UIScreen.mainScreen.bounds];
self.window.rootViewController = navigation_controller;
self.window.makeKeyAndVisible;
Inside the frame of my home view, I want a search bar, then the scrollable table view. So, I wrote this:
- viewDidLoad{
(HomeView*)home_view = [[HomeView alloc] init];
self.view = home_view
self.view.backgroundColor = [UIColor whiteColor]
(UITableView*)self.table_view = [UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStylePlain];
self.table_view.bounds.origin.y += 44;
self.table_view.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
self.table_view.dataSource = self;
self.table_view.delegate = self;
[self.view addSubview:self.table_view];
search_frame = self.view.bounds;
search_frame.origin.y = 48.0;
search_frame.size.height = 48.0;
self.search_bar = [[UISearchBar alloc] initWithFrame:search_frame)];
[self.view addSubview:self.search_bar];
}
The table view displays fine, but occupies all the space below the navigation bar. I want to have the navigation bar, then immediately below it the search bar, followed by the table view. At the point of viewDidLoad, the UITableView does not yet have a non-zero bounding rect and I expect that's part of the problem. Additionally, I've specified UIViewAutoresizingFlexibleHeight in my autoresizingMask when I really want it glued against the search bar -- again, I believe this may be part of the problem.
What have I misunderstood here?
Thanks

Steve,
Try following changes:
1) Set tableview's frame using:
CGRect targetRect = CGRectMake(0, 48, self.view.frame.size.width, self.view.frame.size.heigth);
(UITableView*)self.table_view = [UITableView alloc] initWithFrame:targetRect style:UITableViewStylePlain];
2) Add following autosize mask also:
// This value will anchor your table view with top margin
UIViewAutoresizingFlexibleBottomMargin
3) Set searchbar's frame to following rect frame:
CGRecttMake(0, 0, self.view.frame.size.width, 48);

What I would do, is just add the UISearchBar as the first UITableView header.
(method: tableView:viewForHeaderInSection:)
Check this blog post:
http://jainmarket.blogspot.com/2009/08/add-searchbar-as-uitableviews-header.html

Related

UISearchBar Refuses to Change Width?

I am adding a UISearchBar to a UINavigation Bar as so (this is a storyboard based app) :
//Setup the search bar.
searchBar = [[UISearchBar alloc]initWithFrame:CGRectMake(0.0f, 0.0f, 50.0f, 44.0f)];
self.tabBarController.navigationItem.titleView = searchBar;
searchBar.delegate = self;
controller = [[UISearchDisplayController alloc]initWithSearchBar:self.searchBar contentsController:self];
controller.searchResultsDataSource = self;
controller.searchResultsDelegate = self;
No matter what I set the width and height and position of the search bar to be, it will not change the height / width of the search bar. It is always the same width and height.
Can anyone suggest how to alter ?
I've experienced the same problem one time, and what I did was adding the searchBar into a container View (i've had problems showing the cancel button) and add the container view as a left bar item
- (UIBarButtonItem *)createSearchBarHolder {
UIView *searchBarContainer = [[UIView alloc] initWithFrame:navigationSearchBar.frame];
searchBarContainer.autoresizingMask = UIViewAutoresizingFlexibleWidth;
[searchBarContainer addSubview:navigationSearchBar];
navigationSearchBar.autoresizingMask = UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth;
UIBarButtonItem *searchBarHolder = [[UIBarButtonItem alloc] initWithCustomView:searchBarContainer];
return searchBarHolder;
}
And in viewDidLoad:
NSArray *leftBarButtons = [[NSArray alloc] initWithObjects:[self createSearchBarHolder], nil];
self.navigationItem.leftBarButtonItems = leftBarButtons;
It's not clear what size you want your search bar to be. If you make it the navigation item's titleView, it will adjust for any buttons on the navigation bar, and adjust on rotation. Is that what you want?
- (void)viewDidLoad {
[super viewDidLoad];
UISearchBar *sb = [[UISearchBar alloc] init];
self.navigationItem.titleView = sb;
}

Add 2 UIViews to UIScrollView

Is it possible to use UIScrollViewController to scroll or "page" two or more views coming from UIViewControllers?
Example (in viewDidLoad)
self.a1 = [[CustomViewController1 alloc] init];
self.a2 = [[CustomViewController2 alloc] init];
//Scroller
self.scroller = [[UIScrollView alloc] initWithFrame:CGRectMake(0,0,1000,400
400)];
[self.scroller addSubview:self.a1.view];
[self.scroller addSubview:self.a2.view];
[self.view addSubview:self.scroller];
But I can see in the scroller only the view of controller a2.
You need to set the frames of the views so they they sit one below another. Currently they are both there, just on top of one another.
Try putting in
self.a2.view.frame = CGRectMake(0, 480, 320, 480);
You have to modify the frames aswell. Now a1 and a2 have the same, and they are on top of eachother, so the a2 is visible, because you added the later.
Try
self.a2.view.frame = CGRectOffset(self.a2.view.frame, self.a1.view.frame.size.width, 0);
The solution is to set the frame coordinates of the subviews inside the scroller:
CGRect frame = CGRectMake(0, 0, 1000, 600);
self.a1 = [[CustomViewController1 alloc] init];
self.a1.view.frame = frame;
self.a2 = [[CustomViewController2 alloc] init];
frame.origin.x = frame.size.width +10;
self.a2.view.frame = frame;
[self.scroller addSubview:self.a1.view];
[self.scroller addSubview:self.a2.view];
[self.view addSubview:self.scroller];
You'll need to add the custom view controllers as child view controllers. See Apple's documentation for more information on doing that correctly.

Adding the scrollview created by photoscroller to a subview

I'm trying to modify Apple's PhotoScroller example to make the scrollview that is created into a subview instead of it being a view that takes up the entire screen. Any ideas on how this can be accomplished?
- (void)loadView
{
// Step 1: make the outer paging scroll view
CGRect pagingScrollViewFrame = [self frameForPagingScrollView];
pagingScrollView = [[UIScrollView alloc] initWithFrame:pagingScrollViewFrame];
pagingScrollView.pagingEnabled = YES;
pagingScrollView.backgroundColor = [UIColor blackColor];
pagingScrollView.showsVerticalScrollIndicator = NO;
pagingScrollView.showsHorizontalScrollIndicator = NO;
pagingScrollView.contentSize = [self contentSizeForPagingScrollView];
pagingScrollView.delegate = self;
// When I do this it fails
[self.view addSubview:pagingScrollView];
// Step 2: prepare to tile content
recycledPages = [[NSMutableSet alloc] init];
visiblePages = [[NSMutableSet alloc] init];
[self tilePages];
}
You just need to modify the frame of the scrollview to be positioned and sized how you want:
This is the line in the view controller that sets it up in the example
pagingScrollView = [[UIScrollView alloc] initWithFrame:pagingScrollViewFrame];
As an example here is a sample frame with some hardcoded values:
CGRect scrollFrame = CGRectMake(100,100,100,100);
pagingScrollView = [[UIScrollView alloc] initWithFrame:scrollFrame];
So, I found out that I was able to add the scrollView as a subview by changing the method from loadView to viewDidLoad.
I have no clue why that works, but it does. I'd love to know why that's the case however...

Multiple UIScrollViewControllers on the same window, some not showing their views

I am trying to display 3 UIScrollViewControllers in the same window as 3 horizontal stripes 3 times the screen wide scrolling indipendently. The code to achieve this is below but for some reason it doesn't work, showing only the upper stripe.
With the help of the additional white background view I placed on the window I can see the other 2 regions of the screen are scrollable as well, but for some reason their background color is not showing up...I can't figure out why.
Here is the code:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
// Creating the window programmatically
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
CGRect bounds = [self window].bounds;
float x = bounds.origin.x;
float y = bounds.origin.y;
float w = bounds.size.width;
float h = bounds.size.height;
CGRect upperFrame = CGRectMake(x,y,w,h/3);
CGRect middleFrame = CGRectMake(x,y + h/3,w,h/3);
CGRect lowerFrame = CGRectMake(x, y + 2 * h/3, w, h/3);
// Creating the scroll view which will contain the 3 views
UIScrollView *upperScrollView = [[UIScrollView alloc] initWithFrame:upperFrame];
UIScrollView *middleScrollView = [[UIScrollView alloc] initWithFrame:middleFrame];
UIScrollView *lowerScrollView = [[UIScrollView alloc] initWithFrame:lowerFrame];
// ContentSize should be wide enough for 3 pages
[upperScrollView setContentSize:CGSizeMake(3 * w, h/3)];
[middleScrollView setContentSize:CGSizeMake(3 * w, h/3)];
[lowerScrollView setContentSize:CGSizeMake(3 * w, h/3)];
// Enforce the display of only one page at a time
[upperScrollView setPagingEnabled:YES];
[middleScrollView setPagingEnabled:YES];
[lowerScrollView setPagingEnabled:YES];
// UPPER SCROLLVIEW
// This will be the first view (red)
UIView *redViewU = [[UIView alloc] initWithFrame:upperFrame];
[redViewU setBackgroundColor:[UIColor redColor]];
// The second view will start horizontally when the first view ends
upperFrame.origin.x += w;
// This will be the second view (green)
UIView *greenViewU = [[UIView alloc] initWithFrame:upperFrame];
[greenViewU setBackgroundColor:[UIColor greenColor]];
// The third view will start horizontally when the second view ends
upperFrame.origin.x += w;
// This will be the third view (blue)
UIView *blueViewU = [[UIView alloc] initWithFrame:upperFrame];
[blueViewU setBackgroundColor:[UIColor blueColor]];
// Adding the 3 views to the scroll view
[upperScrollView addSubview:redViewU];
[upperScrollView addSubview:greenViewU];
[upperScrollView addSubview:blueViewU];
// Now creating the view controller, father of the scrollview
UIViewController *upperViewController = [[UIViewController alloc] init];
[upperViewController setView:upperScrollView];
// MIDDLE SCROLLVIEW
// This will be the first view (red)
UIView *redViewM = [[UIView alloc] initWithFrame:middleFrame];
[redViewM setBackgroundColor:[UIColor redColor]];
// The second view will start horizontally when the first view ends
middleFrame.origin.x += w;
// This will be the second view (green)
UIView *greenViewM = [[UIView alloc] initWithFrame:middleFrame];
[greenViewM setBackgroundColor:[UIColor greenColor]];
// The third view will start horizontally when the second view ends
middleFrame.origin.x += w;
// This will be the third view (blue)
UIView *blueViewM = [[UIView alloc] initWithFrame:middleFrame];
[blueViewM setBackgroundColor:[UIColor blueColor]];
// Adding the 3 views to the scroll view
[middleScrollView addSubview:redViewM];
[middleScrollView addSubview:greenViewM];
[middleScrollView addSubview:blueViewM];
// Now creating the view controller, father of the scrollview
UIViewController *middleViewController = [[UIViewController alloc] init];
[middleViewController setView:middleScrollView];
// LOWER SCROLLVIEW
// This will be the first view (red)
UIView *redViewL = [[UIView alloc] initWithFrame:lowerFrame];
[redViewL setBackgroundColor:[UIColor redColor]];
// The second view will start horizontally when the first view ends
lowerFrame.origin.x += w;
// This will be the second view (green)
UIView *greenViewL = [[UIView alloc] initWithFrame:lowerFrame];
[greenViewL setBackgroundColor:[UIColor greenColor]];
// The third view will start horizontally when the second view ends
lowerFrame.origin.x += w;
// This will be the third view (blue)
UIView *blueViewL = [[UIView alloc] initWithFrame:lowerFrame];
[blueViewL setBackgroundColor:[UIColor blueColor]];
// Adding the 3 views to the scroll view
[lowerScrollView addSubview:redViewL];
[lowerScrollView addSubview:greenViewL];
[lowerScrollView addSubview:blueViewL];
// Now creating the view controller, father of the scrollview
UIViewController *lowerViewController = [[UIViewController alloc] init];
[lowerViewController setView:lowerScrollView];
// A white background view to see at least the scroll indicators
UIView *whiteView = [[UIView alloc] initWithFrame:bounds];
[whiteView setBackgroundColor:[UIColor whiteColor]];
// Finally the window will hold the view controllers' views
[[self window] addSubview:whiteView];
[[self window] addSubview:upperViewController.view];
[[self window] addSubview:middleViewController.view];
[[self window] addSubview:lowerViewController.view];
// Displaying the window
[self.window makeKeyAndVisible];
return YES;
}
Solved: after succeeding doing the same thing with IB I realized that for some reason the views inside the UIScrollView want RELATIVE x,y coordinates for their frames, not ABSOLUTE.
Changing the frames of the views in the above code with the following (the same for every UIScrollView):
CGRect redViewFrame = CGRectMake(x,y,w,h/3);
CGRect greenViewFrame = CGRectMake(w,y,w,h/3);
CGRect blueViewFrame = CGRectMake(2 * w,y,w,h/3);
solved the issue, and now I can see the 3 scrolling backgrounds.
Hope it helps someone else :) I am done, for now.

UITableView Not Scrolling With UISearchBar

What I want to achieve is a UISearchBar that moves up and covers the UINavBar, and contains a cancel button on the right of it. All goes well, until I use the following line of code:
searchDC = [[[UISearchDisplayController alloc] initWithSearchBar:searchBar contentsController:self] autorelease];
What ends up happening is the UITableView just won't scroll, but everything else functions as expected. If I remove that line, my nav bar is visible, and the search bar just sits below it, also lacking a cancel button.
Any ideas?
The code for drawing the search bar is:
self.navigationItem.title = #"Search";
searchBar = [[[UISearchBar alloc] initWithFrame:CGRectMake(0.0f, 0.0f, self.view.bounds.size.width, 44.0f)] autorelease];
searchBar.autocorrectionType = UITextAutocorrectionTypeNo;
searchBar.autocapitalizationType = UITextAutocapitalizationTypeNone;
searchBar.keyboardType = UIKeyboardTypeAlphabet;
searchBar.delegate = self;
[searchBar becomeFirstResponder];
tableView.tableHeaderView = searchBar;
tableView.tableHeaderView.frame = CGRectMake(0.f, 0.f, 480.f, 44.f);
searchDC = [[[UISearchDisplayController alloc] initWithSearchBar:searchBar contentsController:self] autorelease];
searchDC.searchResultsDataSource = self;
searchDC.searchResultsDelegate = self;
searchDC.searchResultsTableView.separatorStyle = UITableViewCellSeparatorStyleNone;
searchDC.searchResultsTableView.scrollEnabled = YES;
overlayView.frame = CGRectMake(0, 50, 320, 480);
[self.view addSubview:overlayView];
[self.view bringSubviewToFront:overlayView];
Not enough information to answer this. You need to show the UIViewController or UINavigation Controller code (both the .h and .m) where you are setting up the UISearchDisplayController.
EDIT:
You're implementing this totally wrongly. Apple has a great example on how to implement this http://developer.apple.com/iphone/library/samplecode/TableSearch/Introduction/Intro.html
From Apple's Documentation,
Delegate for the search display controller (delegate), which responds to events such the starting or ending of a search, and the showing or hiding of the search interface.
Set the delegate to your UITableViewController
searchDC.delegate = self;
Also add the searchDC's searchBar to the tableView's headerView
[self.tableView setTableHeaderView:searchDC.searchBar];

Resources