PinToo之窗體相互傳值

1. 說明

  該功能構建窗體之間可相互進行值互傳以及控制元件控制的功能。點選窗體中的按鈕，打開另外一個窗體並將源窗體中的數據傳遞給另外一個窗體。

  通過範例學習，可以掌握窗體間傳值的方法。

2. 設計明細

  開啟PinToo設計器。該範例需要使用到三個功能表模組，此處需新建三個模組，分別命名為Home，SecondPage，ThirdPage。

  窗體構建的示例如下圖所示。或者點選左上角的[打開模板Lib檔案]，選擇模板檔案來打開對應模板。

  ①：TfxSuperButton元件，控制元件名稱為fxSuperButtonPage。

  ②：TfxSuperButton元件，控制元件名稱為fxSuperButtonForm。

  ③：TfxMemo元件，控制元件名稱為fxMemo1。

• fxRunFrame屬性設定

  • Height：設定頁面高度=800。
  • Width：設定頁面寬度=400。

• ①fxSuperButtonPage屬性設定

  • Height：設定控制元件高度=150。
  • Width：設定控制元件寬度=150。
  • ButtonType：設定按鈕型別，設定為TfxSvgButton。
  • Name：設定控制元件名稱=fxSuperButtonPage。
  • Opactiy：設定控制元件透明度=0.9。
  • ButtonType.Text：設定按鈕文字=傳送界面（頁面模式）。
  • ButtonType.SvgData：設定SVG數據，其數據內容如下。

  <path d="M47.2741279602051,15.2713918685913 L68.3908996582031,3 L68.341064453125,21.2513561248779 L47.2243003845215,33.5227508544922 L47.2741279602051,15.2713918685913 Z" p-id="6930" fill="#FFFF7517" stroke="Null"></path>
  <path d="M18.4457092285156,31.7162971496582 L39.5624656677246,19.4449081420898 L68.3908996582031,3 L47.2741279602051,15.2713918685913 L18.4457092285156,31.7162971496582 Z" p-id="6931" fill="#FFFFB845" stroke="Null"></path>
  <path d="M47.2741279602051,15.2713918685913 L47.2243003845215,33.5227508544922 L110.387725830078,70.0005493164063 L110.350326538086,84.7635803222656 L47.1744728088379,48.2982521057129 L44.3464469909668,46.6662254333496 L18.4457092285156,31.7162971496582 L47.2741279602051,15.2713899612427 Z" p-id="6932" fill="#FFFFDF5A" stroke="Null"></path>
  <path d="M47.2243003845215,33.5227508544922 L68.341064453125,21.2513580322266 L131.504425048828,57.7291603088379 L110.387725830078,70.0005493164063 L47.2243003845215,33.5227508544922 Z" p-id="6933" fill="#FFFFB845" stroke="Null"></path>
  <path d="M110.387725830078,70.0005493164063 L131.504425048828,57.7291603088379 L131.467071533203,72.4921951293945 L110.350326538086,84.7635803222656 L110.387725830078,70.0005493164063 Z" p-id="6934" fill="#FFFF7517" stroke="Null"></path>
  <path d="M110.437561035156,109.244087219238 L81.6091156005859,125.6640625 L81.658935546875,107.412719726563 L18.4955444335938,70.9473648071289 L18.5329170227051,56.1843299865723 L81.6963043212891,92.6496734619141 L84.5243377685547,94.2817001342773 L110.437515258789,109.244087219238 Z" p-id="6935" fill="#FF76C8FF" stroke="Null"></path>
  <path d="M105.641098022461,82.0103149414063 L102.813064575195,80.378288269043 L39.6621246337891,43.9129409790039 L18.5329170227051,56.1843299865723 L81.6963043212891,92.6496734619141 L84.5243377685547,94.2817001342773 L110.437515258789,109.244087219238 L131.554290771484,96.9726867675781 L105.641098022461,82.0103149414063 Z" p-id="6936" fill="#FF2789FF" stroke="Null"></path>
  

