Creating a view over a cell in a UICollectionView - ios

I'm having a problem placing a newly created view over a UICollectionView cell (and grow it to fill the screen). It works great when the collection view is scrolled to the top, however as soon as I scroll, I'm unable to properly place the new view, since the float values I'm gathering are below the window height.
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
UIView *picturesView = [[UIView alloc] init];
picturesView.frame = CGRectMake(CGRectGetMidX([[collectionView cellForItemAtIndexPath:indexPath] bounds]), CGRectGetMidY([[collectionView cellForItemAtIndexPath:indexPath] bounds]), 100, 100);
[self.view addSubview:picturesView];
[UIView animateWithDuration:0.3 animations:^{
picturesView.frame = CGRectMake(0, 0, windowWidth, windowHeight);
picturesView.alpha = 1.0;
}];
}
The issue here is that the values in the x and y paramaters of CGRectMake are larger than the available window area after scrolling, and the view appears below the scroll clipping (the newly create view appears to slide up from the bottom of the screen, which is not the desired animation).
Logic would leave me to calculate where these should be placed by positionY = ((totalScrollHeight - topScrollAreaClipped) + screenPositionOfCell). The only variable I can't seem to get is the height of the UICollectionView being clipped by the scroll.
Unless there's a better way to do this.

You need to compensate for the scroll location of the UICollectionView. Check the scrollOffsett property, and subtract that value from your x/y location to give the correct frame for your UIView.

Related

IOS/Objective-C: Unhindered scrolling of tableview created in code (remove rubber band effect)

I have created a tableview in code as follows:
_myTableView = [[UITableView alloc] initWithFrame:
CGRectMake(160, 80, 140, 100) style:UITableViewStylePlain];
_myTableView.delegate = self;
_myTableView.dataSource = self;
_myTableView.scrollEnabled = YES;
[self.view addSubview:_myTableView];
It largely works as it should with the following exception. Because the results in the table vary, I manually adjust the height of the tableview so that it only takes up as much space as the returned rows need as follows:
-(void) changeTVHeight: (float) height {
//height calculated from number of items in array returned.
CGRect newFrame = CGRectMake(120, 80, 180, height);
self.myTableView.frame = newFrame;
}
This works great for shrinking the tableview if there aren't that many results.
However, if there are a lot of results, the tableview expands below the visible part of the screen or the keyboard. In this case, I would like to be able to scroll the Tableview to see the lower rows.
scrollEnabled is set to YES.
But while it does allow one to scroll a bit, the scroll is resisted so with effort you can scroll a little bit but due to rubber band effect you cannot get further than a few rows below the screen and you cannot tap on the lower rows.
I am using autolayout in storyboard for much of the screen. The overall screen scrolls fine but this merely moves the tableview anchored to the screen up and down. There are no constraints on this tableview but it is added as a subview of the view.
My question is how can I make the tableview scrollable so that it scrolls without resistance?
Thanks in advance for any suggestions.
Edit:
I tried adding the tableView to self.scrollView instead of self.view. This anchored the tableView to the scrollview so it is possible to scroll the whole screen down and see the bottom of the tableview. However, this is not ideal because the rest of the screen is empty way down and you can't see the context for the tableview. (It's an autocomplete for a textfield at top of screen.)
In contrast when the tableview is added to self.view, it is in correct place, it semi-scrolls or bounces. It just doesn't scroll down to where I need it to scroll.
You need to set a limit so that the table view cannot be larger than the view itself. Tableviews are built on UIScrollView and will handle scrolling on their own, you don't need to try to size it manually. The reason the table view bounces but doesn't scroll is because it is extending below the bottom of the screen. It wont scroll because it has already scrolled to the bottom, you just can't see it because it's outside of the superview.
-(void) changeTVHeight: (float) height {
CGFloat limitedHeight = MIN(height, self.view.frame.size.height)
CGRect newFrame = CGRectMake(120, 80, 180, limitedHeight);
self.myTableView.frame = newFrame;
}

