表格布局和移动/隐藏控件

Question

我有一个表格，上面有一个表格布局控件。表格布局有 3 列和多行。

第一列包含一个标签，第二列是文本框、组合框或日期时间选择器。第三列包含一张图片，如果用户输入的信息包含错误，则该图片会打开或关闭。这是为了让他们查看自己填错或遗漏的字段。

第五行包含一个组合框，用户可以在其中选择他们正在输入的交易类型。根据用户选择的内容，控件可能必须重新排列自己。

让我展示一个使用屏幕截图的示例：

http://i.stack.imgur.com/OZmFH.png

这是一个标准版本的表单运行，用户没有选择交易类型。

现在，假设用户选择贷款付款。表单将重新排列以显示以下内容：

http://i.stack.imgur.com/j76wG.png

您可以看到叙述和总金额已向下移动了几行，并显示了一个新框，允许用户选择贷款和付款次数。

根据选择的交易类型，可以呈现 3 种不同的布局。

现在我通过检查 Transaction Type 组合框上的 SelectedIndexChanged 事件来执行此操作，并调用一个方法来设置视图。

实现这一目标的最佳方法是什么？现在我有代码可以做到这一点，但它非常混乱。

我应该看一下表格布局面板以外的东西吗？

只读 TableLayoutPanelCellPosition tlCCccLbl = new TableLayoutPanelCellPosition(0, 5); 只读 TableLayoutPanelCellPosition tlCCccList = new TableLayoutPanelCellPosition(1, 5); 只读 TableLayoutPanelCellPosition tlCCccError = new TableLayoutPanelCellPosition(2, 5); 只读 TableLayoutPanelCellPosition tlCCnarrativeLbl = new TableLayoutPanelCellPosition(0, 6); 只读 TableLayoutPanelCellPosition tlCCnarrativeTxt = new TableLayoutPanelCellPosition(1, 6); 只读 TableLayoutPanelCellPosition tlCCgrossLbl = new TableLayoutPanelCellPosition(0, 7); 只读 TableLayoutPanelCellPosition tlCCgrossTxt = new TableLayoutPanelCellPosition(1, 7); 只读 TableLayoutPanelCellPosition tlCCgrossError = new TableLayoutPanelCellPosition(2, 7); 只读 TableLayoutPanelCellPosition tlStdnarrativeLbl = new TableLayoutPanelCellPosition(0, 5); 只读 TableLayoutPanelCellPosition tlStdnarrativeTxt = new TableLayoutPanelCellPosition(1, 5); 只读 TableLayoutPanelCellPosition tlStdgrossLbl = new TableLayoutPanelCellPosition(0, 6); 只读 TableLayoutPanelCellPosition tlStdgrossTxt = new TableLayoutPanelCellPosition(1, 6); 只读 TableLayoutPanelCellPosition tlStdgrossError = new TableLayoutPanelCellPosition(2, 6); 只读 TableLayoutPanelCellPosition tlStdLoanPymntsLbl = new TableLayoutPanelCellPosition(0, 8); 只读 TableLayoutPanelCellPosition tlStdLoanPymntsCmb = new TableLayoutPanelCellPosition(1, 8); 只读 TableLayoutPanelCellPosition tlStdLoanPymntsError = new TableLayoutPanelCellPosition(2, 8); 只读 TableLayoutPanelCellPosition tlStdLoanLbl = new TableLayoutPanelCellPosition(0, 9); 只读 TableLayoutPanelCellPosition tlStdLoanError = new TableLayoutPanelCellPosition(2, 9); 只读 TableLayoutPanelCellPosition tlStdccLbl = new TableLayoutPanelCellPosition(0, 10); 只读 TableLayoutPanelCellPosition tlStdccList = new TableLayoutPanelCellPosition(1, 10); 只读 TableLayoutPanelCellPosition tlStdccError = new TableLayoutPanelCellPosition(2, 10); 只读 TableLayoutPanelCellPosition tlLnLoanLbl = new TableLayoutPanelCellPosition(0, 5); 只读 TableLayoutPanelCellPosition tlLnLoanCmb = new TableLayoutPanelCellPosition(1, 5); 只读 TableLayoutPanelCellPosition tlLnLoanError = new TableLayoutPanelCellPosition(2, 5); 只读 TableLayoutPanelCellPosition tlLnLoanPymntsLbl = new TableLayoutPanelCellPosition(0, 6); 只读 TableLayoutPanelCellPosition tlLnLoanPymntsCmb = new TableLayoutPanelCellPosition(1, 6); 只读 TableLayoutPanelCellPosition tlLnLoanPymntsError = new TableLayoutPanelCellPosition(2, 6); 只读 TableLayoutPanelCellPosition tlLnnarrativeLbl = new TableLayoutPanelCellPosition(0, 7); 只读 TableLayoutPanelCellPosition tlLnnarrativeTxt = new TableLayoutPanelCellPosition(1, 7); 只读 TableLayoutPanelCellPosition tlLngrossLbl = new TableLayoutPanelCellPosition(0, 8); 只读 TableLayoutPanelCellPosition tlLngrossTxt = new TableLayoutPanelCellPosition(1, 8); 只读 TableLayoutPanelCellPosition tlLngrossError = new TableLayoutPanelCellPosition(2, 8); 私人无效 cmbTransactionType_SelectedIndexChanged（对象发送者，EventArgs e） { ToggleLoanControls(false); ToggleCreditCardControls(false); ToggleReceiptNumbers(); if (clsTransactionTypes.TransactionStringToTransactionID(cmbTransactionType.Text) == clsTransactionTypes.LoanPayments || clsTransactionTypes.TransactionStringToTransactionID(cmbTransactionType.Text) == clsTransactionTypes.HpPayment) ToggleLoanControls(true); 否则如果（clsTransactionTypes.TransactionStringToTransactionID（cmbTransactionType.Text）== clsTransactionTypes.TransferToCreditCardCard） ToggleCreditCardControls(true); SetupViews(cmbTransactionType.Text); } 私人无效SetupViews（字符串transactionTypeSelected） { if (transactionTypeSelected == "信用卡付款") SetupCreditCardsLayouts(); else if(transactionTypeSelected == "HP Payment" || transactionTypeSelected == "Loan Payment") SetupLoanLayouts(); 别的 设置标准布局（）； } 私人无效SetupLoanLayouts（） { tableBank1Income.SetCellPosition(panelLoans, tlLnLoanCmb); tableBank1Income.SetCellPosition(lblLoans, tlLnLoanLbl); tableBank1Income.SetCellPosition(lblErrorLoanName, tlLnLoanError); tableBank1Income.SetCellPosition(cmbNumberOfLoanPayments, tlLnLoanPymntsCmb); tableBank1Income.SetCellPosition(lblLoanPayments, tlLnLoanPymntsLbl); tableBank1Income.SetCellPosition(lblErrorLoanPayments, tlLnLoanPymntsError); tableBank1Income.SetCellPosition(txtTransactionGross, tlLngrossTxt); tableBank1Income.SetCellPosition(lblTransactionAmount, tlLngrossLbl); tableBank1Income.SetCellPosition(lblErrorTransactionGross, tlLngrossError); tableBank1Income.SetCellPosition(txtTransactionNarrative, tlLnnarrativeTxt); tableBank1Income.SetCellPosition(lblTransactionNarrative, tlLnnarrativeLbl); tableBank1Income.SetCellPosition(panelCreditCards, tlStdccList); tableBank1Income.SetCellPosition(lblCreditCard, tlStdccLbl); tableBank1Income.SetCellPosition(lblCCError, tlStdccError); } 私人无效设置标准布局（） { tableBank1Income.SetCellPosition(txtTransactionGross, tlStdgrossTxt); tableBank1Income.SetCellPosition(lblTransactionAmount, tlStdgrossLbl); tableBank1Income.SetCellPosition(lblErrorTransactionGross, tlStdgrossError); tableBank1Income.SetCellPosition(txtTransactionNarrative, tlStdnarrativeTxt); tableBank1Income.SetCellPosition(lblTransactionNarrative, tlStdnarrativeLbl); tableBank1Income.SetCellPosition(txtTransactionGross, tlStdgrossTxt); tableBank1Income.SetCellPosition(lblTransactionAmount, tlStdgrossLbl); tableBank1Income.SetCellPosition(lblErrorTransactionGross, tlStdgrossError); tableBank1Income.SetCellPosition(panelLoans, tlStdLoanLbl); tableBank1Income.SetCellPosition(lblLoans, tlStdLoanLbl); tableBank1Income.SetCellPosition(lblErrorLoanName, tlStdLoanError); tableBank1Income.SetCellPosition(cmbNumberOfLoanPayments, tlStdLoanPymntsCmb); tableBank1Income.SetCellPosition(lblLoanPayments, tlStdLoanPymntsLbl); tableBank1Income.SetCellPosition(lblErrorLoanPayments, tlStdLoanPymntsError); tableBank1Income.SetCellPosition(panelCreditCards, tlStdccList); tableBank1Income.SetCellPosition(lblCreditCard, tlStdccLbl); tableBank1Income.SetCellPosition(lblCCError, tlStdccError); lblCCError.Visible = false; lblErrorLoanName.Visible = 假； lblErrorLoanPayments.Visible = false; } 私人无效SetupCreditCardsLayouts（） { tableBank1Income.SetCellPosition(panelCreditCards, tlCCccList); tableBank1Income.SetCellPosition(lblCreditCard, tlCCccLbl); tableBank1Income.SetCellPosition(lblCCError, tlCCccError); tableBank1Income.SetCellPosition(txtTransactionGross, tlCCgrossTxt); tableBank1Income.SetCellPosition(lblTransactionAmount, tlCCgrossLbl); tableBank1Income.SetCellPosition(lblErrorTransactionGross, tlCCgrossError); tableBank1Income.SetCellPosition(txtTransactionNarrative, tlCCnarrativeTxt); tableBank1Income.SetCellPosition(lblTransactionNarrative, tlCCnarrativeLbl); tableBank1Income.SetCellPosition(panelLoans, tlStdLoanLbl); tableBank1Income.SetCellPosition(lblLoans, tlStdLoanLbl); tableBank1Income.SetCellPosition(lblErrorLoanName, tlStdLoanError); tableBank1Income.SetCellPosition(cmbNumberOfLoanPayments, tlStdLoanPymntsCmb); tableBank1Income.SetCellPosition(lblLoanPayments, tlStdLoanPymntsLbl); tableBank1Income.SetCellPosition(lblErrorLoanPayments, tlStdLoanPymntsError); }

