Make UIView area unclickable - ios

So i have a UIView setup on the Ipad for a small project i am working on. I will be displaying an image or a view on that page. I wanted to know if is it possible to create an invisible border (say 1") around the view that will be unclickable ?
I was thinking of adding a button and disabling it, but i think that would not allow the image to be shown full screen.
I have already setup a recognizer, because i want a three finger swipe to go to the next image. What would be the best approach for this ?

Use a custom UIView class and override hitTest:withEvent:.
- UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
CGRect frame = CGRectInset(self.bounds, 25, 25);
return CGRectContainsPoint(frame, point) ? self : nil;
}
Adjust the inset to meet your needs.

Related

UIScrollView scroll over background view

I have a UIScrollView (with a clear background) and behind it I have a UIImage that takes up about 1/3 of the devices height. In order to initial display the image which is sitting being the scroll view I set the scrollviews contentInset to use the same height as the image. This does exactly what I want, initialing showing the image, but scrolling down will eventually cover the image with the scroll views content.
The only issue is I added a button onto of the image. However it cannot be touched because the UIScrollView is actually over the top of it (even though the button can be seen due to the clear background). How can I get this to work.
Edit:
The following solved the problem:
//viewdidload
self.scrollView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: "onScrollViewTapped:"))
...
func onScrollViewTapped(recognizer:UITapGestureRecognizer)
{
var point = recognizer.locationInView(self.view)
if CGRectContainsPoint(self.closeButton.frame, point) {
self.closeButton.sendActionsForControlEvents(UIControlEvents.TouchUpInside)
}
}
Thanks for the screenshots and reference to Google maps doing what you're looking for, I can see what you're talking about now.
I noticed that the image is clickable and is scrolled over but there is no button showing on the image itself. What you can do is put a clear button in your UIScrollView that covers the image in order to make it clickable when you're able to see it. You're not going to be able to click anything under a UIScrollView as far as I can tell.
Please let me know if that works for you.
a simple solution is to reorder the views in the document out line. The higher the view in the outline, the lower the view is as a layer
Two things to test:
1) Make sure the image that contains the button has its userInteractionEnabled set to true (the default is false). Although, since the button is a subview and added on top of the ImageView (I assume) then this might not help.
2) If that doesn't help, can you instead add the button as a subview of the UIScrollView and set its position to be where the image is? This way it should stay on the image and will be hidden as the user scrolls down, but clickable since it is a child of the ScrollView.
Some code and/or images would help as well.
I think the way to do this is to subclass whatever objects are in your UIScrollView and override touches began / touches ended. Then figure out which coordinates are being touched and whether they land within the bounds of your button
e.g. in Swift this would be:
override func touchesBegan(touches: Set<NSObject>, withEvent event: UIEvent?) {
println("!!! touchesBegan")
if var touch = touches.first {
var touchObj:UITouch = touch as! UITouch
println("touchesBegan \(touchObj.locationInView(self))") //this locationInView should probably target the main screen view and then test coordinates against your button bounds
}
super.touchesBegan(touches, withEvent:event!)
}
See :
https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIResponder_Class/index.html#//apple_ref/occ/instm/UIResponder/touchesBegan:withEvent:
And:
https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITouch_Class/index.html#//apple_ref/occ/instm/UITouch/locationInView:
You should subclass UIScrollView and override -hitTest:withEvent: like so, to make sure it only eats touches it should.
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
UIView *const inherited = [super hitTest:point withEvent:event];
if (inherited == self) return nil;
return inherited;
}
Also make sure to set userInteractionEnabled to YES in your image view.
There is 2 way you can checked that weather touch event is fire on UIButton or not?
Option 1 : You need to add UITapGesture on UIScrollView. while tapping on UIScrollView. Tap gesture return touch point with respect to UIScrollView. you need to convert that touch point with respect to main UIView(that is self.view) using following method.
CGPoint originInSuperview = [superview convertPoint:CGPointZero fromView:subview];
after successfully conversation, you can checked that weather touch point is interact with UIButton frame or what. if it interact then you can perform you action that you are going to perform on UIButton selector.
CGRectContainsPoint(buttonView.frame, point)
Option 2 : Received first touch event while user touch on iPhone screen. and redirect touch point to current UIViewController. where you can check interact as like in option 1 describe. and perform your action.
Option 2 is already integrated in one of my project successfully but i have forgot the library that received first tap event and redirect to current controller. when i know its name i will remind you.
May this help you.