Why is my UIView's frame changing unexpectedly after the embedded UITableView is interacted with?

Consider the following UIView "MainView":
The view includes a Container View which in turn houses a UITableView controller. The container view's y coordinate starts just beneath the gradient bar. The UITableView includes the section footer at very bottom with the 'STU' label and 'chart' button.
When the UIView loads, and up-to-and-until any interaction with the tableView, MainView's dimensions are:
Frame: 0.000000x, 0.000000y, 568.000000w, 268.000000h
I have a delegate protocol set up such that tapping the chart button in the tableView will create a new view in MainView for a shadow effect via a method performing:
CGRect newFrame = self.view.frame; // self = MainView
newFrame.size.width = 100;
newFrame.size.height = 50;
UIView *backgroundShadowView = [[UIView alloc] initWithFrame:newFrame];
backgroundShadowView.backgroundColor = [UIColor blackColor];
// Do Animation
The important part above is the 'newFrame' CGRect. For some reason after interacting with the table view by tapping the chart button, or even scrolling or tapping a row, self.view.frame suddenly has the following dimensions:
Frame: 0.000000x, 52.000000y, 568.000000w, 268.000000h
And so the shadow view appears as follows, with a y origin much farther down than where it would be expected to start, just above the gradient bar.
I've adjusted the width and height of the "shadowview" for this question; normally it would be 568x268, but would extend 52 units off screen on the bottom because of this issue.
52 units is exactly the height of the statusbar (20) + navigationbar_in_landscape (32).
Of course I could manually adjust the frame dimensions, but I do not want to. I want to know why the view's frame is changing unexpectedly.
For the life of me, I cannot figure out why the view becomes suddenly offset. Any help is appreciated!!
Two comments.
(1)
This code was probably always wrong:
CGRect newFrame = self.view.frame; // self = MainView
newFrame.size.width = 100;
newFrame.size.height = 50;
UIView *backgroundShadowView = [[UIView alloc] initWithFrame:newFrame];
You surely want to define backgroundShadowView's frame in terms of self.view's bounds, not its frame as you are doing in the first line here.
(2)
The change in self.view.frame is probably illusory. You are probably checking this initially in viewDidLoad. But that is too soon; the view has not yet been added to the interface, and so it has not yet been resized to fit the surroundings.

UITableView not scrolling enough after expanding subview

I have a UITableViewController with a UIView at the bottom. (using storyboard). My UIView is set to hidden and changes state afterwards on click of button. First, I was trying to resize (increase height basically) my UIView on IBAction(buttonClick) using self.concluidoView.frame = CGRectMake(0, 0, 320, 50); but UIView was disappearing instead.
Now, it is correctly expanding UIView with the following code inside IBAction:
[UIView animateWithDuration:1.0
animations:^{
CGRect frame = self.concluidoView.frame;
frame.size.height += 100.0;
self.concluidoView.frame = frame;
}
completion:^(BOOL finished){
// complete
}];
The problem is that my UITableViewController is not scrolling enough to the new size, since the UIView is the last item in my tableView.
I've tried a few things to solve this problem, including manually trying to resize tableview to increase it's height to the same value of the UIViewincrease. I used the following code:
CGRect tableFrame = self.tableview.frame;
tableFrame.size.height += 100;
self.tableView.frame = tableFrame;
[self.tableview layoutIfNeeded];
The scrolling capacity of my tableviewwas actually smaller after this code. I would like to resize tableviewand allow scrolling, either manually, since I know how much my subviewwill increase, or automatically.
If you change the UITableView's frame, all you'll do is make it extend off screen most likely. What you want to do is get the table view to recognize that the UIView is larger. I'm assuming this UIView is the tableFooterView of your UITableView. Try doing the following:
UIView *footerView = self.tableView.tableFooterView;
self.tableView.tableFooterView = nil;
self.tableView.tableFooterView = footerView;
That will force the UITableView to reexamine the size of the footer view. I've had to do this before when changing the size of a footer view before.