代码通过将不需要的控件移到表格底部并将需要的控件移到上方来工作。这样，表格中就没有间隙了。例如我不想只是打开和关闭 Loan 组合框的可见性，因为这样交易类型和两行的叙述之间就会存在差距。我总是希望它尽可能紧凑。

当前系统的唯一问题是底部有空行包含不可见的控件。添加行也很困难，因为我必须更改所有处理移动内容的代码。

感谢您的阅读，如果您能走到这一步。

有一个>呸

谢谢

未列出切换控件方法。他们基本上打开/关闭不需要可见性的控件。

Answer 1

我发现自己偶尔会遇到类似的情况，并且更喜欢不那么混乱的方法：

1. 首先，您的屏幕截图似乎表明一列就足够了，因为第一列的宽度已经通过长标签“交易金额（总）”“固定”。所以删除一列。
2. 将每个标签/文本框对放入其自己的（常规）面板中。所以每行一个面板。 （由于左侧“列”宽度是固定的，您可以使所有面板的宽度相同，并确保文本框对齐。）
3. 将所有面板添加到 TableLayoutPanel。
4. 将 TableLayoutPanel 的所有行的高度设置为“自动调整大小”。为 TableLayoutPanel 设置 AutoSize=true 和 AutoSizeMode=GrowAndShrink。

要调整表单的布局，您现在只需要设置 9 个面板的 Visible-property。如果面板被隐藏，表格布局的整行将因为 AutoSizing 行而消失，而其他行将向上移动。如果您出现新行，则相同。所以布局是自动化的，你只需要决定显示哪一行。

此外，TableLayoutPanel 现在将缩小到其内容。如果您愿意，您现在还可以使用包含表单的 AutoSize* 属性来使表单自动调整大小，但要小心避免这种行为惹恼您的用户。您还可以根据需要处理 TableLayoutPanel 的 SizeChanged 事件来调整表单的大小。

我希望我的描述是可以理解的，否则请随时询问详细信息。