如何添加切换开关 (XAML)

本教程指导你逐步完成向使用 C++、C# 或 Visual Basic 的 Windows 运行时应用中添加切换开关的步骤。

通常,可以使用 Extensible Application Markup Language (XAML) 编辑器或设计工具(如 Blend for Visual Studio)来添加切换开关。你还可以在运行时使用代码添加切换开关。

路线图: 本主题与其他主题有何关联?请参阅:

你需要了解的内容

技术

先决条件

说明

步骤 1: 使用 XAML 添加切换开关

Hh868198.wedge(zh-cn,WIN.10).gif使用 XAML 添加切换开关

  1. 向父容器中添加一个 ToggleSwitch 控件。
  2. 若要为切换开关分配一个名称,请将 x:Name 属性设置为一个字符串值。

    若要在代码中引用某个控件,该控件必须有名称。否则,名称不是必需的。

  3. 若要为切换开关分配一个标题,请将 Header 属性设置为一个字符串值。
  4. 若要分配一个标签来显示何时打开切换开关,请将 OnContent 属性设置为一个字符串值。
  5. 若要分配一个标签来显示何时关闭切换开关,请将 OffContent 属性设置为一个字符串值。
  6. 若要在切换开关状态发生变化时执行相应的操作,请为 Toggled 事件添加一个处理程序。在 Toggled 事件处理程序中,添加用来执行某项操作的代码。
    
    <ToggleSwitch x:Name="toggleSwitch1" Header="ToggleSwitch" 
                  OnContent="On" OffContent="Off" 
                  Toggled="ToggleSwitch_Toggled"/>
    
    
    
    
    private void ToggleSwitch_Toggled(object sender, RoutedEventArgs e)
    {
        // Add code to perform some action here.
    }
    
    
    

    若要检查 Toggled 事件外部控件的状态,请使用 IsOn 属性。

步骤 2: 使用代码添加切换开关

Hh868198.wedge(zh-cn,WIN.10).gif使用代码添加切换开关

  1. 创建一个新的 ToggleSwitch
  2. 若要为切换开关分配一个标题,请将 Header 属性设置为一个字符串值。
  3. 若要分配一个标签来显示何时打开切换开关,请将 OnContent 属性设置为一个字符串值。
  4. 若要分配一个标签来显示何时关闭切换开关,请将 OffContent 属性设置为一个字符串值。
  5. 若要在切换开关状态发生变化时执行相应的操作,请为 Toggled 事件添加一个处理程序。在 Toggled 事件处理程序中,添加用来执行某项操作的代码。
  6. 将该 ToggleSwitch 添加到可视化树中的父容器中使切换开关显示在 UI 中。
    
    // Create a new toggle switch, set it's content, 
    // and add a Toggled event handler.
    ToggleSwitch toggleSwitch1 = new ToggleSwitch();
    toggleSwitch1.Header = "Toggle Switch";
    toggleSwitch1.OnContent = "On";
    toggleSwitch1.OffContent = "Off";
    toggleSwitch1.Toggled += ToggleSwitch_Toggled;
    
    // Add the toggle switch to a parent container in the visual tree.
    stackPanel1.Children.Add(toggleSwitch1);
    
    
    
    
    private void ToggleSwitch_Toggled(object sender, RoutedEventArgs e)
    {
        // Add code to perform some action here.
    }
    
    
    

    若要检查 Toggled 事件外部控件的状态,请使用 IsOn 属性。

步骤 3: 使用设计工具添加切换开关

Hh868198.wedge(zh-cn,WIN.10).gif使用设计工具添加切换开关

  1. 选择 ToggleSwitch 控件。
    • 在 Microsoft Visual Studio 的“工具箱”窗格中,选取 ToggleSwitch
    • 在 Blend for Visual Studio 的“资产”窗格中,选取 ToggleSwitch

      在“资产”窗格的左侧选择“控件”(如果它尚未选择的话)。

  2. 向设计图面中添加一个 ToggleSwitch。执行其中一项:
    • 双击该切换开关。该切换开关将添加到选定的父容器中,该容器具有默认的位置和大小设置。
    • 将该切换开关拖放到设计图面上。该切换开关将添加到你将其拖放到的位置,该位置具有默认的大小和内容设置。
    • 在设计图面上绘制该切换开关控件。将添加一个具有你所绘制的大小和位置设置的切换开关。
  3. 如果需要的话,请为 ToggleSwitch 分配一个名称。在该切换开关处于选中状态时,在“名称”属性文本框中键入名称。

    “名称”属性文本框位于“属性”窗格的顶部。若要在代码中引用某个控件,该控件必须有名称。否则,名称不是必需的。

  4. 更新 ToggleSwitch 标题。在该切换开关处于选中状态时,在“标题”属性文本框中键入内容字符串。

    如果“属性”窗格按“类别”排列,则“标题”属性位于“通用”类别下。

  5. 如果需要的话,更新该标签以显示何时打开 ToggleSwitch。在该切换开关处于选中状态时,在“OnContent”属性文本框中键入内容字符串。

    如果“属性”窗格按“类别”排列,则“OnContent”属性位于“通用”类别下。默认值为 "On"。

  6. 如果需要的话,更新该标签以显示何时关闭 ToggleSwitch。在该切换开关处于选中状态时,在“OffContent”属性文本框中键入内容字符串。

    如果“属性”窗格按“类别”排列,则“OffContent”属性位于“通用”类别下。默认值为 "Off"。

  7. 若要在切换开关状态发生变化时执行相应的操作,请为 Toggled 事件添加一个处理程序。在 Toggled 事件处理程序中,添加用来执行某项操作的代码。
    1. 在“属性”窗格中选择“事件”视图。
    2. 在选中设计图面上的切换开关时,执行以下操作之一:
      • 双击 Toggled 事件文本框以添加具有默认名称的处理程序。
      • Toggled 事件文本框中键入名称并按 Enter 键,以添加具有自定义名称的处理程序。

相关主题

ToggleSwitch
切换开关指南和清单
使用 C# 或 Visual Basic 的 Windows 运行时应用的路线图
使用 C++ 的 Windows 运行时应用的路线图

 

 

显示:
© 2015 Microsoft