Adjust a UIScrollView height based on a UITableView

I have a UIScrollView which contains a UIView and a UITableView. My goal is to adjust the height of the UIScrollView to allow me to scroll the contents of the UIScrollView to a specific point.
Here is my view: It has a UIView up top and a UITableView down below.
When I scroll, I want the UIView to stop at a specific point like so:
The tableView would be able to continue scrolling, but the UIView would be locked in place until the user scrolled up and brought the UIView back to its original state.
A prime example of what I am trying to do is the AppStore.app on iOS 6. When you view the details of the app, the filter bar for Details, Reviews and Related moves to the top of the screen and stops. I hope this all made sense.
Thanks
I ended up going with a simpler approach. can't believe I didn't see this before. I created two views, one for the UITableView's tableHeaderView and one for the viewForHeaderInSection. The view I wanted to remain visible at all times is placed in the viewForHeaderInSection method and the other view is placed in the tableHeaderView property. This is a much simpler approach, I think than using a scrollview. The only issue I have run into with this approach is all my UIView animations in these two views no longer animate.
Here is my code.
[self.tableView setTableHeaderView:self.headerView];
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
return self.tableViewHeader;
}
add yourself as a UIScrollViewDelegate to the UITableView and implement the - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView so that if your views are in their starter positions they do this:
- your UITableView animates its size to the second state:
[UIView animateWithDuration:.1f animations:^{
CGRect theFrame = myView.frame;
theFrame.size.height += floatOfIncreasedHeight;
myView.frame = theFrame;
}];
- your UIView animates its vertical movement
[UIView animateWithDuration:3 delay:0 options:UIViewAnimationOptionCurveLinear animations:^(void){
view.center = CGPointMake(view.center.x , view.center.y + floatOfVerticalMovement);
}completion:^(BOOL Finished){
view.center = CGPointMake(view.center.x , view.center.y - floatOfVerticalMovement);]
Finally always in the delegate implement – scrollViewDidScrollToTop: so that you know can animate back to the initial state (using the same techniques reversed).
UPDATE:
since your views are inside a scroll view, there is a simpler way if you are ok with the table view being partly out of bounds in your starter position (i.e. instead of changing size it just scrolls into view):
make the scroll view frame size as big as your final tableview + your initial (entire) view and place it at 0,0 (so its final part will be hidden outside of the screen)
scrollview.frame = CGRectMake(0,0,tableview.frame.size.width,tableview.frame.size.height + view.frame.size.height);
you make the container scrollview contents as big as the entire table view + the entire view + the amount of the view that you want out of the way when scrolling the table view.
scrollview.contentSize = CGSizeMake(scrollview.frame.size.width, tableview.frame.size.height + view.frame.size.height + floatOfViewHeightIWantOutOfTheWay);
you place the view one after the other in the scrollview leaving all the additional empty space after the table view
view.frame = CGRectMake(0,0,view.frame.size.width, view.frame.size.height);
tableview.frame = CGRectMake(0,view.frame.size.height, tableview.frame.size.width, tableview.frame.size.height);
now it should just work because since iOS 3 nested scrolling is supported
You can easily achieve this by setting the content size of the scrollView correctly and keep the height of the UITableView smaller than your viewcontroller's height, so that it fits the bottom part of the top UIView and the UITableView...
Another scenario is to split the top View in 2 parts.
The part that will scroll away and the part that will be visible.
Then set the part that will scroll away as the entire UITableView header and the part that will remain visible as the header view for the first table section.
So then you can achieve this with a single UITableView, without having to use a UIScrollView
What you're looking for is something like what Game Center happens to do with it's header which can actually be modelled with a table header, a custom section header view, and some very clever calculations that never actually involve messing with the frame and bounds of the table.
First, the easy part: faking a sticky view. That "view that's always present when scrolling the table" implemented as a section header. By making the number of sections in the table 1, and implementing -headerViewForSection:, it's possible to seamlessly make the view scroll with the tableview all for free (API-wise that is):
- (UITableViewHeaderFooterView *)headerViewForSection:(NSInteger)section {
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0,0,320,50)];
label.text = #"Info that was always present when scrolling the UITableView";
label.textAlignment = UITextAlignmentCenter;
label.backgroundColor = [UIColor colorWithRed:0.243 green:0.250 blue:0.253 alpha:1.000];
label.textColor = UIColor.whiteColor;
return label;
}
Finally, the hard part: KVO. When the table scrolls, we have to keep the header up there sticky with regards to the top of the view's frame, which means that you can KVO contentOffset, and use the resultant change in value to approximate the frame that the view should stick to with a little MIN() magic. Assuming your header is 44 pixels tall, the code below calculates the appropriate frame value:
CGPoint offset = [contentOffsetChange CGPointValue];
[self.tableView layoutSubviews];
self.tableView.tableHeaderView.frame = CGRectMake(0,MIN(0,offset.y),CGRectGetWidth(self.scrollView.frame),44);
If the above is infeasible, SMHeadedList actually has a fairly great, and little known, example of how complicated it can be to implement a "double tableview". That implementation has the added benefit of allowing the "header" tableview to scroll with the "main" tableview.
For future visitors, I've implemented a much simpler version, albeit one that accomplishes the goal with Reactive Cocoa, and a little bit of a different outcome. Even so, I believe it may be relevant.
What if you break the UIView into the top and bottom. The bottom will be the info.
Set UITableView.tableHeaderView = topView in viewDidLoad
and the return bottomView as Section Header in delegate method to make it float:
(UITableViewHeaderFooterView *)headerViewForSection:(NSInteger)section
{
return bottomView;
}
Just using the UITableView can solve with your problem. it is not need to use another scroll view.
set your view as the header view of UITableView. Then add your present view to the header view.
complete - (void)scrollViewDidScroll:(UIScrollView *)scrollView; . Tn the function to check the contentoffset of scroll view, and set the present view's frame.

