Explore
For Enterprise
Join for Free
Log In

艺术与人文
商务
计算机科学
数据科学
信息技术
健康
数学和逻辑
个人发展
物理科学与工程
社会科学
语言学习
学位
证书

浏览 Coursera 的全部课程

浏览
搜索
企业版
登录
免费加入

Case Study: To Do List Part 6

Loading...

iOS 用户界面设计最佳实践

加州大学尔湾分校

4.6（181 个评分） | 12K 名学生已注册

课程 3（共 6 门，面向创意企业家的 iOS 开发专项课程）

You will learn to develop sophisticated user interfaces for iOS, with a focus on user interface design best practices, UI animations, and responsive design. You will learn about the key UI widgets, mapping interfaces and view restoration.

查看授课大纲

审阅

4.6（181 个评分）

5 stars
133 ratings
4 stars
33 ratings
3 stars
6 ratings
2 stars
5 ratings
1 star
4 ratings

DJ

Aug 13, 2017

Very Good content, clear and challenging. But the most important part is that the material is very applicable to real app development

OL

Mar 30, 2016

Excellent course. Very detailed round tour of User Interface concepts and recommandations for the best user experience.

从本节课中

Table Views, Core Data and User Interface Integration

In week 4, we will look at table views, core data, and user interface integration. We will cover table views, table views plus core data, and you will finally learn how to put it all together. We will end the course with a peer review assignment called To Do Manager.

Case Study: To Do List Part 120:38

Case Study: To Do List Part 225:44

Case Study: To Do List Part 324:29

Case Study: To Do List Part 419:43

Case Study: To Do List Part 530:20

Case Study: To Do List Part 615:23

Case Study: To Do List Part 713:18

教学方

Don Patterson
Associate Professor
Sam Kaufman
Partner at Gradient

脚本

[MUSIC]

Hey, so we're picking up with our next segment, and what we have,

is we have a nice UI.

We have the ability to add a new to do entity.

We have the ability to edit.

We ran in to a little bit of confusion because we were seeing that

the due date label in our list wasn't coming out for some reason.

And it took some time to debug it, but actually there wasn't any bugs.

So the codes that we have so far is good, we just didn't handle one case, so

we'll look at that.

And in this section, what we'd like to do is we'd like to implement the edit

functionality, so we'd like to be able to not just add a new to do entity, but

take one that exists and edit it in place.

And we'd like to implement delete functionality, so

we can get rid of to do items.

So let's take care of that.

So for starters, let's address the reason why the date wasn't getting set.

Now, if you'll recall, whenever a date picker was set,

and we recognize that it had been edited down here.

What we would do is we would set

our local to do entity that's on the scratch pad of our managed object context.

We'd set it equal to the date picker's value, and we'd save it.

Well, it turns out that sometimes this function doesn't get called

,because if the navigation view controller goes back,

before there's any indication that you've actually finished editing.

Because if you're doing the wheel, if you don't select something else,

you don't knowt that it's edited.

And so

what we're going to do is we're going to add some code to our view will disappear.

It says that regardless of what's happened in your edits, on the way out,

we're just going to grab the value of all the fields.

And we're going to store those, just like we store them when you edit

them individually, if we get the notification that that happened.

So in addition to removing our detection of changes to our text view,

we are going to save everything as well.

Let's walk through this code.

Let me clean it up for us.

All right, so when the view is on the way out,

we're going to take our local to-do title.

We're going to take the entity that we're keeping track of locally.

We're going to set its to do title equal to the title field that we have's text.

We're going to take the localToDoEntity that we're keeping track of and

set its toDoDetails equal to the text of the detailsField.

Finally, we're going to take the localToDoEntity,

and we're going to take it to DueDate, and we're going to set that equal to

the due date field's date and then we're going to save it on the way out.

Now we're going to remove detection of changes to the text view because we're not

active anymore, and so

now we should see that our due date is properly getting saved in all cases.

We have nothing in here I think, we're going to add a new one.

We'll say I've got this thing to do.

Do be do be do.

And we'll set the due date equal to Saturday, January 2nd.

And we're going to go back, and

when we go back, that view will disappear as it's going to get called.

And we're going to set, take the values of each of these fields and

