I am adding a UILabel and UIActivityIndicatorView as a subview to a tableview as a loading indicator. I want these items to be in the middle of the visible are of the table view, and remain in the center if the user scrolled, so the user will always see the items. My code to create them is:
if (!spinner) {
spinner = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
[spinner startAnimating];
loadingLabel = [[UILabel alloc] initWithFrame:CGRectZero];
loadingLabel.font = [UIFont systemFontOfSize:20];
loadingLabel.textColor = [UIColor grayColor];
loadingLabel.text = #"Loading...";
[loadingLabel sizeToFit];
static CGFloat bufferWidth = 8.0;
CGFloat totalWidth = spinner.frame.size.width + bufferWidth + loadingLabel.frame.size.width;
CGRect spinnerFrame = spinner.frame;
spinnerFrame.origin.x = (self.tableView.bounds.size.width - totalWidth) / 2.0;
spinnerFrame.origin.y = (self.tableView.bounds.size.height - spinnerFrame.size.height) / 2.0;
spinner.frame = spinnerFrame;
spinner.autoresizingMask = (UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin);
[self.tableView addSubview:spinner];
CGRect labelFrame = loadingLabel.frame;
labelFrame.origin.x = (self.tableView.bounds.size.width - totalWidth) / 2.0 + spinnerFrame.size.width + bufferWidth;
labelFrame.origin.y = (self.tableView.bounds.size.height - labelFrame.size.height) / 2.0;
loadingLabel.frame = labelFrame;
loadingLabel.autoresizingMask = (UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin);
[self.tableView addSubview:loadingLabel];
}
How can I make it recenter when the table view scrolls?
EDIT
How would I calculate the sizes to reposition the spinner to the middle? What property would I set?
Add your view to the superview of the table view (if possible; UITableViewControllermakes this impossible)
Add your view to the table view and reposition it in the -scrollViewDidScroll:delegate method (UITableViewDelegateis a sub-protocol of UIScrollViewDelegate)
EDIT:
For maintaining center of the view
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
CGSize adSize = [awView actualAdSize];
CGRect newFrame = awView.frame; newFrame.origin.x = (self.view.bounds.size.width - adSize.width)/2;
newFrame.origin.y = (self.tableView.contentOffset.y - adSize.height/2) -21;
awView.frame = newFrame;
}
Related
Image 1 shows issue. label has flexible width & height constrains, also we adding fix width & height to expand with. in View hierarchy it shows fully expanded as expected, but issue in real view:
Image 2 shows fully expanded label in View hierarchy:
Lable code
self.textLabel = [[RAVerticallyAlignedLabel alloc] initWithFrame: self.bounds andVerticalTextAlignment: [self verticalTextAlignment]];
self.textLabel.backgroundColor = ClearColour;
self.textLabel.userInteractionEnabled = NO;
self.textLabel.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
self.textLabel.numberOfLines = 0;
viewToTruncate = self.textLabel;
textWidth = MAX(MIN(screenSize.width - 20, [label.text sizeWithAttributes: #{NSFontAttributeName : label.font}].width + 10);
[UIView animateWithDuration: 0.3 animations: ^
{
self->containerView.frame = CGRectMake(xPos, top , MIN(textWidth, screenSize.width - 2 * RAPadding), newTextviewHeight);
// Container view is added inside scroll view
self->containerView.layer.shadowRadius = kRATruncationUtiltityShadowRadius;
self->containerView.layer.shadowOpacity = kRATruncationUtiltityShadowOpacity;
self->containerView.layer.shadowOffset = kRATruncationUtiltityShadowOffset;
self->containerView.layer.shadowPath = [UIBezierPath bezierPathWithRect: self->containerView.bounds].CGPath;
self->containerView.layer.masksToBounds = NO;
self->viewToExpand.frame = CGRectMake(0, 0, textWidth + componentContentWidth, self->containerView.height);
//viewToExpand is UILable, added inside container view
self->viewToExpand.layer.borderWidth = 1.0;
self->viewToExpand.layer.borderColor = borderColor.CGColor;
self->viewToExpand.layer.backgroundColor = backgroundColor.CGColor;
}];
Found issue fix, it size wasn't issue but "gradientMask" was playing up on expand as below:
CAGradientLayer *gradientMask = [CAGradientLayer layer];
gradientMask.frame = CGRectMake(0, 0, viewToTruncate.width, viewToTruncate.height);
gradientMask.colors = #[(id)WhiteColour.CGColor,(id)WhiteColour.CGColor, (id)ClearColour.CGColor];
gradientMask.locations = #[#0, #(locationOfFade), #1];
viewToTruncate.layer.mask = gradientMask;
removing mask on expand , it was rendering as expected.
I am creating a view controller in code only, NO .xib or storyboard.
I have many other subviews added to the view, which are added in a method (void)loadView and their frames are initialised in the (id)init method as shown below
-(id)init{
bottomClinkRect = CGRectMake(playersBoardRect.origin.x + (playersBoardWidth * 0.320),
playersBoardRect.origin.y + playersBoardHeight - playerBottomImageRect.size.height - (playersBoardHeight * 0.038),
playersBoardWidth * 0.680,
playersBoardHeight * 0.038);
}
- (void)loadView {
bottomClink = [[UIScrollView alloc]initWithFrame:bottomClinkRect];
[bottomClink setScrollEnabled:YES];
bottomClink.contentSize = CGSizeMake(bottomClink.frame.size.height,bottomClink.frame.size.height);
[contentView addSubview:bottomClink];
}
I create empty scrollview and then based on user actions on screen I am trying to add one imageView per time to the scrollview using the following method:
-(void)reloadCollections:(NSNotification *)notification
{
UIImage *latestPieceCaptured = [gameController capturedBlackPiecesImages].lastObject;
[whitePlayerCaptures addObject:latestPieceCaptured];
NSInteger newNumberOfViews = whitePlayerCaptures.count;
CGFloat xOrigin = (newNumberOfViews - 1) * bottomClink.frame.size.height;
CGRect imageRect = CGRectMake(bottomClink.frame.origin.x + xOrigin,
bottomClink.frame.origin.y,
bottomClink.frame.size.height, //the width is taken from the height
bottomClink.frame.size.height); // the height
UIImageView *image = [[UIImageView alloc] initWithFrame:imageRect];
image.backgroundColor = [UIColor blackColor];
image.image = latestPieceCaptured;
image.contentMode = UIViewContentModeScaleAspectFit;
//set the scroll view content size
bottomClink.contentSize = CGSizeMake(bottomClink.frame.size.height * newNumberOfViews,
bottomClink.frame.size.height);
[bottomClink addSubview:image];
}
My problem is that the scrollview is added to the main view but the imageview(s) are not showing up.
I have debugged it and the scrollview has the subviews added and they have frame size and all, but not showing on the screen. I have tried so many variations but nothing has worked so far.
Thanks in advance for any links or advice.
That works for me:
- (void)addImagesToScrollView {
[self.scrollViewOutlet setAlwaysBounceVertical:NO];
_scrollViewOutlet.delegate = self;
for (int i = 0; i < thumbnailPreview.count; i++) {
CGFloat xOrigin = i * self.scrollViewOutlet.frame.size.width;
UIImageView *image = [[UIImageView alloc] initWithFrame:
CGRectMake(xOrigin, 0,
self.scrollViewOutlet.frame.size.width,
self.scrollViewOutlet.frame.size.height)];
image.image = [UIImage imageNamed: [thumbnailPreview objectAtIndex:i]];
image.contentMode = UIViewContentModeScaleAspectFill;
image.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin;
image.clipsToBounds = YES;
[self.scrollViewOutlet addSubview:image];
}
//set the scroll view content size
self.scrollViewOutlet.contentSize = CGSizeMake(self.scrollViewOutlet.frame.size.width *
thumbnailPreview.count,
self.scrollViewOutlet.frame.size.height);
}
And call it in
- (void)viewDidAppear:(BOOL)animated
I want to make zoom function by PinchGestureRecognizer.
I can scale by this code,but imageView is restored whenever I pinch out.
I want to make the function that If I scale imageView sometimes,it isn't restored every time.
And the code scrollView.minimumZoomScale = 3.0,scrollView.maximumZoomScale = 6.0 don't work.
What should I do?
Here is my code
scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];
scrollView.frame = self.view.bounds;
scrollView.backgroundColor = [UIColor blueColor];
scrollView.contentSize = CGSizeMake(imgView.bounds.size.width+100, imgView.bounds.size.height);
scrollView.frame = CGRectMake(0,50,320,500);
scrollView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
scrollView.pagingEnabled = YES;
scrollView.bouncesZoom = YES;
scrollView.minimumZoomScale = 3.0;
scrollView.maximumZoomScale = 6.0;
scrollView.showsHorizontalScrollIndicator = NO;
scrollView.showsVerticalScrollIndicator = NO;
[self.view addSubview:scrollView];
UIPinchGestureRecognizer *pinchGesture = [[UIPinchGestureRecognizer alloc]
initWithTarget:self action:#selector(handlePinchGesture:)];
[scrollView addGestureRecognizer:pinchGesture];
img =[UIImage imageNamed:[NSString stringWithFormat:#"a.jpg"]];
imgView = [[UIImageView alloc]initWithImage:img];
imgView.frame = CGRectMake(0,0, self.view.frame.size.width, 448);
imgView.userInteractionEnabled = YES;
[scrollView imgView];
- (void)handlePinchGesture:(UIPinchGestureRecognizer *)sender {
CGFloat factor = [(UIPinchGestureRecognizer *)sender scale];
imgView.transform = CGAffineTransformMakeScale(factor, factor);
NSLog(#"factor %f",factor);
}
try use CGAffineTransformScale instead like:
imgView.transform = CGAffineTransformScale(imgView.transform, factor, factor);
Try This Code
UIScrollView *scrollview =[[UIScrollView alloc]initWithFrame:CGRectMake(0,0,320,imageViewHeight)];
scrollview.showsVerticalScrollIndicator=YES;
scrollview.scrollEnabled=YES;
scrollview.maximumZoomScale = 3.0;
scrollview.delegate = self;
scrollview.userInteractionEnabled=YES;
[self.view addSubview:scrollview];`
NOTE: this is just the another way to achieve your requirement
one thing if u are using UIScrollView there is no need to add UIPinchGestureRecognizer to scroll view by default it has pinch gesture.
for zooming there is a delegate methods need to override
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
and
- (CGRect)zoomRectForScrollView:(UIScrollView *)scrollView withScale:(float)scale withCenter:(CGPoint)center
for example
//initilization
scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];
scrollView.frame = self.view.bounds;
scrollView.backgroundColor = [UIColor blueColor];
scrollView.contentSize = CGSizeMake(imgView.bounds.size.width+100, imgView.bounds.size.height);
scrollView.frame = CGRectMake(0,50,320,500);
scrollView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
scrollView.pagingEnabled = YES;
scrollView.bouncesZoom = YES;
scrollView.minimumZoomScale = 3.0;
scrollView.maximumZoomScale = 6.0;
scrollView.showsHorizontalScrollIndicator = NO;
scrollView.showsVerticalScrollIndicator = NO;
scrollView.delegate = self; /* add this line */
[self.view addSubview:scrollView];
//this view will be scaled accordingly
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
return imgView; //return the view which is the subview of scroll view need to be zoomed
}
//it is the rect for the scaling
- (CGRect)zoomRectForScrollView:(UIScrollView *)scrollView withScale:(float)scale withCenter:(CGPoint)center
{
CGRect zoomRect;
zoomRect.size.height = scrollView.frame.size.height / scale;
zoomRect.size.width = scrollView.frame.size.width / scale;
zoomRect.origin.x = center.x - (zoomRect.size.width / 2.0);
zoomRect.origin.y = center.y - (zoomRect.size.height / 2.0);
return zoomRect;
}
Im trying to create an filter bar with a horizontal scroll view.
How can I create the horizontal scrollview in xcode 5 for iOS7?
This is my code:
[self.scroll setScrollEnabled:YES];
[self.scroll setDelegate:self];
self.scroll.backgroundColor = [UIColor clearColor];
scroll.contentMode = UIViewContentModeScaleToFill;
[self.scroll setContentSize:CGSizeMake(320.0,143.0)];
[self.view addSubview:scroll];
[self.scroll setContentSize:CGSizeMake(320.0,143.0)];
For scroll view to scroll horizontally the width of the content size should be larger than the actual frame of scroll view.
If your scroll view frame size is (320, 143), the width of content size of scroll view should be larger than 320 so that the scroll view scroll.
For horizontal scroll view you can use, EasyTableView. Its simple to use.
You will need to get use to the facilities - the horizontal scrollview works and it works in different ways including simulating pages that you can flick right or left.
scrollview has a physical size (frame) and a content size, the thing with scrollviews is the content size will be larger than the physical dimensions so I can for example have a UIImageView of 930x 250 viewable in an iPhone with 320 x 480
(I'll skip the rest of the setup - just what's essential - for all the other tricks look into the apple sample projects - there is a lot - Note also that a lot of apps just use the Interface Builder to paint the view with the scrollview )
UIScrollview *scroll = [[UIScrollview alloc] init]
scroll.frame = CGSizeMake (0,100,320,250);
scroll.contentsize = CGSizeMake(930,250)
UIImageView *imageview = [[UIImageView alloc]init];
imageview.image = myimage; //(UIImage)
[self.view addSubview:scroll]; // add subview as the bottom layer to the main view
[scroll addSubview imageview];
Below is something more complex with pages:
pagectrl.numberOfPages = 7;
pagectrl.currentPage = 0;
scrollView.pagingEnabled = YES;
scrollView.contentSize=CGSizeMake(320* pagectrl.numberOfPages, 500);
scrollView.showsVerticalScrollIndicator = NO;
scrollView.showsHorizontalScrollIndicator = YES;
scrollView.bouncesZoom = NO;
scrollView.decelerationRate = UIScrollViewDecelerationRateFast;
scrollView.scrollsToTop = NO;
scrollView.delegate = self;
search_url.delegate = self;
user.delegate = self;
password.delegate = self;
rpc_code.delegate = self;
// add pages
int page = 0;
CGRect frame = scrollView.frame;
pagesize = frame.size.width;
frame.origin.y = 0;
frame.origin.x = frame.size.width * page;
firstView.frame = frame;
[scrollView addSubview:firstView];
page ++;
frame.origin.x = frame.size.width * page;
locsubView.frame = frame;
[scrollView addSubview:locsubView];
page ++;
frame.origin.x = frame.size.width * page;
QRgensubView.frame = frame;
[scrollView addSubview:QRgensubView];
page ++;
frame.origin.x = frame.size.width * page;
scansubView.frame = frame;
[scrollView addSubview:scansubView];
page ++;
frame.origin.x = frame.size.width * page;
symbologysubView.frame = frame;
[scrollView addSubview:symbologysubView];
page ++;
frame.origin.x = frame.size.width * page;
gaView.frame = frame;
[scrollView addSubview:gaView];
page ++;
frame.origin.x = frame.size.width * page;
upcsubView.frame = frame;
[scrollView addSubview:upcsubView];
[self registerForKeyboardNotifications];
if (gotopage == 7) {
int xloc = ((gotopage - 1) * pagesize);
CGRect fieldrect = CGRectMake(xloc,0,320, pagesize);
[scrollView scrollRectToVisible:fieldrect animated:YES];
}
Design:
View Hierarchy is as below:
UIScrollView (for paging multiple image)
UIScrollView (for enabling zoom on the UIImageView)
UIImageView
UIView (origin,size relative to UIImage in UIImageView)
UIView
UIView ...
UIScrollview
UIImageView
UIView
UIView ...
UIScrollView ... and so on
Implementation:
- (id)init
{
self = [super init];
if (self) {
// Custom initialization
self.minimumZoomScale = 1.0f;
self.maximumZoomScale = 4.0f;
self.zoomScale = 1.0f;
self.bouncesZoom = true;
self.bounces = true;
self.tag = 10;
self.alwaysBounceHorizontal = false;
self.autoresizesSubviews = YES;
self.zoomView = [[UIImageView alloc] init];
self.zoomView.userInteractionEnabled = YES;
self.zoomView.autoresizesSubviews = YES;
}
return self;
}
- (void)displayImage:(UIImage *)image
{
// Set the image in the view
[_zoomView setImage:image];
// Set the Frame size to the size of image size
// Ex. Resulting ScrollView frame = {0,0},{1250,1500}
// Ex. Resulting ImageView frame = {0,0}, {1250,1500}
CGRect scrollFrame = self.frame;
scrollFrame.size.width = image.size.width;
scrollFrame.size.height = image.size.height;
self.frame = scrollFrame;
CGRect iViewFrame = _zoomView.frame;
iViewFrame.size.width = image.size.width;
iViewFrame.size.height = image.size.height;
_zoomView.frame = iViewFrame;
// Add subviews before resetting the contentsize
for (customClass* field in list.fields) {
UIView* view = [[UIView alloc] initWithFrame:CGRectMake([field.x floatValue], [field.y floatValue], [field.width floatValue], [field.height floatValue])];
view.backgroundColor = [UIColor redColor];
view.autoresizingMask = UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleTopMargin |UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
[_zoomView addSubview:view];
}
// Set the Frame size to the size of scrollview frame size
// Ex. Resulting ScrollView Frame = {0,0},{320,460}
// Ex. Resulting ImageView Frame = {0,0},{320,460}
CGRect scrollViewFrame = self.frame;
scrollViewFrame.size.width = 320.0f;
scrollViewFrame.size.height = 460.0f;
self.frame = scrollViewFrame;
CGRect imageViewFrame = _zoomView.frame;
imageViewFrame.size.width = self.bounds.size.width;
imageViewFrame.size.height = self.bounds.size.height;
_zoomView.frame = imageViewFrame;
self.contentSize = _zoomView.bounds.size;
[self addSubview:_zoomView];
}
Above is the code that I tried implementing. It adds the UIViews to the UIImageView inside the UIScrollView. But the relative origin of the UIView is not correct (both before and after resizing).
Is there anything I should be doing differently to get the UIViews correctly placed inside the UIImageView?
This was top hit on Google for "scrollview subviews wont resize". For anyone else following that link:
Looking at your source, and comparing to mine, I realised that in Interface Builder, my NIB file had the tickbox for "auto size subviews" unticked. I have a vague memory this might be because in an old version of Xcode (this is an old project that's been maintained for a while) ... UIScrollView defaulted to having it switched off.
So: check that you've got it set correctly in Xcode / Interface Builder, and/or that you're setting it in code.