EP 11: Passing Data for Navigation in TopStore App - II

Hello, 各位 iT邦帮忙 的粉丝们大家好~~~

本篇是 Re: 从零开始用 Xamarin 技术来复刻过去开发的一个 App: TopStore 系列文的 EP11。

在本系列的 EP9 当中已经能让使用者在 PeoplePage 透过点选右上角的 "新增" 按钮後，透过 Shell 利用 URI 的 Navigation 模式转跳到 PersonDetailPage 的页面，并且能在 PersonDetailPage 当中新增一笔联络人资料到联络人列表当中。

在本系列的 EP10 当中则是已经能让使用者在 PeoplePage 点选联络人列表的 ListView 当中某笔联络人，透过 Shell 利用 URI 的 Navigation 模式，并传递所该笔联络人资讯转跳进入到 PersonDetailPage 的页面，并且呈现出该笔联络人详细资料。

接下来本回 EP11 要来讨论一个问题，当我们在 EP 10 从 PeoplePage 的联络人列表去点选某一个联络人时，可否能跳到所设计的 PersonDetailPage 并且把资讯带过去时是 "检视" 模式，然後有需要再进入 "编辑" 模式，完成资料上的变更处理後存回联络人列表，且不影响到原本 EP9 所设计的 "新增" 联络人的功能呢?

就来看怎麽处理吧，Go~~~

其实只要有了解到 EP9 跟 EP10 的转跳到 PersonDetailPage 的做法，应该会发现到两篇都是转跳进入到 PersonDetailPage ，但很明显的差异就是 EP9 "没有" 资料的传递处理而 EP10 "有"。

如果能够发现个差异要解决就不是太困难了。

首先，我们就来修改一下 PersonDetailPage 当中 Entry 的标记，帮这个页面中的每个 Entry 都呈现成可观看但不可编辑的效果。

修改 "姓名"、"电话" 两个 Entry 的 IsEnabled 属性。
Entry 的 IsEnabled 设定为 false 1

修改 "Email"、"地址" 两个 Entry 的 IsEnabled 属性。
Entry 的 IsEnabled 设定为 false 2

那双平台进入到 PersonDetailPage 呈现的效果就会如此(虽然 iOS 看不太出来差别)。
Entry 的 IsEnabled 效果呈现

可是在这边或许会有人有疑问了，这不对阿，那这样从 "PeoplePage" 的新增进来到 "PersonDetailPage" 的时候也不能编辑 Entry 的内容阿!

是的!

但如果我们继续把这四个 Entry 的 IsEnabled 的属性改成由 Binding 属性来赋予呢? (为了版面截图，将 Label 标记的 XAML 缩起)
Entry 的 IsEnabled 属性值的设定由 Binding 属性赋予

然後再接着到 PersonDetailPageViewModel 当中多设计一个 IsEdit 的属性来提供系结。
PersonDetailPageViewModel 设计 IsEdit 属性提供细节

所以那关键就会变成是我们如何操控 PersonDetailPageViewModel 当中所设计的那个 IsEdit 的属性的资料，以便区分 "新增" 或 "检视/编辑" 传跳进入 PersonDetailPage 的时候 Entry 是否能编辑内容了。

其手法其实各位也已经在 EP10 的介绍中学到了...是的，我们就在透过传跳进入 PersonDetailPage 的时候时要指定的 URI 所带的参数资料，来区分出 "新增" 或 "检视/编辑" 其 Entry 是否能编辑内容。
PersonDetailPageViewModel 再新增 QueryProperty 的设计 1

然後再透过 QueryProperty 的资料设定 IsEdit 的属性值。
PersonDetailPageViewModel 再新增 QueryProperty 的设计 2

所以後面的修改大家应该也不意外了，是吧?

在 PeoplePageViewModel 执行 GoToAsync 的时候，将 URI 都设定接带入 isEdit 的参数值，在 AddCommand 当中就带入 "isEdit=true"，在 EditCommand 当中就带入 "isEdit=false" 的设计。
PeoplePageViewModel 在 URI 设定直接带入 isEdit 参数值