Dim part of MKMapView - objective-c

I have a label that overlays on an MKMapView. The only problem is, in some parts it is not totally readable, as the map is in satellite imagery. Also, my map view zooms in the whole way, it focuses on a shop.
I looked at the new map application for Apple and have found that they dim (put a slightly black shadow) over the map region where the label is around. Therefore the label will be slightly more visible and outstanding.
Here is a picture of what Apple does, look at the label, around it you can see the map is slightly darkened/dimmed:
Do you have any ideas on how I can add a shadow/dim the map view. Also, a bit of sample code wouldn't hurt, thanks!

You can use gradient overlay, with transparency and add the UILabel into that gradient overlaid UIView.
Useful link to get started : http://mrohs.com/2011/overlay-with-gradient-and-transparency

Related

Full responsive UIView inside a UIScrollView using autolayout

I'm trying to understand how autolayout works under XCode6, but there's a lot of mysterious things that runs away from my mind. Autolayout and constraints philosofy can be very hard to learn, but I realized that life can be easier using these tools...
For your information, I need to build a chat view with a table (the messages) and a view containing a text field (the send message pane) nested in a UIView that is again nested in a UIScrollView, so I can shift up the scroll view as the keyboard appears under the textfield.
I read a lot of tutorials and watched a lot of video until I found the useful tutorial Using UIScrollView with Auto Layout in iOS. There's a Xcode project in Github of what the tutorial explains, too.
In his tutorial, Mike Woelmer tells that
One of the big pain points with the old way of setting up a
UIScrollView was communicating the content size to the scroll view. It
was fairly straightforward to calculate your content size if the
content in the UIScrollView was an image. But it was not as easy if
your scroll view included a mixed bag of buttons, labels, custom
views, and text fields. Lengthy code adjustments were needed to
reflect constant changes in device rotations and phone size
differences.
So Mike explains the way to adapt the UIView, using placeholder and forcing the view inside the scrollview to fits the device's screen, creating in viewDidLoad some NSLayoutConstraint:
The solution is to look outside the scroll view and attach a
constraint to the view controller’s main view. This cannot be done in
interface builder, so we will have to write some code. Interface
builder is still complaining, though, so we have to add a placeholder
width constraint to make it happy.
I tried to use parts of the code of the tutorial for my project, but I cannot get a working view controller for my needs (I always get errors). Which is the best approach to do this? Am I on the right road?
Last but not least, I'm italian, so pardon for my english. If something is not clear enough, please leave me a comment.
Basically you have to set both alignment and size constraints in order for Autolayout to take care of the rest for you. If you don't provide enough information you get warning. If you provide conflicting information you get errors.
You need basically to provide enough information for Autolayout to calculate the UIView frame property (i.e., x-position, y-position, width, height).
For example, by providing the distance constraints from the top, right, bottom, and left edges, Autolayout has enough information to draw that UIView's frame rectangle. But you could also provide just the distance constraints from the top and left edges and then provide a size and height constraint.
You can also configure the key constraints you need and then click 'resolve auto layout issues' and choose 'add missing constraints' though sometimes it doesn't give you what you want. It is better to understand that how Autolayout accomplishes what I described above.
If you mess up, it's usually easier to clear all the constraints and start over. Do it a few times and you'll get the hang of it.

Too many UIViews causes lag

I am creating an app for practice that is a simple drawing app. The user drags his/her finger along the screen and it colors in a 100px x 100px square.
I currently achieve this by creating a new colored UIView where the user taps, and that is working. But, after a little time coloring in, there is substantial lag, which I believe is down to there being too many UIViews as a subview of the main view.
How can I, and others who similarly create UIViews on dragging a finger reduce the lag to none at all, no matter how many UIViews there are. I also think that perhaps this is an impossible task, so how else can someone like me color a cube of the size stated above in the main view on a finger dragged along the screen?
I know that this may seem like a specific question, but I believe that it could help others understand how to reduce lag if there are a very large amount of UIViews where a less performance reducing option is available.
One approach is to draw each square into an image and display that image, rather than keeping around an UIView for each square.
If your drawing is simple enough, though, you can use OpenGL to do this, which is much faster. You should look at Apple's GL Paint Sample Code which shows how to do this in OpenGL.
If your drawing is too complex for OpenGL, you could create, for example, a CGBitmapContext, and draw each square into that context when the user drags their finger. Whenever you draw a new square into that bitmap, you can turn the bitmap into an image (via CGBitmapConxtextCreateImage) and display that image an a UIImageView.
There are two things that come to my mind:
1- Use Instruments tool to check if you are leaking any memory
2- If you are just coloring the views than instead of creating images for each of them, either set the background color property of UIView or override the drawRect method to do custom drawing
I think what you are looking for is the drawRect: method of UIView. You could create your custom UIView (you propably have that already) and override the drawRect method and do your drawing there! You will have to save your drawings in an array or another container and call the setNeedsDisplay method whenever the array content is changed.

How can I place a small image in my UIView