UITableView can not scroll down. Keyboard is shown and not shown at the same time

I have a UITableView and its UITableViewCells can independently change their sizes via the function tableView:heightForRowAtIndexPath. They store UIImages of varying sizes. When I tap an image the keyboard is shown (lets say it is for tagging the images).
When I have, lets say, 3 cells (images) with a total height of 1 pixel less than the screen size it is all good. The keyboard is shown and I can scroll to see all the cells (images).
But when I add one more, pushing the total size to be more than the screen, it all breaks. The keyboard seems to be shown (I have an extra button on top, making it some pixels higher than the original keyboard, that is shown). But I cannot write anything. The button on top of the keyboard is to resign the keyboard, and it does not work. It is kind of stuck.
The project can be downloaded here:https://github.com/TokyoBirdy/cecilia/tree/master/Test (excuse the messy code)
I was able to solve my problem of the locked scrolling by removing the code that edits the view's origin. In addition, I implemented scrolling to the bottom cell by using the tableview's contentSize property in my calculations.
-(void) keyboardWillShow:(NSNotification *)note
{
if(!isKeyboardShowing)
{
isKeyboardShowing = YES;
CGRect keyboardBounds;
[[note.userInfo valueForKey:UIKeyboardBoundsUserInfoKey] getValue: &keyboardBounds];
CGFloat keyboardHeight = keyboardBounds.size.height;
CGRect frame = self.view.frame;
frame.size.height += keyboardHeight;
self.view.frame = frame;
CGPoint scrollPoint = frame.origin;
scrollPoint.y += _tableView.contentSize.height - keyboardHeight;
[_tableView setContentOffset:scrollPoint animated:YES];
}
}

Resources