WWDC2000 Session 126

Transcript

Kind: captions Language: en ladies and gentlemen please welcome Mac OS 10 applications technology manager David Wright thank you good afternoon welcome to session 126 cocoa overview I'm really excited to see how many people are here because this technology in this session is amazing in 1991 when I was in college I was taking a windowing programming class and I was working with x windows most of the time so mmm seeing what they were trying to do to get inheritance to go was pretty interesting especially to someone who was barely grasping pointers at the time and then we had a like a couple weeks where we were playing with other windowing systems and there was this black cube and we were told to do a programming assignment on that so just can I get a clap of hands of how many of you have used cocoa or played with interface builder or project builder yeah so I think half but my sound meter isn't always accurate well I was playing with this program called interface builder you you tell it what objects you want to work with and then you draw this line and it like hooks up all this messaging and I was just tripping out because it was amazing whoo I've never seen something like that so then I went on to be a Mac programmer and in 1988 I was assigned to work on the setup assistant for Mac OS 10 which is completely written in cocoa and here I was back using this amazing development environment so I have no problems I represent carbon and cocoa both are great but cocoa is like a true pleasure it really is like driving this amazing car that you know you just want to use it as soon as you can so without further delay I want to introduce Becky will rich from the cocoa application development team please give her a warm welcome thanks David Wow gee Toto I don't think we're in Redwood City anymore so hi my name is Becky we'll rich and I'm here to talk to you about the cocoa development environment we're gonna start out by looking briefly at what cocoa is I'm going to show you a little bit about how you develop a cocoa application and then we're going to spend most of our time talking about the core concepts within cocoa so by the time you leave this session you should be able to identify the main pieces within cocoa that includes listing the core classes involved in every cocoa application we're also going to talk some about the basic abstractions used inside of cocoa now I would love to go into the details of project builder and interface builder these are amazing development tools in particular if you've never seen IB you have just got to go to the session but PB and IB both have sessions of their own and I encourage you to go to those because we're just not going to have time to cover them here so hopefully you've all seen a diagram that looks more or less like this from the keynotes it's an example of the OS 10 architecture stack and it's pretty easy to see where cocoa fits in we're one of those development environments right up there at the top so what is cocoa cocoa is a set of frameworks designed to work together for application development so far so good it's fully featured it has support for all of the basic paradigms that you expect to see inside of an application environment so they support for things like cut and paste event handling full widget set full text system all of that is there there are also several powerful abstractions we export to make it easier for you to write your application but here's the main thing when someone asks you what is cocoa what makes cocoa different from the rest of the stack there's the answer cocoa is objects this is what differentiates us from carbon this is what makes us unique on this stack so what do I mean by that what I mean is that Coco is a fully set of fully object-oriented frameworks these frameworks have been designed and implemented in objects from the ground up the api's are exported in object-oriented languages both Java and objective-c and all the classes have been designed with the intent that you the develop the developer be able to simply extend them and use them easily so as I was preparing for this talk I was thinking oh my gosh what am I going to tell these people right here you're all Mac programmers you've already learned one very large API how can I convince you that cocoa is worth looking at so this is what I came up with we're just gonna see take a poll we're gonna do the little applause-o-meter thing and see if you can guess how many lines of code are inside of TextEdit TextEdit is a small cocoa application that does text editing it's sort of the cocoa world's equivalent of simple text so just clap when you think I've reached the right level how many of you think it's under 5,000 lines of code under 20,000 you guys already know the answer this don't you all right fine yes TextEdit is an example application it's under five thousand lines of code it comes in two 3300 by comparison simple text is seventeen thousand eight hundred over five times as large you can prove this to yourself by looking on your DP for CD where you can find the text edit code under system examples or system developer examples and just take a look for yourself well that's all very well and good TextEdit is as I said an example program what about a real program what about mail mail I hope you've seen in some of the keynotes that Steve has done he showed it at the Macworld keynote in January it is the premier cocoa app on the system and it's a full mail client let's start from the other end how many think it's over a million lines between 1/2 million and 1 million between a hundred thousand and a half million ok this isn't going to work so well between 20,000 and a hundred thousand you're right mail comes in at 65,000 lines of code which to me is pretty impressive I mean here we've got a full deployment application if you attended some of the keynotes yesterday you were hearing lion counts on the orders of 3/4 million or 1.2 million for a full production app so let's let's drill a little further into those 65,000 lines of code and mail of those 65,000 lines over 1/4 of them are just comments so we come out at under 50,000 lines of actual production code of those you can further break it down into a third of them going into the application itself the other 2/3 is going into a framework which is shared across several applications so not only is mail a very small application but we're actually reusing most of the code so to answer the question why cocoa the answer is that objects are powerful and this is going to read pretty much like you know the textbook speech on object oriented programming objects are easy to configure they're easy to extend via sub classing and other simple abstraction x' you can export many powerful abstraction x' and notions using an object architecture and it is ideal for code reuse the end result is that you the developer can do more with less code so when we were going over those lion counts I was talking to a co-worker of mine Mike Farris and he said you know 3300 lines is actually quite a bit we've got a lot of support for loading different file extensions and that kind of thing and we could actually do TextEdit in quite a few quite a much smaller program and I said okay well how small he said I think I can give you TextEdit in 50 lines I said Yeah right he said no really and we're gonna take him up on that challenge here today so with that I'm gonna introduce Mike Ferris and turn the stage over to him Mike live can you all hear me okay all right so we're gonna just start by creating a brand new project in project builder C we're up on the screen here and today I'm gonna create a document based application using Java so we'll choose the Java document based application template and let's just call this TextEdit light okay so what we start out with here is as you can see a couple of source files and a few resources we have two user interface files which are interface builder nib files and just to prove that we're not starting with a whole bunch of candy code I'll show you all the code that we start with here this is the little piece of C code that gets us bootstraps so that we can double click this java application and then this is the document subclass the subclass of the NS document object that we start out with by default represent our document in the running application exactly we'll have one instance of this object for each open document okay and you can see that we've started out with just some boilerplate code there's a few methods where we're expected to fill some stuff in that's not gonna leave you with very many lines no we've started out with what 30 or so already so I'm already behind so first though let's do the interface okay and we're gonna build the interface in interface builder we've started out with a nib file that's gonna be instantiated once per document it's called my document dot in the episode we'll just open that up real quick and interface builder so this is going to be the window that's going to display the document to the user exactly okay now we'll get rid of the little placeholder text here and instead we're going to add a text object off of the pallet and let's bring the inspector up here and configure this just a little bit we'll take the border away turn on undo should always be able to undo and let's make it so that when the window changes size this textview will change size as well and then let's make it fill the window too okay so starting to look a little bit like a text editor here now the other thing that we're gonna need is access to our text view from our code so let's go to the classes tab an interface builder here and in our document class we've already got a pointer to the window but let's add another one so let's have this instance variable that we'll just call my textview and we'll go back to the instances tab and let's actually make that connection so we've told interface builder that we have this instance variable called my textview and that we've also told it that this is the textview so the documents gonna be able to reach its interface exactly what will happen is when the document loads this interface part of the loading of this interface file is going to cause the instance variable my text speed my textview to be automatically initialized to point to the textview that came out of the nib so when you say load the interface file I mean are you generating code here no actually interface builder files are not code we're not a code generator in fact what you're manipulating here is all live objects and then what happens when you save this is it's just going to serialize all those objects just like Java serialization that kind of thing basically okay so all right we're done with the interface we've made our connection we've set up our text view now I'm not going to sit here and let you watch me type so instead I've got kind of a pre done version of this class and we'll just get rid of the one that it that we came with here and instead let's go and add in the one that I've already got in My Documents folder here now you better walk us through this so that you know we know you're not loading libraries on the side I think I'm gonna be sneaky all right well let's let's put this in here and then I'll show you now in fact this is almost identical to the code that we started with and what I've added I've added a couple of instance variables first we see the my textview instance variable which is what we hooked up an interface builder and then we also have the text storage instance variable the tech storage class provides the backing store for our text all right now mostly this is all the same except when we get down to about this point let's start from the bottom and we're just gonna I'm not gonna walk you through this line by line but briefly these two methods are concerned with saving and loading the file I think I saw those in the template yeah - were there an empty in the template that we started with I just okay and notice that we're not running save panels were not writing files we're not doing any of this all that you really have to do in a document app is be able to provide the data that will go on the desk and take the data that was on the disk and initialized from it so we're just working at the level of a bunch of bytes that came off the disk we don't know how they came off the disk they're just here now the next method that we started with in the template just empty in which I filled in is this one this method gets called whenever the document loads its interface so we're going to take that opportunity to make sure that the text view is displaying the tax that we loaded from the disk or whatever right so we'll just take that opportunity to sync everything up and we do that with a new method that I've added so this is the one brand new method I've added to this class and all it does is it makes sure that the textview is showing the contents of that text storage object so you're just kind of updating the backing store in the front end and exactly okay now that's all the code and we're almost ready to run this thing but first we need to make sure that the application knows what kind of files that it's going to deal with we haven't told it that it's an RTF editor yet so we're gonna go into the target editor and in project builder this is where you edit your info.plist stuff and if you've read some of that system overview book you'll know that the info.plist is where your application is going to advertise what file types it understands now finder uses this information to know what app to launch when you double-click something in addition the Coco document system uses it as well to know what kind of documents this app understands so this is just sort of publishing what kind of types of document you want to handle right and so we give it an abstract type name which would just be something you know basically unique we can also tell it what file extensions this type is associated with and also what Mac OS types okay so we're kind of hooking up the extension with the type creator with the mime type all of that right rolled together okay so and then the other the only last thing in here is that in Cocoa apps you'd have a key that tells you what class in your application is to be used to display these documents and in our cases this my document class that we are going to use so that's it and now I'm going to go ahead and build and run this thing so you're telling me you're done I am done I didn't see any code in there to control the menus or the menus oh look I didn't say if the interface builder found okay so the menus are already all hooked up in the template and you get basically a standard menu bar when you create this thing and that includes all sorts of menu items for dealing with cut copy paste and all the rest of that kind of stuff well we'll just see won't we okay why don't you take project builder off the back of that oh yes let's minimize that let's minimize that okay so here's our program okay now when we were preparing for this I created a list of some simple text features that I would really like to see in this text editor so you'd have the slides back on one of these thank you okay let's start out real simple just prove to me that you can answer rich text up there okay well let's let's go to the font panel for that koko has a built in font panel that all apps can make use of and of course is integrated with the text system so we can do things like change the font size and change the font maybe we can set that to be italic okay what about paste board clipboard kind of stuff can you copy and paste sure of course so let's copy that and maybe we can paste it you can paste it a few more times okay how about ruler support well Cocco also has a built in ruler which also is integrated with the text system so we can just tell it show me the ruler and here it is you can see that we have tab stops and margin settings we can set the alignment we can do all the things you'd expect to do from a ruler all right how about how about colored text I didn't hook up any color panel or anything the cocoa color panel also is integrated with the text system so we can just go in there to set the color of the text we can use the apply button to okay most of the code you wrote had to do with saving and opening documents so let's just make sure that all works okay so we can save you'll notice that we have a sheet already the document system run saved panels of sheets like it should so you get that all just automatically we can just type in a filename and tell it to save and you'll notice that the title bar updated to show that we've now got a name to document okay why don't you close and reopen that just to make sure we can reload files okay there it is there it is and we just open it back up okay undo probably need code for undo well we actually if you were paying attention I turned on the undo in the interface builder file there and the text system supports undo in itself but also when the text system lives inside of a document it'll automatically hook itself up to the documents undo and we'll get per document undo in our text system automatically so like I'm just making a couple changes here so we'll have something to undo and you can see that I can do undo I can do multiple levels of undo and redo I'm running out of stuff here that wrong direction let's try again there we go all right that one's not really fair I mean ligatures in kerning you'd only really expect on a real publishing package well if you look closely we actually have ligatures already the tech system will use ligatures when it's appropriate just automatically you can also tell it that you'd like it not to use even the default ligatures for example and so we can split that fi apart we also have support for track kerning so you can go ahead and just tighten that line up a little bit this is getting harder spell checking spell checking well turns out koko also has an integrated spell checker but to show that we're gonna have to actually have a misspelling okay whoops and so we can just bring up the spell panel just bring up the spell panel exactly now this spell panel like a lot of this other stuff is pre integrated with the text system but it's also available for you to use in your own ways and your koko app so we can just go ahead and tell it to find and it found our word and it even knows how it's supposed to be spelled so we can just correct that and move on okay all right japanese text all right well the koko tech system is based on unicode and it's also integrated with the TSM input management stuff in Mac os10 so all I really need to do is go up here and change the Japanese and now I have to apologize if this turns out to be a swear word or something I don't actually know Japanese it looks like the font panel automatically picked a Japanese font for you there right the text system knows what characters can be displayed in what fonts and if you are typing in Helvetica say and start typing some Japanese characters that can't be displayed in Helvetica it's going to go out and look for another font which is similar to Helvetica and use that instead alright how about a recent documents menu that is that can't be standard in the template all right well in order to show that let me actually do a save as for this guy so we'll have played with a couple of different documents here so we'll just save this guy as text to attest to and now you get an open recent menu just automatically and it's our it's hooked up so that anytime a document is opened or saved that document will end up in the open reasons menu for your application so I can go over to the original one that we saved earlier and just open that up that way Wow all right you got me however there is one important piece of every application left that I'm sure you haven't hooked up what's that do you have an about box sure the template comes with a standard about box which of course you can replace if you like but we have an about Wow 50 lines huh that's it actually it was 51 if you count the blank lines I think all right thank you very much no problem Wow all right if you are not now convinced that Coco can do a lot for you I give up I don't know what else to say I do have a couple points I want to make about that demo obviously we are leveraging a couple different subsystems within Coco pretty hardware those subsystems are the document architecture and the text subsystem both of those are subsystems of several different classes designed to work with each other all of them design for sub class ability and ease of use if you're interested in them I highly recommend that you come to the in depth talk on Thursday afternoon because Mike's going to be back talking about the document architecture and my manager ollie is going to be speaking on the text subsystem the other thing I want to point out is that this is not a 4gl kind of thing where you get to take it out of the box and use it exactly as is or or you can't use it for your purposes to give an example of that the text subsystem is used by a couple different applications in dp4 and on Mac os10 one is male which uses it pretty much without modification male just wants to be able to edit rich text for your male another one is an HTML editor that's used by the web objects folks and there what they've done is they've heavily subclassed and extended the text subsystem which is designed to work as you saw with RTF but they have been able to extend it to create a full HTML editor alright moving on we're gonna we're going to start talking about the pieces inside of cocoa now there are basically two components inside of cocoa Foundation and app kit and you can see how they lay here foundation is the lower level it provides all the basic object infrastructure that you would expect it does not use graphics at all and then the app sits above foundation and also above quartz OpenGL QuickTime the entire application services stack so I'm going to spend a moment now talking about foundation in detail as I said foundation establishes the basic object paradigms within the cocoa application that includes all the basic classes for storing and manipulating data as objects it lives below the graphics layer and you can't actually use foundation without the kit to produce something a faceless application something that needs to run in the background and and never presents a window to the user so if you look at the classes inside of foundation they basically fall into these three categories you have basic classes for storing data and for holding the data together in collections like arrays and dictionaries then you have a set of classes that are designed to act as object abstractions on top of the operating system so you don't have to drop down to the POSIX layer or to lower lever lower layers in the operating system and then finally we have support for internationalization and localization so let's just start with the storage classes very briefly the Leafs are NS value which stores a numeric value NS string which stores a string and NS data which can be used to store an arbitrary bag of bytes those can be combined together into collections like NS array which is simply an array of objects or NS dictionary which stores the objects and key value pairs all these classes can be combined together and what we call a property list and what's nice about property list is having combined together this fairly complex tree of objects you can then write it out as a plain text format and read it back in very simply there is also an XML format in addition to the traditional ASCII format that's available through corefoundation and what we found historically is a property lists are ideal as a small flexible data store for data throughout the system Mike alluded to the info dot P list that's a property list and is used to configure your application and expose it explain how it should be represented to find her into the other applications on the system we also use the property list to store all of our user preferences there are a number of small eunuchs ish configuration files that are expressed as XML property lists and we even use it as a communication medium on the pasteboard property lists are really cool and I'd love to tell you more about it still but I'm not gonna have time and so I'm just gonna point you to the core foundation session where we talk about property lists in greater detail okay the next categories OS installation there are a number of classes there for handling things like file access I have a list up there process men management so you can get keep track of the different threads in your application you can for CAPA fork off additional tasks and you can get the information that the operating system has collected about your process we also have mechanisms in there for cross thread and cross process communication and I've just listed two internationalization we consider internationalization and localization extremely important in cocoa and for that reason we've included in the included it in the basic classes inside of our lowest layer which is foundation so NS string which is what we use to represent all strings in the system stores its characters as Yuna cares it has support for converting to and from all the different encodings that you would expect and we use it everywhere in our API is in place of care stars on the localization side we use NS bundle and nsuserdefaults perhaps you've heard about the app pack of the new application packaging model NS bundle is what allows you to go in and take the pieces apart you can specify all of your resource files by localization by language as well and then NS bundle allows you to retrieve the proper one at runtime based on the user's preferences the users preferences is where nsuserdefaults come in and as user defaults defines among other things several different localization defaults which are stored per user so you can quit so NS bundle will for you look up the correct localization for the current user and load the correct image for you that's all the time I have to spend on Foundation and I want to move on now to start talking about the kit because this is really where you're going to see the heart of the interest structure for your application so the kid is where we have the entire infrastructure for drawing and event handling in a cocoa application in addition to that infrastructure we provide all the standard controls is ready to use out of the box as you saw there's also a sophisticated text engine in there all the standard dialogues are up there we tend to call those panels so there are things like the color the color panel save panel font panel open panel all of those things that you saw in text edit light and as I said before app kit relies on foundation for its object structure and the application services layer for its graphics and event handling so what I'm going to do is walk you through the core classes in the kit and then we're going to spend a little time talking about the abstractions inside the kit whenever I talk about the kit I talk about these classes as the very heart of the apt its class hierarchy and its object actually comes from foundation it's our abstract superclass all objects inherit from nsobject the other ones which appear in purple are the app kit classes and we're going to talk through those one at a time starting with NS responder most of the classes inside the kit inherit from an S or in one way or another and s responder provides all the infrastructure necessary to respond to user events and they're going to arrive to the subclasses as methods conveniently named to explain what kind of event is coming in so you you have a key down method and a mouse moved method and so on and when you want to customize the behavior of a particular thing on the screen in response to an event you just override the relevant method all responders also maintain a notion of the next responder the next responder is the next item that's going to get a shot at the event if you don't want to handle it and in this way events are passed throughout the objects in your application through what we call the responder chain one of the subclasses of NS responder is in its application aniss application is concrete where NS responder was abstracts and you would never instantiate a plane anis responder on the other hand there is a single anis application instance in your application this instance is what is responsible for managing all the communication with the rest of the surrounding system with the dock with the Windows server or yes with the Windows server and so on and this application also maintains a list of all the windows inside of your application and it's responsible for running the apps main event loop run loop and during that run loop what it's going to do is it's going to receive an event from the Windows server take it apart look at it and say oh this needs to go to window X and hand it off to window X which brings us to the next class NS window and s windows reserved screen real estate for you NS windows do not themselves draw but they handle the necessary coordination between other windows and other applications to reserve space for you to draw when an NS window receives an event it does the work of translating the raw event into the correct responder method and then handing it off to the correct responder to process the event well the events usually come in one of two kinds they either have a location associated with them in which case they're going to go to whatever responder corresponds to that location inside the window or there's something like a key event which don't have a particular location for that second kind of event NS windows maintain a special instance variable called the first responder the first responder is that item inside the window that gets first crack at key events and that first responder will change is the application as the application runs and the user clicks in different text fields and so on okay the final NS responders subclass I'm going to talk about is NS view like NS responder NS view is an abstract class and it adds the necessary structure for drawing to the screen it's very simple you just override the draw rect method on any NS View subclass and that's where the drawing is done the views live inside of hierarchy inside a window so every view has one super view and potentially many sub views sub views are automatically clipped to their super views bounds and NS view is where you're going to find all of the basic support for the UI notions that your users are going to expect things like drag and drop context-sensitive menus tooltips what you would do if you were interested in one of these sub systems is you'd open up NS view find the set of methods that pertain to the particular piece that you're interested in and just override those as directed by the documentation so I said NS views draw that doesn't mean that you're kind of left without recourse and draw rect and you suddenly find yourself twiddling bits on the screen we provide a number of objects inside of the inside of the kit to help you with your drawing at the top of the list here we have NS image rep string and attributed string all of which know how to draw to a particular location and as image provides compositing support so that's how you get transparency as well as a number of special effects and compositing images over one another and a spazzy a path gives you abstract drawing in sort of the PostScript sense where you're drawing lines circles rectangles paths and as color an NS font allow you to set the correct color and font in the current graphics context and finally NS cell allows you to encapsulate bits of drawing for reuse in several different locations or by several different views we also provide a number of concrete subclasses of NS view ready to use in the kit NS text view is one such that we saw in text edit light here I've composited together a number of images that show a number of the different views on the system so in the frontmost window we have an out and NS outline view being displayed inside an NS tab view behind that you can see NS ruler view in an NS text view as well and at the very back we see an NS table view being used inside of mail so now that I've walked you through the basics of NS responder and NS view you have the pieces you need to respond to events and to draw at this point I'm going to invite my manager Ollie Ozer up on to the stage and he's going to show you a simple application that uses those two pieces Holley okay so I'm so I'm my example here the demo I'm going to show you is going to approach the applicant at a much lower level than Mike's example did basically as Becky said we're just going to show you how the subclass NS view for the purposes of modifying the way draws and modifying the way it handles events there's many other things you can do in an S view you know tooltips drag and drop and etc we won't go into all that but it's it's gonna be equally easy trust me so like Mike we start off with project builder we go ahead and create a new project this time I'm just gonna create a cocoa application not a cocoa document based application because we're just creating a one window very simple application it's gonna ask for a project name let's call it dot our goal here is to create an application which when you click somewhere draws a dot there and when you click elsewhere it just moves the dot to wherever you you clicked so that's it okay so there you go it created a template for us now in this case the template is really simple we got no classes all we have is the main file that Mike's application also had and other than that there's nothing else it's also give us an interface builder and NIP file like Mike's program did because all cocoa applications have a nib file at least represent the menu and then of course it can represent windows and panels and so on so that's all we get here now again just so that I don't end up typing lots of code I have the code written up already let's go ahead and say add files and we have a class file and a header file now Mike showed you Java and I'm gonna show you objective-c at the risk of scaring some of you who might say what is that objective-c is really it's the origin language that cocoa used to use and we've added support for Java over the last four years objective-c is basically a superset of C and it's very simple and you'll see it's just a little syntactic addition to see that allows you to have a dynamic runtime and message sending that's fairly powerful so I'm going to add these two files to my project we want to copy them into the project so there there you go so first I'm going to show you the H file the H file is where we declare our object and tell tell the system we build a compiler what it has in this case we're importing which is the same as including cocoa dot H which is basically what everybody includes and then here this is Objective C ways or what the way Objective C declares an object dot view which is our view is a subclass of an S view in addition to all the instance variables and s you might have and all of the functionality in su has we add three new instance variables a variable that declares where our dot appears a variable that declares the color of our dot and the radius of our dot so we have these three properties in our view now let's go to the meet the class file for for dot view this indicates that's implementation we basically first override the in it with frame method which is the constructor if you will for for the NS view class here we basically tell the superview which is an flr superclass and s view to create itself then we simply initialize the three instance variables that we have it's a good idea to initialize our instance variables basic object and programming so we set the center point to 50 the radius to 5 now notice that color is another object it's an NS object it's an NS color and Becky mentioned that that was one of the objects we use for drawing we basically get one of the pre-built colors a red color and we'll retain it basically we hunt and hang on to it because it's a property of this view so that's that and the other two things we do in this example is draw and handle mouse up the draw rect method which Becky talked about is basically where you override to do your custom drawing in this case we simply get a white color and set and then draw our bounds and Bezier paths with rect basically draws a rectangle in this case we just fill the whole bounds of our view with white and then we go ahead set the color we have in this case it's and then we create a rectangle which is a cone to the size of the dot or on a draw and then we draw an oval with that shape now oval that's square within a square is circle so we get a circle and then we fill it so these two lines draw white and then put the dot where the center is and finally our mouse up method now in an ester you can override methods like Mouse up key up Mouse drag etc to handle various events in this case we're just interested in Mouse up and all we want to do is we take the location of the event which is in terms of window coordinates and using this method we convert it to the current views coordinates and this takes care of whether the view is scroll that's magnified whatever and this gives back our center point and then we simply call this method which tells the view that it needs to be refreshed and the next whenever it's appropriate we will redraw itself refresh itself so that's it as far as the code goes now we just like Mike did we also need to change our interface file let me hide project builder here now I just open my interface file in interface builder in Mike's case he dragged a textview in our case we are creating our own views so we're going to drag this view that says custom view basically here we're saying we're not building a pre we're not using a pre build object we're using our own object let's make it as big as the window here let's make the window a little smaller now we also want to tell the system about this view so we go to the classes tab we choose an S view and we say sub class and we specify that it's dot to you there are two ways to do this you can either enter the class name and properties here or you can actually parse the header file in this case I just want to show you how you do this so now dot view is known to the interface builder runtime so we go back in here we'll bring up our inspector and we specify that this view is really a dot view and as you can see a change into a dot view I think that's all we really need to do one more thing we can do is maybe go to the size inspector and make sure that whenever the window resizes the view resizes there a lot of other properties you can set this is the only one I will do I will save and I will hide let's go back into project builder and I think we're ready to go so I will just say build okay we're done so let's run this let me hide project builder so here's our application as you can see the view is there the view is white because we told to draw a white background I hope you can see the difference between the pattern here and there's our dot at location 50/50 so as I click around the dot basically moves to the new location the center is updated the view is told to update and there you go now if I draw in the corner here on the side you see that's clipped to the bounds of the view because automatic but by default usable clip in addition if I put the dot here and I resize my window you see that the view is resized and the dynamic resizing takes care of everything for you and the view is constantly redrawn using that draw rect method so there you go that's pretty simple demo of event and drawing handling so great thank you sure okay so we have one last class to talk about in the core app kit hierarchy and that's NS control as a subclass of NS responder and as control inherits all the basic infrastructure it needs to handle events and as a subclass of NS few it inherits everything it needs to draw so control combines those two concepts to to add this notion of being triggered or activated by user events every control defines what it means for that control to be activated and at that point it's going to do something special it's going to send its action method to its target object so target is a very special instance variable for controls it's usually connected to one of your objects whatever object you want to respond to the control being activated and then the action method tells the control what method should be invoked on the target object so some simple some simple examples of controls are things like buttons or text fields that need to be triggered when the button is clicked or when the text field is edited so as I said when the control is triggered the action method is sent to the target object very simple so what happens if the target is null well this does not mean that the action is lost instead this is the kids or this is the control saw a signal that the action needs to be sent through the responder chain starting with the first responder of the frontmost window so some common examples of null targeted control no targeted action methods would be things like cut and copy other menu commands would be very similar where you really want whatever happens to be front most to respond to the action like NS view NS control has a number of sub classes provided inside of the kit ready to use without modification I've just listed some here starting with the very basic ones like button slider text field color well and s matrix and NS scroller are somewhat more sophisticated matrix lays out a grid or array of buttons or text fields whatever you want and a scroller is what you see at the edge of a scrollview to allow you to scroll through this the views contents and then we have some very sophisticated controls like NS browser table view and outline view which allow you to display display huge amounts of data so I'm going to ask Ali to come back up here and extend dot view a little bit and show us how controls work Ali it's usually upper management which changes the future set on you but in this case I guess Becky is the slave driver okay well we'll make a better dot program here okay so let's see we're going to do two things two dot view it has three instance variables Center radius and color we're able to change where it appears by clicking now we'd like to change the other two attributes of the dot its size and its color okay so let's go back to our dot view there you go it's the same dot view we used before now again I put the code in the oven earlier and it seems to be ready I will just copy paste out of here back in here and I will explain what it does so we want to be able to modify the attributes of dot the dot the radius and the color so we have two methods one of them is called set radius one of them is called set color now the target action methods typically always have one argument which is the sender and the sender could be the UI widget the UI control which cause that action to be sent so if the button was clicked the button is gonna be the sender exactly okay now in the case of radius typically the control that you're going to use is going to have a floating point value you know seventeen eighty nine forty two whatever so in this case set radius gets called and we set our radius loop instance variable from the floating point value of the sender and the sender can be a text field as slider or whatever okay so we just asked for its floating point value and that's the radius and then just like we did earlier we tell the view that needs to be displayed because the parameter some parameter has changed now color is a little more little more sophisticated the sender is going to be something that supplies a color because we want the color to be changed now Becky talked about in ass color view that's one view sub which is a control which can provide colors it's tied to the color panel and it based on changes in the color panel it supplies colors and because colors are objects we first release that is the allocate the previous color we had then we get the new color again from the sender and we retain it we hang on to it we use reference counting in Cocoa and basically you see that in action here and then just like the radius method we tell the view set needs display so that's all the changes we need to do to dot view and we also have to change the interface though so let me hide project builder bring interface builder back up okay so here's our dot view let's clean up the window here let's move the dot view up to make room and let's bring our palette back okay as you can see there are some default elements here the pre-built objects as I mentioned earlier so let's use a slider to indicate the radius and I'm going to go to the inspector here and change the sliders properties I'm gonna make it go from a minimum of one default value of five to a maximum of say 300 okay now to set the color we're going to use a color well which is this little widget I'm going to put that here and this basically is fairly straightforward it's ready to use now there are two other things we need to do which is to tell in tell interface builder what the actions that this dot view has and we do that by going back to our little classes inspector here and control clicking to get up a context menu and saying we're going to add actions that will put us into this mode where we're able to add actions and outlets so let's add actions the two we added were set radius and set color now as you can see dot you now list set color and set radius in addition it lists facts and print which are action methods inherited from view they're always there ok so I think we're done here you want to build those connections pardon build the connections oh yeah that's right we do want to build a connection yes ok so we told dot view what it does we added our action things now we want to form the connections now if we didn't do this it would have been very apparent when I ran the program to form connections you ctrl click and you drag so the slider is connect to the dot view and the message we want to invoke is set radius and the color view is connected to the dot view and the action one that sent is set color so when this is invoked will send set radius when that's invoked set color pretty straightforward we'll save here and we'll hide let's bring project builder back let's build okay it's done let's run so there's our window again this seems to be a regression full regression testing indicates it's still working and that's good let's test the radius oh yeah look at that so it says it's test this radius says set needs display yes in the view system eventually displays it there you go let's also try the color bit when you click on that the color panel pops up because one way to modify the color here's obviously the color panel and as you move the color in the color wheel the color over there is changing as you can see again the action is being sent and everything happens and I think that's all I want the show great I'm telling you you got to watch management they stopped they stopped coding and everything goes well and then they start using terms like regression testing okay so let's move on now from talking about the basic classes inside of the kit to talk about some of the abstractions that we use to make it possible for you to extend the functionality already there we already talked about one we talked about target action that's an abstraction provided by controls to make it easy for you to customize the behavior when a control like a button is triggered two others that are very important our notification and delegation and then finally I'm going to talk a little bit about some of the data abstractions we provide direct inside the kit so notifications is actually a concept that comes from foundation and we we use it to broadcast events throughout an application or to other applications the basic idea is that when something important happens you want to notify other people who are interested in it so the kit defines a number of custom notifications and I've listed three of them here things like NS window will close and its application will terminate or NS text did begin editing and you can see here the idea is that some major is some major piece inside your application is about to do something important the way notifications work is they rendezvous via the notification center so people who are interested objects that are interested in hearing about these notifications go to the Notification Center and register themselves as observers you would say something like I'm interested in knowing when a window closes this is the window I'm interested in and this is the method that I want triggered posters then when they wish to post go to the same Notification Center and say please send the notification and s window did close the relevant object is this one this window and then they can also provide a dictionary of additional information if there's any extra information they want carried with the notification a very similar concept is delegation delegation allows one odd to act on behalf of another so several of the different kit classes support delegates the idea behind this is to allow you the developers to avoid sub classing just because you want to provide a small amount of customization we do not think it is appropriate to subclass NS window just because you want to detect when the window is closed and provide a little custom behavior at that point by not sub classing you can do this in a much lighter weight lighter weight way and you can this also allows several objects to share a single delegate saving on memory size unlike notifications which are strictly passive delegate the delegate object is allowed to affect the process as it takes place so whereas we have the notifications NS will NS window will close and NS window did closed the matching delegate method is window should closed so when the window goes to closed it will send the delegate the method the method window should closed at that point the delegate can do whatever it wants and ultimately will return either yes meaning allow the window to go through its closing procedure or no the window must remain on screen so to implement a delegate you need to choose an object on your side to be the delegate and you need to choose the kit object you wish to delegate from look up the class for the kit object you will find a list of delegate methods available to you read the documentation and figure out which of those methods are of interest to you and override only those once you're done with all of that just call kit objects set delegate passing your objects your objects reference okay now like I said delegation and notification are very similar concepts there ways that your objects get informed about important important things happening in the user interface but there are some very important differences notification observers are strictly passive they are merely being informed that a change is taking place delegates on the other hand are passive are active and permitted to interfere with the process and even prevent the chain from taking place as a side effect of this there will only ever be one delegate for a given kit object on the other hand there are as many observers as care to register with the Notification Center and you'll see this difference in the naming as I said notifications usually have the word will or did in the name to show that a change is about to or has just completed taking place delegate methods tend to be named should and have a return value that the delegate can use to prevent or change the behavior of the change that was going to take place all right that's all I have on notifications and delegation now I'm going to talk a little bit about the data abstractions inside the kit by and large the kit is centered around drawing and event handling so most of the classes in there are subclasses of NS view or NS responder as I said however we do provide a few pure data objects and those surround these data abstractions I've listed a few of them here and it's document is the heart is kind of the central most class in the document architecture it's what Mike used to represent that text document in memory and as image and MSN s image rep are used to represent images and the multiple representations that they may have and as font is an abstract representation of a font and as a tributed string allows you to store attributes over a string so beyond just the characters you can mark particular regions as as having particular attributes like italics like a particular font and then finally NS color which we saw in dot view represents a color so when you look at a cocoa application and it all comes together this is what you're going to see there is a single NS application instance which handles all the communication to the rest of the system as a whole it also maintains the list of windows inside of the application NS applications have a delegate which which you can choose to implement and it's windows have delegates again which you can connect and and choose to implement and then those objects are going to talk down to whatever data objects you use to represent your internal your internal data the things that are peculiar to your application if we close if we take a close-up look on that window we can see that inside the window there are a number of views being displayed one of which might be a custom NS view like that dot view that we used you might also have a number of concrete subclasses of NS control that are kit objects that you're using directly from the box all of those are talking down to the layer below it which I've represented here simply as a window delegate it could of course be several different objects of several different classes and then off the bottom that talks down to your data model underneath all right that's all I have to tell you today about the kit and about foundation but I am going to give you a couple pointers for where to go for more information the first of the first of these is documentation you would be just amazed at how much documentation is on your DP for CD you can find the release notes there there's overview documentation which goes through everything I've talked about here as well as a number of other different concepts there are programming topics that you that are covered in depth in particular documentation files the class references are all online they give a complete list of all of the methods on on the different classes and what the methods are used for and then finally there's a fair bit of example code including the TextEdit application which I mentioned earlier to find the documentation look in system developer documentation cocoa all of that is also available on the web at developer.apple.com tech pubs and the example code can be found in system developer examples app kit alright finally where do you go from here these are some sessions that I think are worth taking a look at cocoa in depth is the follow-on session to this one as I mentioned they're going to be talking about the tech subsystem there as well as the architecture and another number of other more complicated concepts that we did not have time to discuss here cocoa update is where we're going to talk about what's changed since we met here last year just a word of warning that talk does assume that you are already familiar with cocoa as it appeared in dp1 last year which does not mean you should not go just because you know you're not familiar with cocoa just a warning that you might find yourself a little a little in a little deep the next line is a mistake you're not interested in core foundation advanced you're interested in core foundation basics that's 124 in Hall a one tomorrow morning at 10 I believe and that's where you can find out about property lists in greater detail and then again product builder and especially interface builder are definitely worth taking a look at if you're not familiar with them and how they are used and I've listed there two sessions they're two introductory sessions here finally I'm going to invite David right back up on stage David ah there we go and he's going to take us through the Q&A as well so if you want to start getting to the microphones in the aisles that'd be great great thanks Becky thanks you guys for the demos let's give it up for him you