65.9K
CodeProject 正在变化。 阅读更多。
Home

Windows 原生功能区第 1.5 部分：控件和组的布局

Michael Dunn
starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.92/5 (25投票s)

2011 年 4 月 27 日

CPOL

8分钟阅读

viewsIcon

44581

downloadIcon

1284

本文介绍了如何在 Windows 原生 Ribbon 中布局控件

目录

引言

功能区中的控件首先按选项卡分组，然后在每个选项卡内的组中分组。在第一篇文章中，我们使用了最简单的组类型，即只包含一个按钮的组。这次，我们将探讨包含不同数量控件的更复杂的组。我们还将了解当功能区的父窗口调整大小时，如何控制组的行为。

构建示例代码的系统要求是 Visual Studio 2008、WTL 8.0 和 Windows 7 SDK。如果您运行的是 Windows 7 或 Server 2008 R2，则已具备所需的一切。如果您使用的是 Vista 或 Server 2008，则必须安装 Service Pack 2 和操作系统的 平台更新才能使用功能区。

本文假定您了解 COM，并且熟悉功能区使用基础知识。如果您需要回顾如何在应用程序中使用功能区的相关信息，请参阅我的 功能区入门文章。（本文为 1.5 部分，因为入门功能区文章是 Win 7 Goodies 文章。我正在将功能区文章作为单独的系列，但这并非第 1 部分或第 2 部分。因此，是 1.5 部分！）

组大小定义

在第一篇文章中，我们在 <Group> 标签中看到了 SizeDefinition="OneButton" 属性。当时我对此属性一带而过，但现在我们将探讨该属性的作用。

尽管组的内容和呈现方式是分开的，功能区仍然需要知道如何布局组的控件。按钮可以以各种方式排列并以不同的尺寸显示。根据可用空间量，还可以有多种布局组的方式。控制组在给定大小下如何布局的规则集称为**大小定义**。

存在许多预定义的尺寸定义，适用于不同数量的按钮和尺寸。每个尺寸定义都有一个名称，例如“OneButton”。MSDN 提供了预定义尺寸定义列表。在本文中，我们将查看一些仅包含按钮的组的预定义尺寸定义。此处不涵盖其他类型的控件（如库）。

预定义组大小

大多数预定义的尺寸定义都有多个尺寸。有些具有 Large 和 Medium 尺寸，而有些还具有 Small 尺寸。组的控件将根据尺寸定义中的规则进行布局和调整大小。

这是具有 FourButtons 尺寸定义且包含所有三种尺寸的组的外观。

请注意，在某些情况下，按钮标签可能会被隐藏。这使得为每个按钮提供一个好的图标和工具提示非常重要，以便用户仍然可以知道按钮的作用。

控制组大小

设置组的理想大小

每个组都有一个**理想大小**，即您首选的组布局。只要空间足够，所有组都将以其理想大小显示。如果组需要更多空间，并且功能区没有因为主窗口太小而隐藏自身，功能区将通过分页控件显示当前选项卡，以便用户仍然可以访问选项卡中的所有控件。

组的理想大小默认为其尺寸定义中的最大尺寸，但您可以通过在功能区 XML 中指定不同尺寸来更改它。组大小通过 <Tab.ScalingPolicy> 标签中包含的各种标签进行控制。组的理想大小列在 <ScalingPolicy.IdealSizes> 标签中。例如，以下是创建上面图片中显示的选项卡的方法，该选项卡具有三个都使用 FourButtons 尺寸定义但具有不同理想大小的组。

<Tab CommandName='tabMain'>
  <Tab.ScalingPolicy>
    <ScalingPolicy>
      <ScalingPolicy.IdealSizes>
        <Scale Group='group1' Size='Large' />
        <Scale Group='group2' Size='Medium' />
        <Scale Group='group3' Size='Small' />
      <ScalingPolicy.IdealSizes>
    </ScalingPolicy>
  </Tab.ScalingPolicy>
  <!-- groups here -->
</Tab>

请注意，每个选项卡都有自己的理想大小列表，因此可以将一个组放在两个选项卡中，并为组的每个实例使用不同的理想大小。

调整组大小

当可用空间变小时，功能区还支持调整组的大小。**缩放策略**是一组规则，当空间不足以显示所有组的理想大小时，功能区将应用这些规则。

选项卡的缩放策略使用 <ScalingPolicy> 的子标签 <Scale> 编写。这些 <Scale> 标签的顺序很重要；缩放规则按其编写的顺序应用。功能区将继续应用缩放规则，直到发生以下情况之一：

  • 有足够的空间来显示应用了迄今为止所有缩放规则的组。
  • 所有缩放规则都已应用，但仍然没有足够的空间来显示所有组。发生这种情况时，功能区会在分页控件中显示选项卡。
  • 功能区的父窗口太小，导致功能区隐藏自身。

例如，这是一个缩放策略，它使 group1 更改为 Medium 大小，然后更改为 Small 大小。

<Tab CommandName='tabMain'>
  <Tab.ScalingPolicy>
    <ScalingPolicy>
      <ScalingPolicy.IdealSizes>
        <!-- ideal sizes from before... -->
      <ScalingPolicy.IdealSizes>
      <Scale Group='group1' Size='Medium' />
      <Scale Group='group1' Size='Small' />
    </ScalingPolicy>
  </Tab.ScalingPolicy>
  <!-- groups here -->
</Tab>

以下是选项卡应用这些规则时的外观。

请注意，使用此策略，group2 和 group3 不会调整大小；功能区不会自行创建任何大小规则。

在缩放规则集中，有一个特殊的 Size 值：Popup。此大小会将整个组缩小为一个按钮。单击该按钮后，组将在弹出窗口中显示。