• ②fxSuperButtonForm屬性設定

  • Height：設定控制元件高度=150。
  • Width：設定控制元件寬度=150。
  • ButtonType：設定按鈕型別，設定為TfxSvgButton。
  • Name：設定控制元件名稱=fxSuperButtonForm。
  • Opactiy：設定控制元件透明度=0.9。
  • ButtonType.Text：設定按鈕文字=傳送界面（視窗模式）。
  • ButtonType.SvgData：設定SVG數據，其數據內容如下。

  <path d="M98.8268280029297,67.6139526367188 M96.8694152832031,67.6139526367188 C96.8694152832031,68.6950073242188 97.7458038330078,69.5713500976563 98.8268280029297,69.5713500976563 C99.9078826904297,69.5713500976563 100.784240722656,68.6950073242188 100.784240722656,67.6139526367188 C100.784240722656,66.5328979492188 99.9078826904297,65.6565399169922 98.8268280029297,65.6565399169922 C97.7458038330078,65.6565399169922 96.8694152832031,66.5328979492188 96.8694152832031,67.6139526367188 Z" p-id="8310" fill="#FFFF8429" stroke="Null"></path>
  <path d="M84.5912780761719,111.488525390625 C84.5912780761719,113.551879882813 82.9186096191406,115.224563598633 80.8552551269531,115.224563598633 L24.0422172546387,115.224563598633 L24.0422172546387,58.4115409851074 C24.0422172546387,56.3491973876953 25.7133102416992,54.6769409179688 27.7756462097168,54.6754989624023 L48.1835556030273,54.6754989624023 L48.1835556030273,44.3665008544922 L27.906135559082,44.3665008544922 C20.0782279968262,44.3679389953613 13.7332153320313,50.7141189575195 13.7332172393799,58.5420303344727 L13.7332172393799,125.6640625 L80.8552551269531,125.6640625 C88.6841735839844,125.6640625 95.03076171875,119.317459106445 95.03076171875,111.488525390625 L95.03076171875,91.0832214355469 L84.5912780761719,91.0832214355469 Z" p-id="8311" fill="#FF48BCFF" stroke="Null"></path>
  <path d="M54.9692153930664,16.0493698120117 L54.9692153930664,84.2975616455078 L123.217422485352,84.2975616455078 C130.424377441406,84.2975616455078 136.266784667969,78.4551696777344 136.266784667969,71.2481994628906 L136.266784667969,3 L68.0185852050781,3 C60.8116188049316,3 54.9692153930664,8.8424015045166 54.9692153930664,16.0493698120117 Z M123.217422485352,73.8580627441406 L65.4087219238281,73.8580627441406 L65.4087219238281,16.0493698120117 C65.4087219238281,14.6079750061035 66.5772094726563,13.4394950866699 68.0185852050781,13.4394950866699 L125.827285766602,13.4394950866699 L125.827285766602,71.2481994628906 C125.827285766602,72.6895904541016 124.658813476563,73.8580627441406 123.217422485352,73.8580627441406 Z" p-id="8312" fill="#FFFF8429" stroke="Null"></path>
  <path d="M106.18928527832,69.5517730712891 L119.499649047852,69.5517730712891 C120.616744995117,69.5517730712891 121.522308349609,68.6462097167969 121.522308349609,67.5291290283203 L121.522308349609,37.854866027832 C121.523529052734,37.6714210510254 121.451141357422,37.4951438903809 121.321334838867,37.3655128479004 C119.624908447266,35.7056274414063 117.607482910156,36.8761558532715 117.607482910156,38.5190734863281 L117.607482910156,64.9623107910156 C117.607467651367,65.3348999023438 117.305435180664,65.6369476318359 116.932830810547,65.6369476318359 L105.523773193359,65.6369476318359 C105.34033203125,65.6357269287109 105.164047241211,65.7081146240234 105.034408569336,65.8379211425781 C103.375839233398,67.5278167724609 104.54638671875,69.5517578125 106.18928527832,69.5517578125 Z" p-id="8313" fill="#FFFF8429" stroke="Null"></path>
  

• ③fxMemo1屬性設定

  • Height：設定控制元件高度=325。
  • Width：設定控制元件寬度=355。
  • Opacity：設定控制元件透明度=0.9。
  • Lines：設定編輯框中顯示的文字內容。雙擊該屬性或者點選屬性右側的[...]打開編輯器，輸入內容。參考內容如下圖。

  ④：TfxSuperButton元件，控制元件名稱為fxSuperButtonTran。

  ⑤：TfxMemo元件，控制元件名稱為fxMemo1。