put them into our to do entity item.

We're going to save it off the scratchpad, and

then that's going to cause our core data to recognize that there's a change.

Our results controller is going to notify our table view, and

the animation with that change is going to be affected.

So here we go.

Bang! There it is.

Now we see that our date's there.

We have a little bit of a problem with the size of our date field, but

it's at least showing up.

So let's fix that size date of the date field and

then let's handle the case when we want to edit this element right here.

All right, so first let's go to our storyboard, and

let's go to our label field and

we know that this label field has a constraint on it that specifies its width.

We said that we wanted to use 0.3.

Well, 0.3 apparently isn't wide enough, so

we'll make the date label half the width of the title label.

Hit Enter, that'll give it a little bit more space.

Now when we run it, we should have the core data persisted.

So we'll have that entity still in our persistent data.

We'll bring it up, and we'll see if there's enough space.

Great, so now we have a due date.

It's written in short format.

We've got this thing to do.

We can add a new element, this other thing,

bam, and make it January 3rd.

And if we go back there's this other thing, January 3rd.

Everything's good to go there.

Okay, so now what we want to do is we want to implement the ability to edit.

And so we have one segue here that's attached to our plus symbol but

we want to add another segue that's associated with clicking,

pressing on one of these prototype cells.

So we're going to Ctrl-drag that, and we're going to create another segue

that goes to the same view controller, so it's going to be a show as well.

Now, the only difference between these two is that,

rather than passing a brand-new to-do entity, like we do with the plus button,

we're going to pass the to-do entity that's associated with this table row.

And so that's going to happen and prepare in segue also.

We're just going to make sure that we send it the right thing.

So let's go to prepare for segue in our table view controller,

and here's prepare for segue.

So here's where we made a blank one,

because before the only way that we could go from our table view,

to our view controller, to our detail view, was by hitting the plus button.

Well, now we can do it two ways.

So we need to figure out which way is it that we are doing,

which way is it that we are making our segues.

So what we're going to do, is we're going to use a check

of the class that's currently sending the segue, that is causing the segue.

We're going to pull this to do item out in front here,

and then if it turns out.

So what we're going to do,

is we're going to check to see if the thing that initiated this center

was a UI bar button item, so that's the plus bar.

If it's that class and we do that by sending the sender,

which is passed to us by iOS.

We ask, is it a member of class?

Which says, is it the class in the sense of objective C of UIBarButtonItem's class?

So the plus button is, and

if that's the case, then we're going to set item equal to a brand new item.

If that's not the case, then what we are doing is we

are being called from the table view as a result.

And so what we need to pull out in that case is we need to say okay,

well, let's see.

I know that there is a to

do entity associated with my row.

Okay, if its not the plus button that is sending it, and

the sender must be a MyUITableViewCell.

And we'll say this is the source I guess.

But really we just want to cast the sender as one of these.

Because once we have that then we can just say source.localToDoEntity.

That is this row in our table

is keeping track of the to-do entity that's associated with it.

And so we're just going to pull it out of there.

We're just coming over to this class that we made here.

And if you look in the header for

it, you'll see that we're keeping track of the local to-do entity.

When we set our internal fields, we keep track of it.

So if we go back to my table view controller,

what we're going to do is we're going to say that item equals this and

then we're going to pass it to the child before we move.

So here's what's happening.

Our table view controller has a bunch of rows.

If we hit the plus sign we're going to create a brand new to do entity.

And then we are going to pass it to the view controller.

The view controller's going to initialize itself with the values.

If we are being called from clicking on a table cell,

then we are going to pull out the entity associated with that cell.

And then we're going to send that to the view controller instead.

And it will initialize it with the values of the entity.

And then if the user edits it, they'll be saved to that entity and

then saved to core data on the way back.

And so that should be enough to support editing.

So let's see if it works as we expect.

Cross our fingers.

All right, so we've got this other thing, I've got this thing to do,

this other thing, I'm going to click on it, and there we go.

We fill out our view detailed with all of the data that we got, and if we edit it.

We can change all these elements and then when we send it back,

it gets updated because it's being updated in core data.

And if we click on it again, we see bam bam, we go back, it's fine.

And if we change it such that it comes alphabetically first.

