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