• fxRunFrame屬性設定

  • Height：設定頁面高度=800。
  • Width：設定頁面寬度=400。

• ④fxSuperButtonTran屬性設定

  • Height：設定控制元件高度=150。
  • Width：設定控制元件寬度=150。
  • ButtonType：設定按鈕型別，設定為TfxSvgButton。
  • Name：設定控制元件名稱=fxSuperButtonTran。
  • Opactiy：設定控制元件透明度=0.9。
  • ButtonType.Text：設定按鈕文字=傳送界面。
  • ButtonType.SvgData：設定SVG數據，其數據內容如下。

  <path d="M99.0241088867188,68.1489410400391 M97.0504913330078,68.1489410400391 C97.0504913330078,69.2389373779297 97.9341278076172,70.1225433349609 99.0241088867188,70.1225433349609 C100.114120483398,70.1225433349609 100.99772644043,69.2389373779297 100.99772644043,68.1489410400391 C100.99772644043,67.0589294433594 100.114120483398,66.1753234863281 99.0241088867188,66.1753234863281 C97.9341278076172,66.1753234863281 97.0504913330078,67.0589294433594 97.0504913330078,68.1489410400391 Z" p-id="8310" fill="#FFFF8429" stroke="Null"></path>
  <path d="M84.6707000732422,112.386779785156 C84.6707000732422,114.467224121094 82.9841766357422,116.153747558594 80.9037322998047,116.153747558594 L23.6203079223633,116.153747558594 L23.6203079223633,58.8703308105469 C23.6203079223633,56.7909126281738 25.3052387237549,55.104808807373 27.384651184082,55.1033554077148 L47.9615287780762,55.1033554077148 L47.9615287780762,44.7090034484863 L27.5162200927734,44.7090034484863 C19.6235008239746,44.7104530334473 13.2259521484375,51.1091766357422 13.2259540557861,59.0018997192383 L13.2259540557861,126.6796875 L80.9037322998047,126.6796875 C88.7974700927734,126.6796875 95.1966094970703,120.280532836914 95.1966094970703,112.386779785156 L95.1966094970703,91.8125305175781 L84.6707000732422,91.8125305175781 Z" p-id="8311" fill="#FF48BCFF" stroke="Null"></path>
  <path d="M54.8033714294434,16.157413482666 L54.8033714294434,84.9706878662109 L123.616653442383,84.9706878662109 C130.883270263672,84.9706878662109 136.774047851563,79.0799255371094 136.774047851563,71.8132781982422 L136.774047851563,3 L67.9607849121094,3 C60.694149017334,3 54.8033714294434,8.89077568054199 54.8033714294434,16.157413482666 Z M123.616653442383,74.4447479248047 L65.3293151855469,74.4447479248047 L65.3293151855469,16.157413482666 C65.3293151855469,14.7040853500366 66.5074768066406,13.5259304046631 67.9607849121094,13.5259304046631 L126.248123168945,13.5259304046631 L126.248123168945,71.8132781982422 C126.248123168945,73.2666015625 125.069976806641,74.4447479248047 123.616653442383,74.4447479248047 Z" p-id="8312" fill="#FFFF8429" stroke="Null"></path>
  <path d="M106.447525024414,70.1027984619141 L119.868087768555,70.1027984619141 C120.994445800781,70.1027984619141 121.907501220703,69.1897430419922 121.907501220703,68.0634155273438 L121.907501220703,38.1434516906738 C121.908737182617,37.9584884643555 121.835739135742,37.7807540893555 121.704864501953,37.6500473022461 C119.994384765625,35.9764213562012 117.960266113281,37.1566390991211 117.960266113281,38.813159942627 L117.960266113281,65.475341796875 C117.960250854492,65.8510131835938 117.655715942383,66.1555633544922 117.280029296875,66.1555633544922 L105.776504516602,66.1555633544922 C105.591537475586,66.1543273925781 105.413803100586,66.2273254394531 105.283081054688,66.3582000732422 C103.610778808594,68.0620880126953 104.791030883789,70.102783203125 106.447525024414,70.102783203125 Z" p-id="8313" fill="#FFFF8429" stroke="Null"></path>
  

