How to draw using Quartz 2D to my ViewController - ios

This is sort of a beginner-level question. I have inherited an iOS project and it is implemented with a few ViewControllers with associated XIB files. The XIB files contain various widgets that are controlled by code in the ViewControllers (which I think is the standard way of constructing an app).
However, I need to do some custom drawing (rectangles, lines, circles, text) in between the widgets, and I'd like to use the Quartz 2D library to do this. I've never used Quartz2D, and most of the sample code I find is centered around the View, not the ViewController.
Most of it seems to do with implementing the "drawRect" method of your View. However, my ViewController does not have a "drawRect" function, as far as I can tell. Is there a way I can implement a "drawRect" function on my ViewController or whatever View it is controlling?
*** addendum:
I have researched and reminded myself that the operational UIView is a property of the UIViewController, and it seems like UIView is created automatically by the application and bundled together with my XIB and ViewController (I think we selected "also create XIB" when we were creating a ViewController, so the UIView is implied?). I don't see where this default UIView instantiation occurs. But I assume the way to draw to it is to subclass it?
If so, what is the cleanest way to subclass this UIView and get access to drawRect while maintaining the connection to the existing ViewController and XIB (or storyboard)? I inherited the project and this change needs to be low-impact.
Thanks for any help/thoughts.

Make a subclass of UIView and override -drawRect: to do your custom drawing. In the xib, select the view of your view controller, go to the Identity Inspector (third tab in the right sidebar in Xcode), and replace UIView with your custom subclass.

Related

Need clarification regarding MVC design pattern

I have a reusable UIView with its own .xib file. This UIView would be added to different UIViewControllers as subviews. In the MVC design pattern, my reusable UIView should contain only code for the user interface(UILabels, UIButons, etc..). What I'm confused about is setting up the UILabels and UIButtons. Is the ViewController that contains my UIView responsible for setting up my UIView's UIButton click events and what my UILabel displays? The problem I'm having now is that I have multiple UIViewControllers that reuse the same UIView, but they all implement the same code that sets up my UIView. This end up with lots of duplicate code across my UIViewControllers. If I move the setup code to my UIView to reduce the duplicate code, doesn't that violate the MVC design pattern? Is there a way to create a "Controller" thats only responsible for setting up my UIView so I could reuse my UIView and Controller inside my UIViewControllers?
Assuming that by setup you mean instructing the UIView on how to draw itself based on some object, this is exactly what the drawRect method is for. UIView also provides an initWithFrame method and you can even create your own initializer if you want. One more option is to create a function in your UIView subclass that will take what ever info you are displaying and will setup the view way you want. Something like: setupCustomViewWithMyObject(object).
All this to say that your setup code should be in your UIView subclass and you are not violating anything.

MVC with view built in code

I've been trying to interpret the lessons from CS193P, and have a few questions.
I'm building views in code, the way I do it is I have a UIView subclass where I put all the views in place in the init method. This class is initialized by the ViewController.
The question is then, what is the right approach from here - say i want to animate a button I placed at 0,0 to 100,100. I'd like to animate it from the ViewController, but i don't like the fact that i set the 0,0 position in the UIView class (in the initializer) and now i am setting a new position in the ViewController. I'd prefer there would be just one place knowing about the actual (x,y) positions of my views.
How am i supposed to go about this?
Move the positions in the initializer to the ViewController
Put a method in my UIView "-(void)AnimateToSecondPosition" where the actual "second position" is then up to the view?
Just let it go. It seems like this would be the right approach if i had placed the button in interface builder - i consider interface builder to be the view then...
Or maybe even a fourth option?
Please help me understand it better and not just give me the right answer ;)
I'd like to be able to compare my approach in some way to how you would do it using interface builder, so each of my views are public and accessable from the controller - this way i believe i could easily start using interface builder instead if i wanted, without changing the controller code, just hooking up the outlets.
I'm guessing the case would be the same for disabling, hiding and doing other things with the views.
Thanks in advance.
If you want to create a new View programmatically you should generally instantiate it in your View Controller using its designated initialiser:
UIView *testView = [[UIView alloc]initWithFrame:myFrame];
If you create a custom view it's totally fine and correct to put some configuration code in the init method, but it's your ViewController that should be in charge of deciding what to do with this view - it is his job! Using the MVC the View and the Model should never communicate directly (as you definitely learned in the first lesson of CS193P).
Therefore the same apply to the animations. You should animate the Views within your ViewController and not implement the animation in the View itself.
Therefore in my opinion you "second position" should be setup by the VC - if this has to be done when something happens to the view (e.g. someone pressing a UIButton) you should set a target/action to your VC and handle this within your VC.
ADDED:
Regarding building UIViews in the Interface Builder I don't know what you mean by "and let them go". Interface builder will create the views and add them to the specific superviews at runtime - as you can see in the example below you control the view hierarchy graphically on the left. For instance in this case there is a UIView (which I coloured green for clarity) and two buttons. One is a subview of the main view while the other is a subview of the green UIView.
Once your ViewController is loaded the view hierarchy is automatically loaded to self.view - in fact if you run the following code in your VC when it is loaded you will see the list of self.views subviews in your console.
for (UIView *view in self.view.subviews){
NSLog("%#", [view description]);
}
If you know already that you need to change some attributes of a specific UIView you setup via Interface Builder (e.g. we know we want to change programmatically the color of the green UIView in the example above) you should create an outlet which allows you to have a reference to that view in your code. You do it by crtl-drag from the storyboard to your ViewController code - see the example below.
When you have done that you can refer in code to this as any other property, with the difference that it has been created by Interface Builder.
Hope this helps.
You can add an -setButtonFrameToSecondPosition to the view subclass, which simply updates the frame of the button, and then call that from the view controller via one of the +[UIView animate:...] methods.

