Very good.
So I hope you were able to create a striker called Cell row which will be responsible for displaying
each row here so you could customize it and add a few things and so forth.
No worries if you were an able to do that because you know we are going to do this.
However I do recommend you to actually follow through.
Whenever I give you an exercise or challenge because that's how we learn All right let's create a views
here and you folder views and inside I'm going to create a new file.
It's gonna be a swift UI file and I'm going to call this cell row like that.
Very good.
So there it is.
I don't need this preview there because it's no use to us at this point.
All right.
So we have our cell row and he says hello world.
Very good so our cell row here we have the body what I'm going to do.
Let's create an H stack such and this H stack and pass passing alignment gonna make its center and spacing
is going to be about 9 and content I won't pass anything for now.
All right.
And then I put a v stack inside so what I'm doing here is I'm stacking all of the views so that I can
be able to add other information for each row.
So I'm gonna have an alignment to leading and spacing and I'll just get rid of all of this.
And next I'm gonna add another v stack.
Yes I know how it looks.
The V stack indeed.
And then I'm gonna put a text such as in this case here.
I want to first add the magnitude.
So in our text here this is where I'm gonna pass place or whatever we want to pass.
So let's go back to our content view here.
So essentially I want to be able to do something like this but notice one thing here in order for us
to access the data and properties in place or anything else we want.
It's possible to do this here because we have access to our data object.
That means then we will have to do the same.
For this to work inside of our cell.
OK.
So here I'm gonna say something like data is gonna be features like that.
So then I can say something like data properties.
Notice that I'm able to go and find all of other objects inside.
So if I want to go and get data go to properties object I can go and get whatever field I want I can
go to geometry which I can get coordinates.
Right.
And so forth.
That is the beauty here.
So I want to go to properties that right now say properties and I want to go and get string place.
They will go see the beauty again and I want to go and fetch the place right.
So I'm saying I want to go and get this place their properties that place.
OK very good.
So now I can call this cell in our back to our content view.
I can just go ahead and comment that out and call our cell row like this and I need to pass some data
today and I'm going to pass is going to be data of course.
Right.
Which is actually being passed in here.
So if I save this and ran we should hopefully see something still working and while everything works
fine just like it did before but at least we know as I always say that we are compromising or refactoring
our code.
So this is real good.
Now let's go back to our cell row here and do some more work.
So what we really want to do here is instead of adding place I want to add the magnitude meaning I want
to go and get let's see where is the Mac.
There is the magnitude field well to do that I'm going to just replace this instead of place just say
mag like that but we're going to have a problem of types.
Remember mag is of type double in fact if we go back to our data type we go and see that magnitude is
a double.
Right.
So the problem arises here is that well text requires a string.
So we are going to put that inside of a string to say Okay just take this to convert this double into
a string which is needed for our text.
And then you go ahead and make these bold and give a foreground color of gray.
That way we are able to actually see it and then font I'm going to make this headline.
OK very good.
And what it can do because I mean sort of these stack here I can even make this better by adding a frame.
And as you know by now with a frame I can add a width of about 100 in the height of also about 100.
Right.
And then I can continue I'm going to say I want to add a background pass a color and say green let's
save this and run and see what's going to happen now Oh look at this.
Now we have all the magnitudes showing for each earthquake that has happened in the last hour or so.
Right.
So maybe this color will we go back to white.
That makes sense because we have a nice background that very good.
Very very good.
So continue here because I want to make this a little bit better because this is to blend right background
is square.
How about overlaying maybe put a circle clipped and so forth.
So what I'm going to do again this is reason why we had all of these nested stacks.
We're gonna go outside to these mediums these stack there which you can see and hear and going to see
clips shape.
And when I pass I wanted this to be a circle like this.
And I'm going to pass an overlay over that circle.
I'm going to pass another circle and I'm gonna say I want to add a stroke which we need to pass a color
to be gray and the line width.
It's going to be about 1.
So not too thick.
OK.
And then I'm going to say hey you got a shadow of radius about 10.
Let's give it a run and just like that you can see that it looks much much much better.
Of course you can always change the colors and maybe the fonts and so forth.
OK.
So continue.
Let's go ahead and create another these stack right after our shadow here.
Notice we're going to be still inside our main H stack.
OK so here I've put another v stack because I'm gonna be stacking a few things here.
There pass a text in this tax here is gonna go to data.
I'm gonna go to properties again and I want to get the place.
This is where I'm going to add the place we've seen before foreground here.
I'm going to make Gray and make these bold
and wilder looking really good.
Okay.
Puerto Rico pretty that too.
That's pretty high there.
Very nice.
So still making real good progress.
Now this keeps popping down here and we can get rid of that if we want to by going back to our networking
manager.
Because this is where we are printing it out.
Now we don't need that.
I just go comment that out that way we don't get bothered by always seeing the console like a bottom
there.
Very good.
So in the next video what are we going to do is we're going to go ahead and get this time and we are
going to convert this time into something that is actually readable for humans so that we can actually
see the date when this happened this earthquake.