• ⑤fxMemo1屬性設定

  • Height：設定控制元件高度=315。
  • Width：設定控制元件寬度=310。
  • Opacity：設定控制元件透明度=0.8。
  • Lines：設定編輯框中顯示的文字內容。雙擊該屬性或者點選屬性右側的[...]打開編輯器，輸入內容。參考內容如下圖。

  

  ⑥：TfxSuperButton元件，控制元件名稱為fxSuperButtonTran。

  ⑦：TfxMemo元件，控制元件名稱為fxMemo1。

• fxRunFrame屬性設定

  • Height：設定頁面高度=480。
  • Width：設定頁面寬度=320。

• ⑥fxSuperButtonTran屬性設定

  • Height：設定控制元件高度=150。
  • Width：設定控制元件寬度=150。
  • ButtonType：設定按鈕型別，設定為TfxSvgButton。
  • Name：設定控制元件名稱=fxSuperButtonTran。
  • Opactiy：設定控制元件透明度=0.9。
  • ButtonType.Text：設定按鈕文字=傳送界面。
  • ButtonType.SvgData：設定SVG數據，其數據內容如下。

  <path d="M99.0241088867188,68.1489410400391 M97.0504913330078,68.1489410400391 C97.0504913330078,69.2389373779297 97.9341278076172,70.1225433349609 99.0241088867188,70.1225433349609 C100.114120483398,70.1225433349609 100.99772644043,69.2389373779297 100.99772644043,68.1489410400391 C100.99772644043,67.0589294433594 100.114120483398,66.1753234863281 99.0241088867188,66.1753234863281 C97.9341278076172,66.1753234863281 97.0504913330078,67.0589294433594 97.0504913330078,68.1489410400391 Z" p-id="8310" fill="#FFFF8429" stroke="Null"></path>
  <path d="M84.6707000732422,112.386779785156 C84.6707000732422,114.467224121094 82.9841766357422,116.153747558594 80.9037322998047,116.153747558594 L23.6203079223633,116.153747558594 L23.6203079223633,58.8703308105469 C23.6203079223633,56.7909126281738 25.3052387237549,55.104808807373 27.384651184082,55.1033554077148 L47.9615287780762,55.1033554077148 L47.9615287780762,44.7090034484863 L27.5162200927734,44.7090034484863 C19.6235008239746,44.7104530334473 13.2259521484375,51.1091766357422 13.2259540557861,59.0018997192383 L13.2259540557861,126.6796875 L80.9037322998047,126.6796875 C88.7974700927734,126.6796875 95.1966094970703,120.280532836914 95.1966094970703,112.386779785156 L95.1966094970703,91.8125305175781 L84.6707000732422,91.8125305175781 Z" p-id="8311" fill="#FF48BCFF" stroke="Null"></path>
  <path d="M54.8033714294434,16.157413482666 L54.8033714294434,84.9706878662109 L123.616653442383,84.9706878662109 C130.883270263672,84.9706878662109 136.774047851563,79.0799255371094 136.774047851563,71.8132781982422 L136.774047851563,3 L67.9607849121094,3 C60.694149017334,3 54.8033714294434,8.89077568054199 54.8033714294434,16.157413482666 Z M123.616653442383,74.4447479248047 L65.3293151855469,74.4447479248047 L65.3293151855469,16.157413482666 C65.3293151855469,14.7040853500366 66.5074768066406,13.5259304046631 67.9607849121094,13.5259304046631 L126.248123168945,13.5259304046631 L126.248123168945,71.8132781982422 C126.248123168945,73.2666015625 125.069976806641,74.4447479248047 123.616653442383,74.4447479248047 Z" p-id="8312" fill="#FFFF8429" stroke="Null"></path>
  <path d="M106.447525024414,70.1027984619141 L119.868087768555,70.1027984619141 C120.994445800781,70.1027984619141 121.907501220703,69.1897430419922 121.907501220703,68.0634155273438 L121.907501220703,38.1434516906738 C121.908737182617,37.9584884643555 121.835739135742,37.7807540893555 121.704864501953,37.6500473022461 C119.994384765625,35.9764213562012 117.960266113281,37.1566390991211 117.960266113281,38.813159942627 L117.960266113281,65.475341796875 C117.960250854492,65.8510131835938 117.655715942383,66.1555633544922 117.280029296875,66.1555633544922 L105.776504516602,66.1555633544922 C105.591537475586,66.1543273925781 105.413803100586,66.2273254394531 105.283081054688,66.3582000732422 C103.610778808594,68.0620880126953 104.791030883789,70.102783203125 106.447525024414,70.102783203125 Z" p-id="8313" fill="#FFFF8429" stroke="Null"></path>
  

