This seems like it should be pretty straight forward but im really stuck. I basically want to start the app and it goes to the center view, where the user can swipe up down left or right to access four different views. the picture pretty much sums it up. I will make the text in the picture "swipe up for view 1" "swipe down for ....." buttons also that achieve the same thing as the swiping but I dont want to ask for too much so if anyone can help me out and show me how to program what Im looking for I would much appreciate it.
I was able to get it to be just one massive view but I realized that I want it to jump to every different view, not scroll and be half way there. and when I tried to make cgrect frames it was very confusing to keep it all in order.
Here,I am Providing you sample code.I just write code for two views.You just need to determine the views position according to scroll.
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
if(scroll.contentOffset.y> 480 && scroll.contentOffset.x<320)
{
//where next view is you view which you need to display according your requirements.
next *pushnext = [[next alloc]initWithNibName:#"next" bundle:nil];
[self.view addSubview:pushnext.view];
CGRect frame = pushnext.view.frame;
frame.origin.x = 10;
pushnext.view.frame = frame;
[pushnext release];
}
else if(scroll.contentOffset.y<480 && scroll.contentOffset.x>320)
{
//where next view is you view which you need to display according your requirements.
next *pushnext = [[next alloc]initWithNibName:#"next" bundle:nil];
[self.view addSubview:pushnext.view];
CGRect frame = pushnext.view.frame;
frame.origin.x = 10;
pushnext.view.frame = frame;
[pushnext release];
}
}
I hope this will help you.
Related
For example in Tweetbot's iPhone app. When you open up the app and new tweets come in, it will just be appended to the top of the UIScrollView and the current tweet you see did not get refreshed. How can I achieve the same thing effect?. Say I have a UIScrollView with a UIView added to the UIScrollView starting at origin 10,10.
I then downloaded a few items and I want to put it at 10,10.. so I basically need to shift this old item at 10,10 down right? If I do so then during that shifting user's will see it shifted, which is not the effect I want. Where as in Tweetbot's app it seems that nothing is being shifted around, it's just that you grow the area above the 10,10 and append new stuff's there.
How do I do this?
Basically I wanted to implement the insertRowAtIndexPath in a UIScrollView.
Will restate the question this way: how to add content to the top of a UIScrollView without moving the content that's already there (relative to it's current offset).
If this is the right question, the right answer is to do the add and shift down just as you suggested, but then scroll by the same height as added content, giving the illusion that the old content didn't move.
- (void)insertRowAtTop {
// not showing insert atIndexPath because I don't know how you have your subviews indexed
// inserting at the top, we can just shift everything down. you can extend this idea to
// the middle but it requires that you can translate from rows to y-offsets to views
// shift everything down
for (UIView *view in self.scrollView.subviews) {
if ([view isKindOfClass:[MyScrollViewRow self]]) {
MyScrollViewRow *row = (MyScrollViewRow *)view; // all this jazz so we don't pick up the scroll thumbs
row.frame = CGRectOffset(row.frame, 0.0, kROW_HEIGHT); // this is a lot easier if row height is constant
}
}
MyScrollViewRow *newRow = [[MyScrollViewRow alloc] initWithFrame:CGRectMake(0.0,0.0,320.0,kROW_HEIGHT)];
// init newRow
[self.scrollView addSubview:newRow];
// now for your question. scroll everything so the user perceives that the existing rows remained still
CGPoint currentOffset = self.scrollView.contentOffset
self.scrollView.contentOffset = CGPointMake(currentOffset.x, currentOffset.y + kROW_HEIGHT);
}
If you set the contentOffset without animating there wont be a visible scrolling animation. So if your new view is 200 points tall you can set the origin of the new view at (10,10) and the old view at (10,210) and set the contentOffset of the scroll view to (10,210) you should achieve the effect you intend. You'll also need to increase the contentSize of your scroll view to be big enough for all of the content it contains.
I want to add a subview in the top of my view, I have to recalculate the origin y value for all of other views and re-position them to leave space for the new added view.
It is very boring, as I know android have relativelayout or linearlayout can help automatically do that.
How to solve this problem easily in ios development?
I've created a library to solve just this problem: CSLinearLayoutView
You use it like this:
// create the linear layout view
CSLinearLayoutView *linearLayoutView = [[[CSLinearLayoutView alloc] initWithFrame:self.view.bounds] autorelease];
linearLayoutView.orientation = CSLinearLayoutViewOrientationVertical;
[self.view addSubview:linearLayoutView];
// create a layout item for the view you want to display and add it to the layout view
CSLinearLayoutItem *item = [CSLinearLayoutItem layoutItemForView:someView];
item.padding = CSLinearLayoutMakePadding(5.0, 10.0, 5.0, 10.0);
item.horizontalAlignment = CSLinearLayoutItemHorizontalAlignmentCenter;
item.fillMode = CSLinearLayoutItemFillModeNormal;
[linearLayoutView addItem:item];
// add more items
I've been trying to do a relative (linear) layout for a while and finally decided to just subclass UIScrollView to get it done.
I started out just replacing layoutSubviews with a simple loop through the subviews that reset the origins while keeping a running Y. But, some unexpected things are added to the scrollview, including UIInlineAutoCorrect views from textfields/views, which means these things were being mangled by the layout. So I added a little bit of logic that uses the tag property of a UIView to determine if I should lay it out:
-(void) layoutSubviews{
CGFloat runningY = 0.0f;
CGFloat widestWidth = 0.0f;
for (UIView *view in self.subviews) {
if (view.tag != 1999) {
continue;
}
view.origin = CGPointMake(view.origin.x, runningY);
runningY += view.height;
if ([view autoresizingMask] == UIViewAutoresizingFlexibleWidth) {
view.width = self.width;
}
if (view.width > widestWidth) {
widestWidth = view.width;
}
}
[self setContentSize:CGSizeMake(widestWidth, runningY)];
}
If you would still like to use unique tags for your views, you should just specify a range of tags that will be included in the layout instead of a single value.
It's not much work to subclass UIView to make sense of methods like -(void)addView:toRightOfView: etc. You could do this as you go, porting only the methods you need. You could then call these in your override of layoutSubviews as Benjamin indicates.
Views can be built using IB or they can be written programmatically; Android scores well here in making layouts readable and you can bring that benefit to iOS views created programmatically. That there are few iOS devices means beyond readability there are not (yet?) many practical benefits to this pattern.
NB. A "XIB" file is an XML file. Open it up in your favourite text editor and take a look.
** EDIT.
Here's a quick example I knocked up. It has not been tested but some thing like this will work in your subclass of UIView (call it UIRelativeView perhaps).
- (void) addSubview:(UIView *) viewOne
toRightOfSubview:(UIView *) viewTwo
{
if (viewTwo == nil ||
[self.subviews contains:viewTwo] == NO)
{
[self addSubview:viewOne];
}
else
{
CGRect frameTwo = viewTwo.frame;
CGPoint originOne = CGPointMake(frameTwo.origin.x + frameTwo.size.width,
frameTwo.origin.y);
CGRect frameOne = CGRectZero;
frameOne.origin = originOne;
frameOne.size = viewOne.frame.size;
[viewOne setFrame:frameOne];
[self addSubview:viewOne];
}
}
- (void) moveSubview:(UIView *) viewOne
toRightOfSubview:(UIView *) viewTwo
{
if (viewTwo == nil ||
[self.subviews contains:viewTwo] == NO)
{
[self addSubview:viewOne];
}
else if ([self.subviews contains:viewOne] == NO)
{
[self addSubview:viewOne toRightOfSubview:viewTwo];
}
else
{
CGRect frameTwo = viewTwo.frame;
CGPoint originOne = CGPointMake(frameTwo.origin.x + frameTwo.size.width,
frameTwo.origin.y);
CGRect frameOne = CGRectZero;
frameOne.origin = originOne;
frameOne.size = viewOne.frame.size;
[viewOne setFrame:frameOne];
}
}
You've got no luck here. iOS doesn't have provisions for positioning the views in different layouts like Android. You need to reposition all the other subviews to make the way for the new view.
There are some view resizing methods like sizeToFit and autoResizingMask but they won't help you in your case here.
iOS is much more focused on pixel accuracy than Android it is, which uses relative layouts as it has to deal with multiple screen sizes. However, in iOS, the Interface Builder is an incredibly good tool included in XCode, which you can use.
Also, if you are just adding subviews in a repetitive manner, you could override the layoutSubviews method and use that to handle to manual labour for you. You mention having to "recalculate the origin y value for all of other views and re-position them to leave space for the new added view" ... You could code that into your layoutSubviews so you don't have to do it yourself each time.
Unfortunately, though, the SDK doesn't have any of this included by default. autoresizingMask's are great but you can't use that for initial layout; it's for automatic really it when rotating only.
As of iOS 9 you can use UIStackView, which works very similarly to LinearLayout: you add views and the stack view arranges them as needed based on your sizing preferences:
Fill will leave three of them their natural size, and make the fourth one take up the most space. It uses Auto Layout's content hugging priority to decide which one to stretch.
Fill Equally will make each subview the same size so they fill all the space available to the stack view.
Fill Proportionally uses the intrinsic content size of each subview to resize them by an equal amount. So view 1 was designed to have twice as much height as views 2, 3 and 4, that ratio will remain when they are resized – all the subviews get proportionally bigger or smaller.
Equal Spacing does not resize the subviews, and instead resizes the spacing between the subviews to fill the space.
Equal Centering is the most complicated, but for many people also the most aesthetically pleasing. It attempts to ensure the centers of each subview are equally spaced.
You can also set spacing between views in the stack view, adding some padding.
WARNING: When adding stack view child views in code you should always use addArrangedSubview() like this:
stackView.addArrangedSubview(someView)
If you try to use plain old addSubview() it won't work correctly, because the stack view won't know to arrange it.
As for removing, you need to be careful to use stackView.removeArrangedSubview(someView) and someView.removeFromSuperview() otherwise the view won't be removed correctly.
You might find my UIStackView tutorial useful.
I have a tabbarview application that has a button in one of the tabs. When Pressing that button, something will happen, and the user will be switched to another tab.
I made an animation in that button:
UIView * fromView = self.tabBarController.selectedViewController.view;
UIView * toView = [[self.tabBarController.viewControllers objectAtIndex:0] view];
[UIView transitionFromView:fromView
toView:toView
duration:0.6
options:(UIViewAnimationOptionTransitionCurlDown)
completion:^(BOOL finished) {
if (finished) {
self.tabBarController.selectedIndex = 0;
}
}];
Which I got from here. However the problem is that after animating, I seem to have a gap on the top of the screen that is about as high as the status bar. Does anyone know what's causing this? This gap quickly closes when the animation finishes (which is when we do self.tabBarController.selectedIndex = 0
By the way, the problem still persist if I swap the animation to something else or even without animation.
Additional info, here's the frame details:
from frame: x:0.000000, y:0.000000, w:320.000000, h:411.000000
to frame: x:0.000000, y:0.000000, w:320.000000, h:431.000000
The tab bar controller's area also covers the area underneath the status bar. So it's own client view has origin.y of 20.
Thus you need to set the incoming view frame correctly before invoking the transition.
I've found a very hacky way to do it:
CGRect to = fromView.superview.frame;
to.origin.y -= 20;
fromView.superview.frame = to;
Anyone that can explain to me why I had to do this and a more elegant way to do this will get the answer accepted.
I have a bunch of 'rowviews' that I want to put in a vertical scroll view. I have created this rowView view as a separate nib in IB. They are sized at 1024/200 (ipad). Now I want to put them one by one in my parent UIScrollView. I tried a simple [vScroll addSubview:rowView] but this puts them overtop of eachother (I made the rowview transparent to check this). So then I started fooling with the bounds of each rowview to no avail. This is my code. Note 'self.yExtentSoFar' is initialised to 0. Imagine the code below called for each row:
MyRowView *rowView = [[MyRowView alloc] init];
float calculatedWidth = 0;
// minus nav bar
float calculatedHeight = 0;
[[UIDevice currentDevice] beginGeneratingDeviceOrientationNotifications];
UIInterfaceOrientation orientation = [UIDevice currentDevice].orientation;
if (orientation == UIInterfaceOrientationPortrait){
// iPad
calculatedWidth = 768.0;
calculatedHeight = 960.0;
}else{
// iPad
calculatedWidth = 1024.0;
calculatedHeight = 704.0;
}
[self.vScroll addSubview: rowView.view];
[rowView.view setBounds:CGRectMake(0, self.yExtentSoFar, calculatedWidth,200)];
[self.vScroll setContentSize:CGSizeMake(calculatedWidth, yExtentSoFar+200)];
self.yExtentSoFar += 200;
So before I tried settings bounds the rowviews appeared overtop of each other. Understandable I guess. When I set the bounds, the 2nd row view hasn't appeared under the 1st as expected, instead I have to pull down the vScroll and the 2nd has appeared ABOVE the first off screen!
Could someone point to where I'm going wrong? Thanks a lot,
Mike
You want to layout your subviews by setting their frame.
Specifically you're confusing the reference co-ordinates.. bounds refers to how much of that view to show. Whereas the frame is where (& what size) should the view be placed in it's superview.
See "The Relationship of the Frame, Bounds, and Center" View Programming Guide for iPhone
You're doing it wrong ;-) What you have explained here is more or less a re-implementation of what you get using a UITableView. Use a UITableView and a custom table view cell. It will make your life much easier.
I want to have a UIView take over the whole screen to display an image from time to time, but most of the time I'm using a UISplitViewController for the main app functionality. Is there a recommended/best practice way to do this? Right now, I have a pointer to the main window and am just adding the UIView as a sub view and bringing it to front, but it won't display in the proper orientation. I was just wondering if there is a better way/something simple I'm missing.
Thanks.
I struggled with this same issue for some time and have come up with a clunky workaround. Before my solution, some more background on the obstacles:
In iPhone OS, the root view's coordinates are always in the literal fixed coordinates of the physical screen. "Up" is always device up. Subviews have to get coordinates which have been converted to a given orientation so that "Up" is what we expect to be: gravitational up.
Placing a UIView at the top of the view hierarchy (above the UIScrollView) would therefore require that you make these conversions yourself during orientation events. You get fullscreen, but you lose the benefit of the scrollView managing orientation coordinates for your subviews.
Keeping your view within the scrollView, there is no easy method as in Mac OS to simply collapse a pane of a splitView. Reviewing the header file reveals some private instance methods used to manage width.
So, I think that what you can do is maintain two "orientation-aware" view controllers (one splitView, one fullscreen), and switch them out and move your view between them when you toggle fullscreen. I did not go this route as it is obviously a touchy situation memory- and view-hierarchy- wise.
What I do is switch between an "almost fullscreen" width for the main view and regular split width. This works great except that the splitView's rounded corners are actually hard-coded images that get draw regardless of the splitView's dimensions. You will see these tiny black round corners 100% of the time. Here is the effect:
- (IBAction)toggleFullscreen:(id)sender; {
id appDelegate = [[UIApplication sharedApplication] delegate];
UISplitViewController *split = [appDelegate splitViewController];
//get master and detail view controller
UIViewController *master = [split.viewControllers objectAtIndex:0];
UIViewController *detail = [split.viewControllers objectAtIndex:1];
//In landscape permit fullscreen
if(self.interfaceOrientation == UIInterfaceOrientationLandscapeLeft ||
self.interfaceOrientation == UIInterfaceOrientationLandscapeRight) {
CGRect f = detail.view.frame;
if ( f.origin.x == 0 ) { //exiting fullscreen
[sender setImage:[UIImage imageNamed:#"SlideLeft.png"]];
//adjust detail view
f.size.width = 703;
f.origin.x = 321;
[detail.view setFrame:f];
//adjust master view
f = master.view.frame;
f.size.width = 320;
f.origin.x = 0;
[master.view setFrame:f];
} else { //entering fullscreen
[sender setImage:[UIImage imageNamed:#"SlideRight.png"]];
//adjust detail view
f.size.width = 1024;
f.origin.x = 0;
[detail.view setFrame:f];
//adjust master view
f = master.view.frame;
f.size.width = 1;
f.origin.x = -1;
[master.view setFrame:f];
}
}
}
I got lots of this code from here and other sources, but as far as I know this implementation is unique. Probably because it is imperfect.
I ended up using a modal view controller which I present from the split view controller. I then specify the allowed orientations in -shouldAutorotateToInterfaceOrientation. I also hide the status bar. This works for my needs.