Modify and redraw another UIView from the UIViewController

I have a flow issue in my iOS app from my subclassed UIView to its parent UIViewController.
Basically, I have a nib called preferences. It contains two sliders, two labels, and another UIView that will display a shape dictated by the two scroll bars (Stroke and opacity). I successfully painted the subclassed ui to the screen by setting the custom class of the UIView to a separate UIView we'll call subView. I have setters/getters for the scroll bars and they print out their values. How do i let the uiview class (pointed at the ui nib object) to update and redraw since it isn't referenced in the parent preferences class? I tried syntax like this:
[code]
IBOutlet SubClassUIView *subclassUI
[/code]
to no effect. It seems best to point a custom class at the UIView.
Any suggestions and advice would be much appreciated.
TL;DR can't modify subclassed uiview from "parent" uiviewcontroller
Sorry folks, i figured it out.
In addition to passing in a custom class that shares the same type as the IBOutlet (such as a UIView),
there MUST be a link referencing every object in in the .xib to its parent. In this case, the parent UIViewController needed a reference from the custom class ui to a IBOutlet UI. From there, some simple casting from generic and boring UIView to the custom class's unique methods makes for a complete flow.

How do I make a reusable UIView

So I want to make a UIView that have a image and two text labels inside, but I want to make it on storyboard and make it reusable, because they will appear in another situations.
What is the best way to make a non-intrusive custom UIView?
So for storyboard you will still need to use a .xib. I use storyboard but have found no other way just to make a custom UIView.
Create a new view in xCode and delete the view controller.
Draw a UIView over into the workspace
Setup the identifier and tie it to your UIView class.
Add your text boxes and what not.
Save your newly created .xib
Call in your custom view into your code
Here is a bit more detail with step by step process. http://nathanhjones.com/2011/02/20/creating-reusable-uiviews-with-a-drop-shadow-tutorial/

Visually modifying a UIToolbar from xcode storyboard

I'm using XCode 4 and storyboarding an application I'm creating, however I cannot visually modify the UIToolbar.
I'm attempting to modify a UIToolbar that is inside of a UITableViewController - however I have to place the UIToolbar out of the correct hierarchy in order to be able to modify it visually. I've tried placing it onto the view controller area but that does not make it show up.
At one point I was able to make it appear below, as it's own object however I was not able to recreate that.
Once I was able to get it to look like this
Your UITableViewController is inside a UINavigationController, which already has its own UIToolbar—you don't need to drag a new one into your view hierarchy. Interface Builder can simulate the toolbar for you under "Simulated Metrics" in the inspector panel.
Once the simulated toolbar is visible, simply drag UIBarButtonItems into it. Use a custom item with a custom view if you need anything more complicated than a button or spacer.
If you need your toolbar items need to be dynamic, you can maintain a reference via IBOutlets without necessarily having them in your view. Then set your UITableViewController's toolbarItems property or call -setToolbarItems:animated: at runtime to display the appropriate items.
See Apple's UINavigationController Class Reference: Displaying a Toolbar.
To answer your question, the visual editor simplifies the setup of most controls, view hierarchies, and delegation patterns, but it's still up to the developer to make sure they check out. The implementation of UITableViewController makes certain assumptions and assertions about its view hierarchy that Xcode does not enforce through the visual editor. Given that your desired view hierarchy is unsupported, I have to assume that the editor's behavior is either undefined or irrelevant. For a workaround, see Maxner's suggestion.
UITableViewControllers only allow one view object, which of course is UITableView. UITableViews are not cooperative for subviewing and they usually push everything into footers or headers. Something like this isn't possible:
-TableController
-Table
-Subview
-Another subview
UITableViewControllers are reduced to this:
-TableViewController
-Table
So you will need to use a UIViewController and declare a UITableView in there. Heres the Hierarchy you should use then:
- ViewController <Table's Delegate & Data Source>
- View
-Table
- Your UIToolbar
In your ViewController.h declare IBOutlet UITableView and connect Data Source and Delegate to the ViewController. Then simply add the UITableView implementations to your .m file and you're good to go.

Resources