UIButton positioned where half is in the air-is disabled?

I have some side UIView that is in the screen size .
This side UIView, is placed on the left where its X is at -screen.width , so we dont see him .
Than , in this side view class view, i am adding a small square UIView, at its right , at screen.width , that means on the main view i can see on the left , this little square from the side view .
This structure is to get a side menu effect .
In this little square view, there is a UIButton , but this button is not responding to touches .
I do not want to place this side menu where it is a few pixels inside the screen, because this may cover some content .
Hence, i created this structure where the side menu is in the screen size,it is placed on
minus screen size.width
and has this little square that comes into the screen ,and when you push it, the whole side view comes in .
Why is this button is disabled ? is that because he is hang in the air, where part of it is not inside its superview ?
EDIT:
Found this great answer which is not working for me
interaction beyond bounds of uiview
I have added this to the parent view that contains the button , and it does log the touch,but not working.
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
CGFloat radius = 200.0;
CGRect frame = CGRectMake(self.frame.size.width, 0,
radius,
radius);
if (CGRectContainsPoint(frame, point))
{
NSLog(#"log");
return self;
}
return nil;
}
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
{
if (CGRectContainsPoint(self.bounds, point) ||
CGRectContainsPoint(menus.frame, point))
{
return YES;
}
return NO;
}
Thanks Aaron, I found that indeed this solution does works :
Interaction beyond bounds of UIView
But I found that a better way to do that side menu without covering the content of the main screen, is to set the height of the side menu to be very small, and set its x to appear a little bit inside the main scene.
Then when open it, just a moment before bringing it to cover the main scene, change its height to be in the screen height, this way, you don't cover the content when the menu is closed, but when you open it you change its height to be full height.

Custom UIView widget with UIScrollView not scrolling

I am trying to develop a new custom UIView (to allow for horizontal date selection). I want to do all the UI design in XIB files.
The custom UI view contains a scrollview and then two 'week' views. The idea is that as the scrolling occurs, I will move the two 'week' views in place and reconfigure them to the right dates to create an 'infinite' scroll for date selections.
I can load the UIView, which then loads scrollview and week views (all designed in a XIB).
My DatePickerView class, derived from the UIView class does an addSubview of the scroll view (which contains the two week views). The scroll view is 320 wide and the contentSize is set to 640 wide. UserInteraction is enabled. Horizonal Scrolling is enabled.
This all works and displays on the screen. The week views each contain 7 buttons. I can press them and they get the touch. However, the scrollview does not seem to want to scroll.
I set my custom view to be a UIScrollViewDelegate. No calls occur to scrollViewDidScroll.
For each of the week views, I have a 'container' view and then the buttons. I added the following to the container view (again derived from a UIView).
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
DDLogInfo(#"Began. Next Responder: %#", self.nextResponder);
[self.nextResponder touchesBegan:touches withEvent:event];
}
(and comparable ones for the other touch events, touchesMoved, touchesEnded, touchesCancelled),
I print out the nextResponder, which is the UIScrollView, so I know that I am sending the touch to the view, but I never see the scrollview want to scroll.
Is my method of passing the touchEvents up the responder chain correct?
Is there anything else I need to configure to get the scrolling to work?
Any help is appreciated.
Charlie
If I understand correctly, you want infinite scroll with just three pages of scroll view. I achieved it with similar effects in my calendar view project.
You can checkout from here DPCalendar
In a nutshell, I created a view like
#interface DPCalendarMonthlyView : UIScrollView
And initial it like this
self.showsHorizontalScrollIndicator = NO;
self.clipsToBounds = YES;
self.contentInset = UIEdgeInsetsZero;
self.pagingEnabled = YES;
self.delegate = self;
I create three views like this
[self.pagingViews addObject:[self singleMonthViewInFrame:self.bounds]];
[self.pagingViews addObject:[self singleMonthViewInFrame:CGRectMake(self.bounds.size.width, 0, self.bounds.size.width, self.bounds.size.height)]];
[self.pagingViews addObject:[self singleMonthViewInFrame:CGRectMake(self.bounds.size.width * 2, 0, self.bounds.size.width, self.bounds.size.height)]];
Then I set the content size and also scroll it to the middle
[self setContentSize:CGSizeMake(self.bounds.size.width * 3, self.bounds.size.height)];
[self scrollRectToVisible:((UIView *)[self.pagingViews objectAtIndex:1]).frame animated:NO];
In the scrollview delegate function, i need to do
- (void)scrollViewDidEndDecelerating:(UIScrollView *)sender
{
//If scroll right
if(self.contentOffset.x > self.frame.size.width)
{
//do something if scroll right
} else if(self.contentOffset.x < self.frame.size.width)
{
//do something else if scroll left
} else {
return;
}
//scroll back to the middle
[self scrollRectToVisible:((UICollectionView *)[self.pagingViews objectAtIndex:1]).frame animated:NO];
}
Hopefully it is useful to you.
For those that follow down this path, I figured this out and it was a silly error. I forgot to turn off AutoLayout. I keep forgetting that Apple put autoLayout as an enable/disable option under the 'document'-level of a NIB (so I forget to look there).
Turned it off and it works as designed. Looks like autoLayout was causing the views to be rearranged to not need to be scrolled, or something equivalent.

