1

00:00:08,060 --> 00:00:13,240

Hey guys this is Caleb with slopes dot com and in this very short video we're going to set up our map



2

00:00:13,240 --> 00:00:18,160

you pen so that it is not red but instead is orange to match the theme of our application.



3

00:00:18,200 --> 00:00:20,380

So let's get started right away.



4

00:00:20,390 --> 00:00:26,330

Go ahead and pull open your X code project and we're going to actually use an M.K. map view delegate



5

00:00:26,930 --> 00:00:31,070

method that is just built in called view for annotation.



6

00:00:31,070 --> 00:00:36,510

And that's basically going to allow us to customize the appearance of that pin that gets dropped.



7

00:00:36,770 --> 00:00:42,470

So go ahead and type view for annotation and it should show up right here the top of the results press



8

00:00:42,530 --> 00:00:49,730

enter and inside of this what we're going to do is we're going to customize our pin to be a custom color



9

00:00:49,730 --> 00:00:50,960

which is very cool.



10

00:00:51,170 --> 00:00:55,600

So go ahead and type var pin annotation.



11

00:00:55,700 --> 00:00:59,570

And it's going to be equal to M-K pin annotation view.



12

00:00:59,570 --> 00:01:05,460

Now to make one of those we have to pass in two things an annotation and a reuse identifier.



13

00:01:05,580 --> 00:01:06,040

OK.



14

00:01:06,230 --> 00:01:12,760

The annotation of course is going to be our annotation and the reuse identifier is going to be drop



15

00:01:12,770 --> 00:01:14,330

a pin.



16

00:01:16,360 --> 00:01:20,570

Make sure that you're using the right identifier there.



17

00:01:20,860 --> 00:01:25,390

So next what we're going to do is we're going to set the color to be orange which is exactly what we



18

00:01:25,390 --> 00:01:25,720

want.



19

00:01:25,720 --> 00:01:33,920

So type pin pin pin Dippin Dots pin tint color.



20

00:01:34,390 --> 00:01:36,610

Well it's giving me an error here what's the deal.



21

00:01:36,610 --> 00:01:40,030

It's a problem.



22

00:01:41,260 --> 00:01:42,730

Oh that's because it's not called pin.



23

00:01:42,820 --> 00:01:51,260

It's called Pin annotation pin 10 color and we need to set it to be equal to you eye color dot orange.



24

00:01:51,280 --> 00:01:57,430

And you know what we could do that or we could do the really cool new color litteral feature in swift



25

00:01:57,670 --> 00:02:02,590

where you can literally click here click here and now I can choose my color so I'm going to choose the



26

00:02:02,590 --> 00:02:05,790

exact color from my interface builder.



27

00:02:05,830 --> 00:02:07,350

Really really cool.



28

00:02:07,610 --> 00:02:08,580

OK so there's that.



29

00:02:08,590 --> 00:02:11,050

The pin has been given the proper color.



30

00:02:11,080 --> 00:02:15,850

Now we need to do is we need to set it so that the pin annotation animates when it drops to the map



31

00:02:15,850 --> 00:02:16,100

view.



32

00:02:16,120 --> 00:02:22,120

So go ahead and type pin annotation animates drop and set that to be equal to true.



33

00:02:22,540 --> 00:02:29,680

Now that those two important properties are set we can go ahead and return pin annotation.



34

00:02:29,680 --> 00:02:31,960

Let's go ahead and build and run this to see if it works.



35

00:02:33,730 --> 00:02:34,610

I'm building it.



36

00:02:34,640 --> 00:02:36,060

It's launching.



37

00:02:36,590 --> 00:02:37,730

And let's see how we do.



38

00:02:41,760 --> 00:02:42,480

All right.



39

00:02:42,640 --> 00:02:47,680

So it looks like it's now dropping an orange pen where our location is which is you know it's OK that's



40

00:02:47,680 --> 00:02:52,010

not exactly what I want but let's try dropping a pin where we click double click.



41

00:02:52,060 --> 00:02:52,700

Awesome.



42

00:02:52,780 --> 00:02:53,670

Let's do it again.



43

00:02:53,830 --> 00:02:56,500

Double click double click.



44

00:02:56,590 --> 00:02:56,950

Awesome.



45

00:02:56,950 --> 00:02:58,090

OK so that's working.



46

00:02:58,090 --> 00:02:59,090

That looks great.



47

00:02:59,260 --> 00:03:03,220

But I want to prevent it from dropping a pen where my user location is.



48

00:03:03,310 --> 00:03:06,070

Thankfully there's a special class so to do that.



49

00:03:06,070 --> 00:03:12,800

We're going to go ahead and we're going to type if annotation is M-K user location.



50

00:03:13,150 --> 00:03:18,620

That's the blue dot we're going to go ahead and return whip's return nil.



51

00:03:18,890 --> 00:03:20,340

OK that means it's going to return.



52

00:03:20,350 --> 00:03:24,220

No annotation view it's not going to update the pin or set it to be an orange pin.



53

00:03:24,460 --> 00:03:29,290

Let's build and run it and double check that that works exactly as we were hoping.



54

00:03:29,290 --> 00:03:30,040

Oh and you know what.



55

00:03:30,040 --> 00:03:33,100

I think it's telling me that I should change it to let constant.



56

00:03:33,100 --> 00:03:34,680

That's probably true.



57

00:03:35,440 --> 00:03:36,300

Change that too a lot.



58

00:03:36,310 --> 00:03:42,190

We're not actually modifying anything other than some of the properties so change it to a constant that's



59

00:03:42,190 --> 00:03:42,760

cool.



60

00:03:42,760 --> 00:03:44,580

All right cool so our location is back.



61

00:03:44,590 --> 00:03:46,410

Nice little pulsating thing there.



62

00:03:46,510 --> 00:03:48,800

And now we can drop a pin wherever we want.



63

00:03:48,820 --> 00:03:50,820

And it centers on the map view.



64

00:03:50,890 --> 00:03:51,570

Amazing.



65

00:03:51,700 --> 00:03:56,890

So that is exactly what we were supposed to do make a custom pin that drops on the screen.



66

00:03:57,130 --> 00:03:58,120

That's very very cool.



67

00:03:58,120 --> 00:04:03,640

So in the next video we're going to go ahead and we're going to start animating up that view that we



68

00:04:03,640 --> 00:04:05,340

put at the very bottom of our map.



69

00:04:05,350 --> 00:04:06,790

Did you forget about that.



70

00:04:06,810 --> 00:04:13,060

It's down here hiding and when whenever we double tap and drop a pin it's going to animate up and then



71

00:04:13,060 --> 00:04:19,120

we're going to start processing adding a collection view and doing much more adding in our cool functionality



72

00:04:19,120 --> 00:04:24,190

for downloading photos so head over to the next video and we'll start on animating up that view.