{"id":343,"date":"2024-02-21T16:21:47","date_gmt":"2024-02-21T16:21:47","guid":{"rendered":"https:\/\/xojo.itbib4you.be\/?page_id=343"},"modified":"2025-06-22T14:28:57","modified_gmt":"2025-06-22T14:28:57","slug":"manage-all-your-accounts","status":"publish","type":"page","link":"https:\/\/xojo.itbib4you.be\/index.php\/manage-all-your-accounts\/","title":{"rendered":"Manage All Your Accounts"},"content":{"rendered":"\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button has-custom-width wp-block-button__width-25\"><a class=\"wp-block-button__link has-light-green-cyan-to-vivid-green-cyan-gradient-background has-background has-small-font-size has-custom-font-size wp-element-button\" href=\"https:\/\/xojo.itbib4you.be\/\">Overview<\/a><\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Introduction<\/h2>\n\n\n\n<p>In the previous lesson we developed an application to manage our<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">CheckingAccount<\/mark>. In this new lesson we will further expand this  application to be able to process the balance of multiple bank accounts. In this lesson we will also introduce a new control: <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">DesktopPopupMenu<\/mark>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">DesktopPopupMenu<\/h2>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"332\" height=\"44\" src=\"https:\/\/xojo.itbib4you.be\/wp-content\/uploads\/2024\/02\/Xojo_28.png\" alt=\"\" class=\"wp-image-346\" style=\"width:194px;height:auto\" srcset=\"https:\/\/xojo.itbib4you.be\/wp-content\/uploads\/2024\/02\/Xojo_28.png 332w, https:\/\/xojo.itbib4you.be\/wp-content\/uploads\/2024\/02\/Xojo_28-300x40.png 300w\" sizes=\"auto, (max-width: 332px) 85vw, 332px\" \/><\/figure>\n<\/div>\n\n\n<p>The <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">DesktopPopupMenu<\/mark> displays a list of items. The user can select one element from the list. The <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">DesktopPopupMenu<\/mark> will be used to select one of our accounts.<\/p>\n\n\n\n<p>The following <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Properties<\/mark> are commonly used:<\/p>\n\n\n\n<figure class=\"wp-block-table has-small-font-size\"><table><thead><tr><th>Property<\/th><th>Type<\/th><th>Description<\/th><\/tr><\/thead><tbody><tr><td>LastRowIndex<\/td><td>Integer<\/td><td>The number of the last item in the DesktopPopupMenu (the first element in the list is zero).<\/td><\/tr><tr><td>RowCount<\/td><td>Integer<\/td><td>The number of items in the DesktopPopupMenu.<\/td><\/tr><tr><td>SelectedRowIndex<\/td><td>Integer<\/td><td>Get or set the selected item number.<\/td><\/tr><tr><td>SelectedRowText<\/td><td>String<\/td><td>The text of the selected item.<\/td><\/tr><\/tbody><\/table><figcaption class=\"wp-element-caption\">DesktopPopupMenu Properties<\/figcaption><\/figure>\n\n\n\n<p>The following <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">methods<\/mark> are often used:<\/p>\n\n\n\n<figure class=\"wp-block-table has-small-font-size\"><table><thead><tr><th>Method<\/th><th>Type<\/th><th>Description<\/th><\/tr><\/thead><tbody><tr><td>AddRow(item)<\/td><td>String<\/td><td>Appends the item to the end of the list.<\/td><\/tr><tr><td>RemoveAllRows<\/td><td><\/td><td>Removes all elements in the list<\/td><\/tr><\/tbody><\/table><figcaption class=\"wp-element-caption\">DesktopPopupMenu Methods<\/figcaption><\/figure>\n\n\n\n<p>When another item is selected, the following <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">event<\/mark> occurs:<\/p>\n\n\n\n<figure class=\"wp-block-table has-small-font-size\"><table><thead><tr><th>Event<\/th><th>Description<\/th><\/tr><\/thead><tbody><tr><td>SelectionChanged<\/td><td>Another item in the list has been selected.<\/td><\/tr><\/tbody><\/table><figcaption class=\"wp-element-caption\">DesktopPopupMenu Events<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Modifications to the application<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Add a DesktopPopupMenu <\/h3>\n\n\n\n<p>The <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">DesktopPopupMenu<\/mark> control is available in the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">library<\/mark> under the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Pickers<\/mark> section. Drag this control on the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">AccountWindow<\/mark>. Change the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Name<\/mark> property to <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">AccountPopup<\/mark>. <\/p>\n\n\n\n<pre class=\"wp-block-preformatted has-yellow-background-color has-background\" style=\"line-height:1.4\">It is good programming practice to end the name of a <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">DesktopPopupMenu<\/mark> with the suffix '<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Popup<\/mark>'.<\/pre>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"986\" height=\"600\" src=\"https:\/\/xojo.itbib4you.be\/wp-content\/uploads\/2024\/02\/Xojo_29.png\" alt=\"\" class=\"wp-image-353\" style=\"width:260px;height:auto\" srcset=\"https:\/\/xojo.itbib4you.be\/wp-content\/uploads\/2024\/02\/Xojo_29.png 986w, https:\/\/xojo.itbib4you.be\/wp-content\/uploads\/2024\/02\/Xojo_29-300x183.png 300w, https:\/\/xojo.itbib4you.be\/wp-content\/uploads\/2024\/02\/Xojo_29-768x467.png 768w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n<\/div>\n\n\n<p>In the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Inspector<\/mark>, you can add items to <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">AccountPopup<\/mark> using the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Initial Value<\/mark> property. Initialise the control with the following Strings: <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">CheckingAccount<\/mark>, <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">RetirementAccount<\/mark> and <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">SavingsAccount<\/mark>.<\/p>\n\n\n\n<div style=\"height:1px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Create new Instances<\/h3>\n\n\n\n<p>Add the following <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Properties<\/mark> to <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">AccountWindow<\/mark>: <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">RetirementAccount<\/mark> and <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">SavingsAccount<\/mark>.<\/p>\n\n\n\n<p>In the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Opening<\/mark> event, create instances of the class <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Account<\/mark> for the newly defined <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">RetirementAccount<\/mark> and <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">SavingsAccount<\/mark> properties:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted has-light-gray-background-color has-background has-small-font-size\" style=\"line-height:1.4\">CheckingAccount =  New Account\nRetirementAccount = New Account\nSavingsAccount =  New Account<\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">DepositButton: Pressed<\/h3>\n\n\n\n<p>The account name shown in <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">AccountPopup<\/mark> determines which account should be addressed. The account name is available from the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">SelectedRowText<\/mark> property:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted has-light-gray-background-color has-background has-small-font-size\" style=\"line-height:1.4\"><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Var<\/mark> accountName As <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">String<\/mark> \naccountName = AccountPopup.SelectedRowText\n\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Select Case<\/mark> accountName\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"CheckingAccount\"\n  CheckingAccount.DepositMoney(1500.00)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"SavingsAccount\"\n  SavingsAccount.DepositMoney(600.00)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"RetirementAccount\"\n  RetirementAccount.DepositMoney(200.00)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">End<\/mark> <\/pre>\n\n\n\n<pre class=\"wp-block-preformatted has-yellow-background-color has-background\" style=\"line-height:1.4\">Use <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">camel case<\/mark> (first word in the name is a lower case letter, all subsequent words in the name start with a capital letter) for local variables declared in methods or events.<\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">WithdrawButton: Pressed<\/h3>\n\n\n\n<p>The <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Pressed<\/mark> event for <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">WithdrawButton<\/mark> is quite similar to the <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">Pressed<\/mark> event of <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">DepositButton<\/mark>:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted has-light-gray-background-color has-background has-small-font-size\" style=\"line-height:1.4\"><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Var<\/mark> accountName As <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">String<\/mark> \naccountName = AccountPopup.SelectedRowText\n\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Select Case<\/mark> accountName\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"CheckingAccount\"\n  CheckingAccount.WithdrawMoney(275.00)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"SavingsAccount\"\n  SavingsAccount.WithdrawMoney(150.00)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"RetirementAccount\"\n  RetirementAccount.WithdrawMoney(100.00)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">End<\/mark> <\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">ShowButton: Pressed<\/h3>\n\n\n\n<p>The <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">ShowButton<\/mark> event can be developed in the same way:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted has-light-gray-background-color has-background has-small-font-size\" style=\"line-height:1.4\"><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Var<\/mark> accountName As <mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">String<\/mark> \naccountName = AccountPopup.SelectedRowText\n\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Select Case<\/mark> accountName\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"CheckingAccount\"\n  BalanceLabel.Text = \"The balance of the checking account = \" + _ \n     CheckingAccount.GetBalance.ToString(locale.current)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"SavingsAccount\"\n  BalanceLabel.Text = \"The balance of the savings account = \" + _ \n     SavingsAccount.GetBalance.ToString(locale.current)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">Case<\/mark> \"RetirementAccount\"\n  BalanceLabel.Text = \"The balance of the retirement account = \" + _ \n     RetirementAccount.GetBalance.ToString(locale.current)\n<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-blue-color\">End<\/mark><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Introduction In the previous lesson we developed an application to manage ourCheckingAccount. In this new lesson we will further expand this application to be able to process the balance of multiple bank accounts. In this lesson we will also introduce a new control: DesktopPopupMenu. DesktopPopupMenu The DesktopPopupMenu displays a list of items. The user can &hellip; <a href=\"https:\/\/xojo.itbib4you.be\/index.php\/manage-all-your-accounts\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Manage All Your Accounts&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-343","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/pages\/343","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/comments?post=343"}],"version-history":[{"count":19,"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/pages\/343\/revisions"}],"predecessor-version":[{"id":593,"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/pages\/343\/revisions\/593"}],"wp:attachment":[{"href":"https:\/\/xojo.itbib4you.be\/index.php\/wp-json\/wp\/v2\/media?parent=343"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}