iPad: How can I click buttons underneath transparent portions of a UIView

I am subclassing a view which is the same size as my main ViewController (1024x768). This subview has a transparent background and contains buttons that are sized 50w X 50h and are positioned dynamically.
My issue is that I need to interact with content and buttons that exist beneath this view but this subview is blocking that interaction.
I've seen some posts address a similar problem, but I am unclear of the actual usage.
-pointInside:withEvent: is how iOS asks if a touch is within a particular view. If a view returns YES, iOS calls -hitTest:withEvent: to determine the particular subview of that view that was touched. That method will return self if there are no subviews at the location of that touch. So you can pass any touches that aren't on subviews back to views behind this one by implementing -pointInside:withEvent: like this:
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
{
return ([self hitTest:point withEvent:event] != self);
}
If you need to catch some touches that aren't on subviews, your implementation will be more complicated, but this method is still the right place to tell iOS where your view is and accepts touch events.
Did you try to set userInteractionEnabled to YES or NO?
If all else fails you can bring those subviews to the front programmatically using
[self.view bringSubviewToFront:buttonToClick];

Dragging uiimageview into a "trashcan" while zoomed in on a uiscrollview

Hey everyone. I've searched the web and really haven't found a problem quite like this. My set up is as follows: I am trying to make an app where a user drags uiimageviewss on a uiview inside a uiscrollview (which can zoom in), but also drag the image to a trashcan to be deleted. When the scrollview is zoomed in, the user can still drag because I have subclassed uiimageview and overridden the touchesMoved method. I want the user to be able to drag the uiimageviews to a trashcan in the bottom right corner of the screen. What I implemented already works when the uiscrollview is normal zoom scale, but when you zoom in you cannot drag the image to the trashcan, because well, the trashcan is a subview of the controller's view itself (this was so that it wouldn't zoom with the uiview) and of course is not in the right coordinates of the screen for the uiscrollview.
I've found a view method called ConvertRect that converts a rectangle to the coordinates of whatever view you give to the method, but this doesn't seem to be working. I do a check within each mapimage(the imageview subclass) that checks the frame of the uiimageview intersects the frame of the trashcan. So I try this method before I do that check, but like I said it doesn't seem to be working.
So with all that complicatedness, let me say in a nutshell my problem. I want to drag images over to a trashcan regardless of what zoom level at uiscrollview is at. I can make the trashcan part of the uiscrollview but I need a way to make it keep in the bottom right corner and also not zoom when the uiscrollview does. Any ideas would be so greatly appreciated, thanks guys. :)
I had the exact same challenge.
In can just describe it in short:
When you start dragging the image REMOVE it from the UISCrollView and add it as a subview the the main view of your ViewController.
make sure that the image won't get lost in the process (means: someone still retaining it).
While dragging, constantly check to see if your image entered or left the boundaries of the trash can. you can do it with the method bellow:
-(void) checkForTrashCan
{
CGRect rect = [self.delegate.trashCan convertRect:self.view.frame fromView:self.view.superview];
if ([self.delegate.trashCan rectIntersectBounds:rect])
{
if (NOT self.isInTrashMode)
{
[self enterTrashMode];
}
}
else
{
if (self.isInTrashMode)
{
[self exitTrashMode];
}
}
}
When the method rectIntersectBounds is just a simple extension method for UIView class that i wrote:
-(BOOL) rectIntersectBounds : (CGRect) rect
{
return CGRectIntersectsRect(self.bounds, rect);
}
When the drag ended check if your view is inside the trash can, and act according to the result.

Resources