I want to place a series of images in a UIView... I want to be able to change each image's color using three different .png files (red,yellow,green) as a status indicator. Other than actually drawing the rectangle and filling it, is there an easier way?
Research effort: I have Googled and looked through SO and found nothing dealing with this.
There are lots of ways you can do this. I think the easiest way would be to pragmatically add UIViews as subviews to your main view, or to your parent UIView.
You can set the frame of your views as well as the background color. See this link
adding uiview as a subview to the main view
You can also use images, but since it is a plain solid color, its a lot of extra storage space, etc. to use images when you can programatically render a color.
If it is a series of rectangles, you can store UIViews in some kind of data structure so it is easier to dynamically change the color at runtime. If you aren't moving them around, then init there frames/geometry so they are in the correct location, then access them as members of an array or something similar.
If you want to add gradients to images, this is the best thing I have found:
Gradients on UIView and UILabels On iPhone
I figured it out... I took a UIButton, changed the Type to "Custom", sized it (32 x 32) and programmatically changed the the image depending on circumstances.
[button setImage:<#(UIImage *)#> forState:<#(UIControlState)#>]
Thanks to both of you for getting the thought process running... :D

Best approach for drawing a graph of almost infinite size in a UIScrollView on iPad

I'm currently working on an app which needs to draw s.th. like a network graph. Unfortunately this graph can become very big with thousands of movable objects.
I tried to put a giant UIView inside a UIScrollView but soon noticed this won't work because of memory limitations.
So I tried another approach: currently I have a UIView which has exactly the size of the visible part of the UIScrollView. The scrollview is set to not handle the scrolling (only the pinching). Instead I handle the scrolling in the UIView. Everytime a user scrolls, all graphic objects (those graphic objects are currently just subclasses of NSObject, which contain custom drawing code) are moved, so it seems like the view is scrolling. In the drawRect I only draw the graphics that are currently visible.
Also I constantly add and remove sublayers if they are moved out/in the visible frame
This works very smooth even with thousands of objects.
Unfortunately this approach has some drawbacks:
I can't zoom out to see all the objects in the graph, instead the user can only see a part of it
I don't get the inertial scrolling the UIScrollView offers
Other approaches I tried, like the CATiledLayer, don't work either because all the objects in the graph are draggable by the user and it looks really ugly if I use a CATiledLayer...
Swapping out the UIView with other UIViews while the user scrolls may help with the inertial scrolling, but it makes everything more complicated and zooming out completely still won't work :-(
Do you know of any best practices to draw graphs that can be very big?
//edit: I ended up with a uiscrollview which has a subview which has a cascrolllayer which has many sublayers. While zooming in and out the frame of the uiscrollviews subview is constantly changed to the uiscrollviews bounds by view.frame = scrollview.bounds. While dragging the scrollview the cascrolllayer is always forced to scroll to the current offset of the scrollview.
I needed to subclass the uiscrollview and hack around in order to make the zooming work nicely, but it's working well now. This approach works very well and allows very big graphs with lots of draggable elements.
//edit: see my other answer below, the approach above didn't work out as well as I initially thought, especially the zooming part
CATiledLayer is definitely what you should use here—there’s not really another solution that’ll let you use Quartz/UIKit drawing on a huge zoomable canvas. For anything that needs to be interactive (dragged or animated or whatever), you can disable its display in the main tiled layer and overlay another view or layer on top of it that just contains the object being interacted with.

Rotating MapView according to compass

I'm working on Map application that needs to work like original MapView on iOS.
I need to rotate mapview according to compass heading value. I tried MTLocation example also I also tried this answer But my results is not good.
Please see the screen shot.
When I rotate mapview according to heading value Map is rotating but as you can see on screen tiles is missing.
How can I solve this display problem ?
Regards
- Fatih
Hy,
I'm the author of MTLocation. Thanks for using it by the way!
For this to work you have to make sure, that your MKMapView is a subview of your ViewController's view (and not the view itself). Then you have to increase the frame of your mapView with a simple Pytaghoras - calculation: the width and height must be at least as big as the diagonal: sqrt(visibleWidth[320]^2 + visibleHeight[480-88]^2) = 506.
So that means
mapView = [[MKMapView alloc] initWithFrame:CGRectMake(-100,-100,520,520)];
Hope that helped, please consider upvoting if it fixed your problem.
You can consider using a bigger frame for the MKMapView object. It should probably be a square with each side equal to the length of the device's diagonal. The problem with this approach is that there are regions of this object that the user won't see but we process information like views for annotations related to that region anyway. Other properties like visibleMapRect would be least helpful.
Another alternative would be to be zoom in by scaling the MKMapView object on rotation. But this might make the map blurry (untested). You could zoom out on the region displayed in the map but it could lead to frequent refreshes. You can look at a middle ground where you don't zoom out until the map is rotated over a certain angle. You can also look at using two views where one of the views is off screen and updated so that it can replace the view after a certain amount of rotation so that it feels seamless.
I am working towards making my own maps application in iPhone. I want my maps to rotate as the user turns. I tried setUserTrackingMode available in iOS 5, but due to some reason it doesn't work. So I decided to take help of MTLocation framework here.
Till now I have done the following.
created a new project and copied all .m and .h files in that.
Import MapKit.h and MTLocation.h.
In Viewcontroller.h, defined property for mapView (should I define a property for locateMeItem).
In ViewDidLoad, paste the code given at the end of the page here.
I get a few errors:
Can't see the locateMe button when created programatically.
Undefined property headingEnabled.
myCustomSelector has no effect.
self.toolbar- toolbar is not a instance of ViewController.
I have tried a code at gist[dot]github[dot]com/1373050 too, but I get similar errors.
Can anybody explain a detailed procedure of this.