接着上一节,本节我们继续请假申请的步骤解析。
在完成审批人的选择确认后,点击下一步就会进入今天要解析的LeaveDetailsScreen 页面, 用于给请假人填写请假理由。和之前一样,我们先看看总体结构,然后逐个解析控件的作用和运行逻辑。
-
总体结构
熟悉的结构,比上一页还少一个控件。只是控件里出现一个新的类型 - 文本输入控件(12号 和14号)。 -
控件解析
这个页面的大多数控件的运行逻辑和上一节对应的控件并没差别,就不再赘述了。来看与之前不同的地方:两个文本输入控件和最后的一个按钮控件。
-
12号控件 - AboutLeaveTitleInput
这个控件的作用是用来输入假期申请的标题。设置了一个属性:
Default = If(_editingRequest, First(RequestEdit).Title)//这个IF语句的作用是判断说如果当前页面是编辑状态,就从RequestEdit集合里取第一个值的Title属性值,并填入这个文本输入控件中;否则就留空, 等用户输入。
-
14号控件 - AboutLeaveDetailInput
这个控件的作用是用来输入假期申请的理由描述。设置了一个属性:
Default = If(_editingRequest, First(RequestEdit).Detail)//这个IF语句的作用是判断说如果当前页面是编辑状态,就从RequestEdit集合里取第一个值的Detail属性值,并填入这个文本输入控件中;否则就留空,等用户输入。
-
16号控件 - BtnNextDetailsScreen
作用:下一步按钮。
这个按钮的设置有点新内容,一起来看。
回头看上面的结构图,当时在截取时标题文本框里是有输入内容的,下面再重新发个局部截图,按钮看上去就是这个样子:
而在文本框里输入内容之前,它看上去其实是下面这个样子的,整个按钮是灰色的:
也就是说在Title这个文本输入框里输入内容之前,这个按钮是处于禁用状态的。只有输入内容后才会激活这个按钮。换个角度来看,就相当于实现了把 Title 文本框设置为 “必填” 的效果。
来看这个效果的具体实现,以及这个按钮的其它设置。这个按钮设置了下面几个和运行逻辑有关的设置:
- Text = If(_editingRequest, “Save”, “Next”)
//按钮名, 页面处于编辑状态就显示Save,否则显示 Next
- OnSelect = If
(
_editingRequest,
Patch(RequestEdit, First(RequestEdit), {Title: AboutLeaveTitleInput.Text, Detail: AboutLeaveDetailInput.Text});
Navigate(EditRequestScreen, None),
Navigate(ReviewScreen, None))
//在页面处于编辑状态时,点击按钮实现将Title 和 Detail里的数据更新到 RequestDetails 集合里,同时跳转*回到*EditRequestScreen页面 (从这个跳转可以看到,在EditRequestScreen页面里有按钮也可以跳转到当前的这个 LeaveDetailsScreen页面)。
//否则,就跳转到 ReviewScreen页面 (下面马上就会解析这个页面)。
- DisplayMode = If(IsBlank(Trim(AboutLeaveTitleInput.Text)), DisplayMode.Disabled, DisplayMode.Edit)
//这一句就是实现禁用按钮的语句,这里用到了一个常用的判断对象是否为空的函数 IsBlank。这个IF语句比较好理解,就是利用 Trim函数把上面的AboutLeaveTitleInput.Text 的文本去掉首尾的空格, 然后通过IsBlank来判断是不是空值,如果时空的,就相当于Title文本输入框里没有输入,然后就把按钮的 DisplayMode 设置成禁用状态。否则就会设置成Edit模式。
本节就解析到此,总结一下:
本节用到的函数:IF, Patch, First, Navigate, IsBlank, Trim, 最后两个函数应该是之前没用过的。
另外,本节还涉及到控件的显示模式: DisplayMode,有三种模式:Edit(可读、可写), View(只读), Disable(禁用)。
好了先到这里,我们下一节再见,一起去解析刚才提到的 ReviewScreen 这个页面。