天天看點

拆解PowerApps - 請假申請 - 9

接着上一節,本節我們繼續請假申請的步驟解析。

在完成審批人的選擇确認後,點選下一步就會進入今天要解析的LeaveDetailsScreen 頁面。和之前一樣,我們先看看總體結構,然後逐個解析控件的作用和運作邏輯。

  1. 總體結構
    拆解PowerApps - 請假申請 - 9
    熟悉的結構,比上一頁還少一個控件。隻是控件裡出現一個新的類型 - 文本輸入控件(12号 和14号)。
  2. 控件解析

    這個頁面的大多數控件的運作邏輯和上一節對應的控件并沒差别,就不再贅述了。來看與之前不同的地方:兩個文本輸入控件和最後的一個按鈕控件。

  • 12号控件 - AboutLeaveTitleInput

    這個控件的作用是用來輸入假期申請的标題。設定了一個屬性:

    Default = If(_editingRequest, First(RequestEdit).Title)

    //這個IF語句的作用是判斷說如果目前頁面是編輯狀态,就從RequestEdit集合裡取第一個值的Title屬性值,并填入這個文本輸入控件中;否則就留白, 等使用者輸入。

  • 14号控件 - AboutLeaveDetailInput

    這個控件的作用是用來輸入假期申請的理由描述。設定了一個屬性:

    Default = If(_editingRequest, First(RequestEdit).Detail)

    //這個IF語句的作用是判斷說如果目前頁面是編輯狀态,就從RequestEdit集合裡取第一個值的Detail屬性值,并填入這個文本輸入控件中;否則就留白,等使用者輸入。

  • 16号控件 - BtnNextDetailsScreen

    作用:下一步按鈕。

    這個按鈕的設定有點新内容,一起來看。

    回頭看上面的結構圖,當時在截取時标題文本框裡是有輸入内容的,下面再重新發個局部截圖,按鈕看上去就是這個樣子:

    拆解PowerApps - 請假申請 - 9
    而在文本框裡輸入内容之前,它看上去其實是下面這個樣子的,整個按鈕是灰色的:
    拆解PowerApps - 請假申請 - 9
    也就是說在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 這個頁面。

繼續閱讀