Then when we go back It gets swapped out and goes up to the top.

Okay, so that's edit.

So what did we do?

We just added some code that said, well instead of sending a blank to do entity,

let's send a to do entity that's associated with this element, great.

So the other thing that we said we wanted to do is we wanted to add the ability to

delete something.

So there's all kinds of ways that you could do this.

One thing you could do is you could slide here and have a red delete come up.

You can click that delete.

That is a popular metaphor right now.

I happen to not like that because it means that the functionality is hidden.

So another thing that we could do, is we could come over here and

we could add a trash can, which I kind of like.

Let's see, add a bar button item up here and so it'd be custom.

We're going to use trash.

We'll get a little trash can.

And then we need to add some functionality to that trash can,

and we will put it right here.

[INAUDIBLE] I don't know where we should put it.

Maybe we'll put it right here.

We'll grab our trash, and we will Ctrl-drag it over here,

and we want to [INAUDIBLE] trash.

Tapped, connect, and now we need to add the functionality.

All right, let me close out some space here.

Get some space here.

All right, where's the trash can?

All right, so when the trash is tapped,

it's actually really easy to know what to do.

All we have to do is we have to delete the to do entity that we've got.

So we say, okay, we've got self.managedObjectContext.

All we're going to do is we're going to delete the object

which is our self.LocalToDoEntity.

So the one that we're managing, all we do is we delete it,

and then we're going to do self.saveMyToDoEnitity.

And then because when we delete it we're not going to have anything there,

we're just going to pop off the stack.

And so we're going to say self.nav, this is going to send us back, to the list.

So we're going to delete the object,

we're going to save that delete off the scratch pad then we're going to go back.

And then only thing that happens here is,

when we go back, we're going to execute that view will disappear code right here.

And so that's kind of a problem because we don't want to recreate an empty thing on

the way out.

So we just have to indicate to this view will disappear that the reason we're

disappearing is because we hit the delete button.

So we're just going to add a state variable.

We're going to add a state variable to this class.

And the state variable is going to be set up here when we, sorry, not there.

We're going to create a Boolean variable up here.

This will be true if what happened,

the reason why we left our

view controller was

because we were deleted.

So when we enter our view controller, it's not the case that we're deleting.

So we're going to go ahead and say, as we're setting up form, we're going to say,

set up delete state, and we're going to say self.wasDeleted,

when we first come in, that's not true.

That's false, we were not deleted.

That's when we first appear.

If trash is tapped, then we have to say well,

self.wasDeleted actually equals yes.

So yes, go down here.

Self.wasDeleted = no.

Self.wasDeleted = yes if you hit the trash can.

And then on the way out we say oh well, let's see,

we only want to do this if self.wasDeleted = yes.

Then, oh sorry if it equals no.

If we didn't hit the trash can on the way out,

then we'll want to save everything.

If we did hit the trash can on the way out then we don't want to do anything,

we just want to remove our notifications.

Regardless of whether we are deleting or not, we want to remove our notifications.

Okay, so now we run.

And we say all these other things.

We have a trash can now, and it deletes it, and it works great.

Got this one, trash can, deletes it and it's great.

We add a new one, A.

Get a new one, just say B.

Make a new one, just say AA.

Everything stays sorted, it's really great, CCC.

And if we want to delete one, we just delete it.

So we have a really nice application here that's keeping track of our to-do lists.

And that was what we were going to do in this episode.

We implemented edit functionality and we implemented delete functionality.

So that was the end of this.

We've got one more video for clean up, and then I think we're good to go.

All right, thanks for your attention.

[MUSIC]

探索我们的目录

免费加入并获得个性化推荐、更新和优惠。

Coursera 致力于普及全世界最好的教育，它与全球一流大学和机构合作提供在线课程。

© 2019 Coursera Inc. 保留所有权利。

通过 App Store 下载

通过 Google Play 获取

Coursera
关于
管理团队
工作机会
目录
证书
MasterTrack™ 证书
学位
企业版
政府版

社区
Learners
Partners
Developers
Beta Testers
Translators

连接
博客
Facebook
领英
Twitter
Instagram
YouTube
技术博客

更多
条款
隐私
帮助
内容访问
媒体
联系我们
目录
附属公司