• ⑦fxMemo1屬性設定

  • Height：設定控制元件高度=200。
  • Width：設定控制元件寬度=260。
  • Opacity：設定控制元件透明度=0.8。
  • Lines：設定編輯框中顯示的文字內容。雙擊該屬性或者點選屬性右側的[...]打開編輯器，輸入內容。參考內容如下圖。

  

3. 程式設計

  點選程式設計界面右下角的按鈕，切換至單元選擇界面，勾選需要使用的單元。程式主頁窗體Home與ThirdPage需要引用ufxVirtualForm單元。

3.1. 程式初始設定

  該程式無初始設定。

3.2. 事件設定

• ①fxSuperButtonPage-OnClick事件

  點選按鈕，以頁面模式打開副頁面。

Procedure fxSuperButtonPageOnClick(Sender: TObject);
//以頁面模式打開第二個窗體，並傳值
var
  Page: TfxRunFrame;
Begin
  Page := fxOpenFrameToPage('SecondPage'); //第二個窗體模組名稱為SecondPage
  Page.TagString := fxMemo1.Lines.Text;
  TfxMemo(Page.FindComponent('fxMemo1')).Lines.Add(TfxRunFrame(Page).TagString);
End;

• ②fxSuperButtonForm-OnClick事件

  點選按鈕，以窗體模式打開副頁面。

Procedure fxSuperButtonFormOnClick(Sender: TObject);
//以視窗模式打開第二個窗體，並傳值
var
  Form: TfxRunFrame;
Begin
  Form := fxOpenFrameToForm('ThirdPage',[syFree],'');// 第三個窗體模組名稱為ThirdPage
  Form.TagString := fxMemo1.Lines.Text;
  TfxMemo(Form.FindComponent('fxMemo1')).Lines.Add(TfxRunFrame(Form).TagString);
End;

• ④fxSuperButtonTran-OnClick事件

  點選按鈕，將副頁面中的內容回傳至主界面並切換至主界面。

Procedure fxSuperButtonTranOnClick(Sender: TObject);
//將內容傳遞迴主界面
var
  Page: TfxRunFrame;
Begin
  Page := fxOpenFrameToPage('Home');
  Page.TagString := fxMemo1.Lines.Text;
  TfxMemo(Page.FindComponent('fxMemo1')).Lines.Add(TfxRunFrame(Page).TagString);
End;

• ⑥fxSuperButtonTran-OnClick事件

  點選按鈕，將副頁面視窗中的數據回傳至主界面並關閉視窗。

Procedure fxSuperButtonTranOnClick(Sender: TObject);
//將內容傳遞迴主界面
var
  Page: TfxRunFrame;
Begin
  Page := fxOpenFrameToPage('Home');
  Page.TagString := fxMemo1.Lines.Text;
  TfxMemo(Page.FindComponent('fxMemo1')).Lines.Add(TfxRunFrame(Page).TagString);
  //盡在Form模式下的窗體可以使用，Page模式不適用。
  GetVirtualForm(self).ModalResult := mrNone;
End;

4. 運行結果

  使用滑鼠在 PinToo 功能表，點選[儲存至資料庫]按鈕，將其儲存至資料庫，點選[除錯運行]確認能夠正常打開。

  通過同步中心，將程式上傳至手機PinToo運行；同步時，請確保手機已經運行PinToo，並且已經登陸。

  點選主頁面的[傳送界面(頁面模式)]，打開新的頁面，主頁面編輯框中的內容會傳遞給新的頁面的編輯框中。在新頁面點選[傳送界面]，返回到主頁面，將頁面編輯框中的內容傳遞給主頁面。

  點選主頁面的[傳送界面(窗體模式)]，打開新的窗體，主頁面編輯框中的內容會傳遞給新的窗體的編輯框中，在編輯框中點選[傳送界面]，關閉該窗體返回到主頁面，將窗體編輯框中的內容傳遞給主頁面。