Microsoft 建议所有组至少有一个显示组为弹出窗口的缩放规则，以避免滚动。

以下是我们示例选项卡的完整缩放策略定义。

<Tab CommandName='tabMain'>
  <Tab.ScalingPolicy>
    <ScalingPolicy>
      <ScalingPolicy.IdealSizes>
        <Scale Group='group1' Size='Large' />
        <Scale Group='group2' Size='Medium' />
        <Scale Group='group3' Size='Small' />
      <ScalingPolicy.IdealSizes>
      <Scale Group='group1' Size='Medium' />
      <Scale Group='group1' Size='Small' />
      <Scale Group='group2' Size='Small' />
      <Scale Group='group3' Size='Popup' />
      <Scale Group='group1' Size='Popup' />
      <Scale Group='group2' Size='Popup' />
    </ScalingPolicy>
  </Tab.ScalingPolicy>
  <!-- groups here -->
</Tab>

以下是功能区在决定如何布局组时应用的规则。

  1. group1 从 Large 大小开始。
  2. group2 从 Medium 大小开始。
  3. group3 从 Small 大小开始。
  4. group1 调整为 Medium 大小。
  5. group1 调整为 Small 大小。
  6. group2 调整为 Small 大小。
  7. group3 调整为 Popup。
  8. group1 调整为 Popup。
  9. group2 调整为 Popup。

通常，大组应首先调整大小，选项卡右侧的组应首先调整大小。这样可以使最大数量的控件保持可见，同时避免滚动。但是，这些只是指导原则；没有任何东西可以阻止您以不同的顺序调整组的大小。（事实上，在上面的示例中，group1 在 group2 之前调整为 Popup。）uicc 会检查您的调整大小规则是否始终从较大的尺寸到较小的尺寸。如果您不遵循此顺序，uicc 将发出错误。

控件组和可选控件

当您使用包含大量控件的组时，有时需要在组定义中使用 <ControlGroup> 标签。<ControlGroup> 有两个作用：它告诉功能区哪些控件应分组在一起，并它将必需控件块与可选控件块分开。

例如，预定义的尺寸定义 BigButtonsAndSmallButtonsOrInputs 具有一个包含两个控件（均为可选）的组，后跟一个包含三个控件（其中一个可选）的组。以下是如何使用所有可用控件定义这样的组。

  <Group CommandName="grpBigAndSmallBtns"
         SizeDefinition="BigButtonsAndSmallButtonsOrInputs">
    <ControlGroup>
      <Button CommandName="cmdBtn1" />
      <Button CommandName="cmdBtn2" />
    </ControlGroup>
    <ControlGroup>
      <Button CommandName="cmdBtn3" />
      <Button CommandName="cmdBtn4" />
      <Button CommandName="cmdBtn5" />
    </ControlGroup>
  </Group>

但是，如果您只想使用必需的控件，则可以这样定义。

  <Group CommandName="grpBigAndSmallBtns"
         SizeDefinition="BigButtonsAndSmallButtonsOrInputs">
    <ControlGroup />
    <ControlGroup>
      <Button CommandName="cmdBtn1" />
      <Button CommandName="cmdBtn2" />
    </ControlGroup>
  </Group>

请注意，当组不包含任何控件时，您仍需要编写一个空的 <ControlGroup> 标签。

以下是组在这两种配置下的外观。

从文档中并非总是清楚哪些尺寸定义需要 <ControlGroup>。事实上，截至撰写本文时，MSDN 页面并未说明在使用 BigButtonsAndSmallButtonsOrInputs 尺寸定义时需要 <ControlGroup> 标签。如果组定义缺少必需的 <ControlGroup>，或者 <ControlGroup> 标签包含的控件数量不正确，uicc 将发出错误。错误会指示哪个标签违反了模式，尽管有时不会给出确切的规则，因此您可能需要对 XML 进行一些试验，直到找到 uicc 接受的内容。

关于组的其他事实

组是一个命令，您可以在其 <Command> 标签中指定工具提示和小图像。这些属性在两种情况下使用：

  1. 将组添加到 QAT 时。您可以右键单击组的标签，然后从上下文菜单中选择添加到快速访问工具栏，将组添加到 QAT。
  2. 当组缩小为 Popup 时。

代表组的图标会绘制一个额外的边框。在下面的屏幕截图中，已将一个组添加到 QAT。如果组没有图标，结果将是一个空方块。这是为组分配图像很重要的另一个原因。

即使您可以在组的 <Command> 标签中指定 Keytip 属性，但该键盘提示会被忽略。已缩小为弹出窗口的组具有键盘提示，但这些键盘提示由功能区分配，如下所示。

示例应用程序

本文的示例应用程序有三个选项卡，演示了文章中涵盖的组的各种方面。

  • 无缩放：此选项卡有三个 FourButtons 组，如前所述。组不调整大小。
  • 可缩放：此选项卡有相同的组，但还具有一个缩放策略，演示了真实应用程序如何处理组的缩放。
  • 大型组：此选项卡有四个组，包含更多控件，并有一个缩放策略。此选项卡演示了各种类型的组在其尺寸定义中所有尺寸下的外观，并且还演示了 <ControlGroup> 标签的几个用法。

您可以尝试使用各种尺寸定义和缩放策略来试验 XML，以更好地了解这些属性如何影响功能区的外观。

结论

现在我们已经看到了如何设置控件和组，我们已经涵盖了让应用程序运行并具备功能区的基础知识。下次，我们将探讨如何在运行时设置功能区属性，这对于功能区的其他几个功能至关重要。

修订历史

2011 年 4 月 18 日：文章首次发布

© . All rights reserved.