C#之WPF学习之路(6)

目录

内容控件(3)

GroupBox标题容器控件

ScrollViewer控件

ScrollBar滚动条

Slider滑动条

ProgressBar进度条

Calendar日历控件

DatePicker日期控件

Expander折叠控件

MediaElement媒体播放器


内容控件(3)

GroupBox标题容器控件

GroupBox 控件通常用于创建一个带标题的容器,用于组织其他控件,并且可以将它们分组在一起。它继承自 WPF (Windows Presentation Foundation) 中的 HeaderedContentControl 类,而 HeaderedContentControl 又继承自 ContentControl 类。

GroupBox 提供了一种将相关控件组合在一起并为它们提供标题的方法,从而改善界面的可读性和可理解性。通过将一组相关控件放置在 GroupBox 内,可以使用户更容易地理解这些控件之间的关系,并且可以通过 GroupBox 的标题来描述这组控件的目的或功能。

虽然 GroupBox 本身没有太多成员,但可以利用其基类的成员来对其进行操作和定制。ContentControl 类提供了控件内容的基本功能,而 HeaderedContentControl 则在此基础上添加了标题的支持,使得 GroupBox 具有了标题和内容的功能。通过设置 Header 属性可以指定 GroupBox 的标题,通过设置 Content 属性可以指定 GroupBox 中包含的内容。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <!-- 创建一个 GroupBox -->
        <GroupBox Header="个人信息" Margin="10">
            <!-- 在 GroupBox 中放置相关控件 -->
            <StackPanel Margin="10">
                <TextBlock>姓名:</TextBlock>
                <TextBox Width="150"/>
                <TextBlock>年龄:</TextBlock>
                <TextBox Width="50"/>
                <TextBlock>性别:</TextBlock>
                <ComboBox Width="100">
                    <ComboBoxItem>男性</ComboBoxItem>
                    <ComboBoxItem>女性</ComboBoxItem>
                </ComboBox>
            </StackPanel>
        </GroupBox>
    </Grid>
</Window>

ScrollViewer控件

ScrollViewer 用于封装一个可滚动区域,当内容尺寸过大而无法在当前界面完全显示时,可以使用它来让用户通过滚动条查看全部内容。因为 ScrollViewer 继承自 ContentControl,所以它只能包含单个子元素。如果需要在其中显示多个子元素,需要将它们放在一个集合控件中,然后将该集合控件设置为 ScrollViewer 的 Content 属性。ScrollViewer 能够响应用户的鼠标滚轮操作以及键盘命令,以实现内容的滚动。ScrollViewer 提供了一些方法,允许按照预设的增量进行内容的滚动,这使得用户可以更精准地控制滚动操作。通过监听 ScrollChanged 事件,你可以检测 ScrollViewer 的状态变化,比如滚动位置的变化等。

ScrollViewer类的定义

public class ScrollViewer : ContentControl
{
    public static readonly DependencyProperty CanContentScrollProperty;
    public static readonly DependencyProperty PanningRatioProperty;
    public static readonly DependencyProperty PanningDecelerationProperty;
    public static readonly DependencyProperty PanningModeProperty;
    public static readonly RoutedEvent ScrollChangedEvent;
    public static readonly DependencyProperty IsDeferredScrollingEnabledProperty;
    public static readonly DependencyProperty ViewportWidthProperty;
    public static readonly DependencyProperty ScrollableHeightProperty;
    public static readonly DependencyProperty ScrollableWidthProperty;
    public static readonly DependencyProperty ExtentHeightProperty;
    public static readonly DependencyProperty ViewportHeightProperty;
    public static readonly DependencyProperty ContentHorizontalOffsetProperty;
    public static readonly DependencyProperty ContentVerticalOffsetProperty;
    public static readonly DependencyProperty HorizontalOffsetProperty;
    public static readonly DependencyProperty ExtentWidthProperty;
    public static readonly DependencyProperty VerticalOffsetProperty;
    public static readonly DependencyProperty ComputedVerticalScrollBarVisibilityProperty;
    public static readonly DependencyProperty ComputedHorizontalScrollBarVisibilityProperty;
    public static readonly DependencyProperty VerticalScrollBarVisibilityProperty;
    public static readonly DependencyProperty HorizontalScrollBarVisibilityProperty;
 
    public ScrollViewer();
 
    public bool CanContentScroll { get; set; }
    public ScrollBarVisibility HorizontalScrollBarVisibility { get; set; }
    public ScrollBarVisibility VerticalScrollBarVisibility { get; set; }
    public Visibility ComputedHorizontalScrollBarVisibility { get; }
    public Visibility ComputedVerticalScrollBarVisibility { get; }
    public double HorizontalOffset { get; }
    public double VerticalOffset { get; }
    public double ExtentWidth { get; }
    public double ExtentHeight { get; }
    public double PanningDeceleration { get; set; }
    public double ScrollableHeight { get; }
    public double ViewportWidth { get; }
    public double ViewportHeight { get; }
    public double ContentVerticalOffset { get; }
    public double ContentHorizontalOffset { get; }
    public bool IsDeferredScrollingEnabled { get; set; }
    public PanningMode PanningMode { get; set; }
    public double ScrollableWidth { get; }
    public double PanningRatio { get; set; }
    protected internal override bool HandlesScrolling { get; }
    protected internal IScrollInfo ScrollInfo { get; set; }
 
    public event ScrollChangedEventHandler ScrollChanged;
 
    public static bool GetCanContentScroll(DependencyObject element);
    public static ScrollBarVisibility GetHorizontalScrollBarVisibility(DependencyObject element);
    public static bool GetIsDeferredScrollingEnabled(DependencyObject element);
    public static double GetPanningDeceleration(DependencyObject element);
    public static PanningMode GetPanningMode(DependencyObject element);
    public static double GetPanningRatio(DependencyObject element);
    public static ScrollBarVisibility GetVerticalScrollBarVisibility(DependencyObject element);
    public static void SetCanContentScroll(DependencyObject element, bool canContentScroll);
    public static void SetHorizontalScrollBarVisibility(DependencyObject element, ScrollBarVisibility horizontalScrollBarVisibility);
    public static void SetIsDeferredScrollingEnabled(DependencyObject element, bool value);
    public static void SetPanningDeceleration(DependencyObject element, double value);
    public static void SetPanningMode(DependencyObject element, PanningMode panningMode);
    public static void SetPanningRatio(DependencyObject element, double value);
    public static void SetVerticalScrollBarVisibility(DependencyObject element, ScrollBarVisibility verticalScrollBarVisibility);
    public void InvalidateScrollInfo();
    public void LineDown();
    public void LineLeft();
    public void LineRight();
    public void LineUp();
    public override void OnApplyTemplate();
    public void PageDown();
    public void PageLeft();
    public void PageRight();
    public void PageUp();
    public void ScrollToBottom();
    public void ScrollToEnd();
    public void ScrollToHome();
    public void ScrollToHorizontalOffset(double offset);
    public void ScrollToLeftEnd();
    public void ScrollToRightEnd();
    public void ScrollToTop();
    public void ScrollToVerticalOffset(double offset);
    protected override Size ArrangeOverride(Size arrangeSize);
    protected override HitTestResult HitTestCore(PointHitTestParameters hitTestParameters);
    protected override Size MeasureOverride(Size constraint);
    protected override AutomationPeer OnCreateAutomationPeer();
    protected override void OnKeyDown(KeyEventArgs e);
    protected override void OnManipulationCompleted(ManipulationCompletedEventArgs e);
    protected override void OnManipulationDelta(ManipulationDeltaEventArgs e);
    protected override void OnManipulationInertiaStarting(ManipulationInertiaStartingEventArgs e);
    protected override void OnManipulationStarting(ManipulationStartingEventArgs e);
    protected override void OnMouseLeftButtonDown(MouseButtonEventArgs e);
    protected override void OnMouseWheel(MouseWheelEventArgs e);
    protected virtual void OnScrollChanged(ScrollChangedEventArgs e);
    protected override void OnStylusSystemGesture(StylusSystemGestureEventArgs e);
 
}

ScrollViewer 控件中的两个重要属性以及一个事件:

1、HorizontalScrollBarVisibility 和 VerticalScrollBarVisibility 这两个属性用于控制水平和垂直方向的滚动条的可见性。它们都是枚举类型 ScrollBarVisibility。

ScrollBarVisibility 枚举确实定义了四个值:

  • Disabled: 表示滚动条被禁用,即不显示滚动条。
  • Auto: 表示根据内容的大小自动决定是否显示滚动条。如果内容超出了 ScrollViewer 的可视区域,则会显示对应方向的滚动条,否则隐藏。
  • Hidden: 表示始终隐藏滚动条,即使内容超出了可视区域。
  • Visible: 表示始终显示滚动条,即使内容未超出可视区域。

因此,在设置 HorizontalScrollBarVisibility="Auto" 和 VerticalScrollBarVisibility="Auto" 时,如果内容超出了可视区域,则对应方向的滚动条会自动显示,否则隐藏。而当设置为 Visible 时,无论内容是否超出可视区域,滚动条都会始终显示。

2、ScrollChanged 事件: 这个事件在 ScrollViewer 控件的滚动位置发生变化时触发。通过订阅这个事件,你可以在滚动位置发生变化时执行相应的逻辑,例如更新界面或执行其他操作。这个事件对于监控滚动状态和执行相关逻辑非常有用。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <ScrollViewer Name="scrollViewer" 
                      HorizontalScrollBarVisibility="Auto"
                      VerticalScrollBarVisibility="Auto"
                      ScrollChanged="ScrollViewer_ScrollChanged">
            <StackPanel Name="stackPanel">
                <!-- 这里将在代码中动态添加大量按钮 -->
            </StackPanel>
        </ScrollViewer>
    </Grid>
</Window>
using System.Windows;
using System.Windows.Controls;

namespace WpfApp2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            AddButtonsToStackPanel();
        }
        private void AddButtonsToStackPanel()
        {
            // 添加大量按钮到 StackPanel 中
            for (int i = 0; i < 50; i++)
            {
                Button button = new Button();
                button.Content = "Button " + (i + 1);
                stackPanel.Children.Add(button);
            }
        }

        private void ScrollViewer_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {
            // 滚动位置发生变化时触发此事件
            double horizontalOffset = scrollViewer.HorizontalOffset;
            double verticalOffset = scrollViewer.VerticalOffset;
            double extentWidth = scrollViewer.ExtentWidth;
            double extentHeight = scrollViewer.ExtentHeight;
        }
    }
}

ScrollBar滚动条

ScrollBar(滚动条):它表示一个滚动条,其中包含一个可拖动的滑块(Thumb),其位置对应于一个值。ScrollBar继承自 RangeBase 抽象基类,该类提供了处理范围值的功能,如最小值、最大值和当前值等。RangeBase 进一步继承自 Control 基类,这意味着 ScrollBar 具有控件的基本功能,如样式、模板等。

RangeBase 类具有以下属性:

  • LargeChange:表示给 Value 属性加减的最大值。默认为 1。
  • SmallChange:表示给 Value 属性加减的最小值。默认为 0.1。
  • Value:获取或设置范围控件的当前数量。默认为 0。
  • Maximum:获取或设置 Value 属性的最大值。
  • Minimum:获取或设置 Value 属性的最小值。

以及一个事件成员:

  • ValueChanged:当前 Value 属性发生改变时触发的事件。

ScrollBar 控件有两个重要的属性:

  • Orientation:表示当前滚动条是水平的还是垂直的。这是一个枚举类型的属性,其值可以是 Horizontal(水平方向)或 Vertical(垂直方向)。通过设置这个属性,可以确定滚动条的方向,以便与相应的滚动内容相匹配。
  • ViewportSize:表示当前可见的可滚动内容的数量。默认值为 0。这个属性通常用于指定可见内容的大小,以便滚动条可以根据内容的实际大小进行相应的调整。例如,在一个文本框或图像浏览器中,可以使用 ViewportSize 来指定可见区域的大小,以便滚动条正确地显示内容。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <ScrollViewer x:Name="scrollViewer" VerticalScrollBarVisibility="Auto">
            <StackPanel x:Name="stackPanel" />
        </ScrollViewer>
        <ScrollBar Orientation="Vertical" Minimum="0" Maximum="500" 
                   ValueChanged="ScrollBar_ValueChanged" 
                   Height="{Binding ElementName=scrollViewer, Path=ActualHeight}"/>
    </Grid>
</Window>
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;

namespace WpfApp2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            AddContent();
        }

        private void AddContent()
        {
            for (int i = 0; i < 100; i++)
            {
                // 创建一个新的 TextBlock
                TextBlock textBlock = new TextBlock();
                textBlock.Text = "Content " + i;
                textBlock.Margin = new Thickness(10); // 设置一些边距以增加可读性

                // 将 TextBlock 添加到 StackPanel 中
                stackPanel.Children.Add(textBlock);
            }
        }

        // 滚动条值变化时的事件处理程序
        private void ScrollBar_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            // 当滚动条的值变化时,修改 ScrollViewer 的垂直偏移量
            if (scrollViewer != null)
            {
                scrollViewer.ScrollToVerticalOffset(e.NewValue);
            }
        }
    }
}

Slider滑动条

Slider 滑动条和 ScrollBar 滚动条在某些情况下可以相互替代使用,因为它们都可以用于用户界面中的滑动操作,Slider也继承于RangeBase基类。

 Slider 控件的常用属性的说明:

  • IsSnapToTickEnabled: 如果设置为 true,滑块会在最近的刻度线上捕捉到,使得滑块的值总是停留在刻度线上。
  • AutoToolTipPrecision: 设置滑块值的小数点位数,用于自动工具提示显示。
  • AutoToolTipPlacement: 按下滑块时是否显示提示工具,可以设置为 None、TopLeft、BottomRight、TopRight、或 BottomLeft。
  • Interval: 设置用户按住增加或减少按钮时执行增加或减少命令的时间间隔(以毫秒为单位)。
  • Delay: 设置用户按住增加或减少按钮时延迟多少毫秒后执行命令。
  • IsDirectionReversed: 设置增加值的方向,如果为 true,增加值的方向将被反转。
  • Orientation: 设置滑块的方向,可以是水平或垂直。
  • TickFrequency: 设置刻度线之间的间隔,默认为 1.0。
  • Ticks: 设置或获取 Slider 显示的刻度线的位置。
  • SelectionStart: 设置指定选择内容的起始值,用于选择范围。
  • TickPlacement: 设置刻度线的位置,可以是 None、TopLeft、BottomRight、TopRight、或 BottomLeft。
  • IsSelectionRangeEnabled: 设置是否显示选择范围。
  • IsMoveToPointEnabled: 如果设置为 true,Thumb 会立即移动到鼠标单击的位置。
  • SelectionEnd: 设置指定选择内容的结束值,用于选择范围。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!-- Slider 控件用于控制图片的大小 -->
        <Slider x:Name="slider" Grid.Row="0" Minimum="50" Maximum="400" Value="100" 
                TickFrequency="10" IsSnapToTickEnabled="True" 
                HorizontalAlignment="Stretch" VerticalAlignment="Center"
                Margin="10" />

        <!-- 图片元素 -->
        <Image x:Name="image" Grid.Row="1" Source="/Images/meimei.png"
        HorizontalAlignment="Center" VerticalAlignment="Center"
               Stretch="Uniform" />
    </Grid>
</Window>
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;

namespace WpfApp2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            slider.ValueChanged += Slider_ValueChanged;
        }

        private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            // 当 Slider 的值改变时,更新图片的宽度和高度
            image.Width = e.NewValue;
            image.Height = e.NewValue;
        }
    }
}

ProgressBar进度条

ProgressBar 进度条在执行长时间任务时非常有用,它可以向用户显示任务的执行进度,从而提供良好的用户体验。

ProgressBar 控件具有 IsIndeterminate 和 Orientation 两个重要属性,它们对于控制进度条的行为和外观至关重要。

  • IsIndeterminate: 当设置为 true 时,表示进度条以动画形式展示,而不是实际表示已完成的进度。这在某些情况下很有用,特别是当任务的进度无法准确衡量时,或者任务的进度不确定时。
  • Orientation: 用于指定进度条的方向。水平方向时,进度条从左到右增长;垂直方向时,进度条从下到上增长。这使得 ProgressBar 可以适应不同的布局需求和设计风格。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <Button Grid.Row="0" Content="启动任务" Click="StartTask_Click"/>
        <ProgressBar Grid.Row="1" x:Name="progressBar" Minimum="0" Maximum="100" Value="0"/>
        <TextBlock Grid.Row="2" x:Name="progressText" Text="进度: 0%"/>
    </Grid>
</Window>
using System.Windows;

namespace WpfApp2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private async void StartTask_Click(object sender, RoutedEventArgs e)
        {
            // 模拟一个长时间任务,每隔一段时间更新一次进度
            for (int i = 0; i <= 100; i++)
            {
                // 更新 ProgressBar 的值
                progressBar.Value = i;

                // 更新 TextBlock 显示的进度文本
                progressText.Text = "进度: " + i + "%";

                // 模拟任务执行的延迟
                await Task.Delay(100);
            }

            // 任务完成后,显示完成消息
            MessageBox.Show("任务完成!");
        }
    }
}

Calendar日历控件

在 WPF 中,Calendar 控件提供了一个日历界面,允许用户选择日期。它用于显示日历,并允许用户选择特定日期。Calendar 控件继承自 Control 基类,具有灵活的样式和模板,可以根据需要进行自定义。

Calendar 控件是 WPF 中用于选择日期的一个常用控件,它具有一些重要的属性成员:

  • DisplayDateStart: 获取或设置日历中可选择的第一个日期。即日历显示的起始日期。
  • CalendarItemStyle: 获取或设置 CalendarItem 的样式,用于自定义日历项的外观。
  • CalendarDayButtonStyle: 获取或设置 CalendarDayButton 的样式,用于自定义日期按钮的外观。
  • CalendarButtonStyle: 获取或设置 CalendarButton 的样式,用于自定义日历按钮(例如切换月份的按钮)的外观。
  • BlackoutDates: 获取标记为不可选择的日期的集合,这些日期不会在日历中显示。
  • DisplayMode: 获取或设置日历的显示模式,可以是月、年或十年。
  • DisplayDateEnd: 获取或设置日历中可选择的最后一个日期。
  • IsTodayHighlighted: 获取或设置一个值,指示是否突出显示当前日期。默认为 true。
  • SelectedDate: 获取或设置当前选定的日期。这是一个重要的属性,用于获取用户选择的日期。
  • SelectedDates: 获取选定日期的集合,如果 SelectionMode 设置为多选模式,可以从此属性获取所有已选的日期。
  • SelectionMode: 获取或设置一个值,指示允许选择的模式,可以是单选或多选。
  • DisplayDate: 获取或设置要显示的日期,可以用来设置日历显示的月份或年份。
  • FirstDayOfWeek: 获取或设置在一周中被视为周的开始,即日历中的每周的第一天。

Calendar 控件还具有一些重要的事件成员,用于响应用户与日历交互时的各种操作:

  • SelectedDatesChanged: 当所选日期的集合发生变化时引发,特别是在开启多选模式后。这个事件在用户选择新日期或取消选择日期时触发。
  • DisplayDateChanged: 当 DisplayDate 属性被修改后引发,即日历显示的日期发生变化时触发。这个事件可以用来在日历显示日期改变时执行一些操作。
  • SelectionModeChanged: 当 SelectionMode 属性(选择模式)发生改变后引发。这个事件可以用来监视选择模式的变化,并在需要时进行相应的处理。
  • DisplayModeChanged: 当 DisplayMode 属性(显示模式)发生改变后引发。这个事件可以用来监视显示模式的变化,并在需要时进行相应的处理。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <Calendar x:Name="calendar" HorizontalAlignment="Center" VerticalAlignment="Center"
          DisplayMode="Month" DisplayDateStart="2022/01/01" DisplayDateEnd="2022/12/31"
          SelectedDatesChanged="Calendar_SelectedDatesChanged"/>
        <TextBlock x:Name="selectedDateText" HorizontalAlignment="Center" VerticalAlignment="Top"
                   Margin="0,20,0,0" FontSize="16"/>
    </Grid>
</Window>
using System.Windows;
using System.Windows.Controls;


namespace WpfApp2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
        private void Calendar_SelectedDatesChanged(object sender, SelectionChangedEventArgs e)
        {
            // 当用户选择了一个新的日期时,更新 TextBlock 中显示的日期
            DateTime selectedDate = calendar.SelectedDate ?? DateTime.Now; // 获取选定的日期,如果为空,则使用当前日期
            selectedDateText.Text = "选定日期: " + selectedDate.ToShortDateString();
        }

    }
}

DatePicker日期控件

DatePicker 和 Calendar 在某些方面确实相似,但在用户界面上有一些重要的区别,它们旨在用于不同的日期选择场景。DatePicker 控件用于选择单个日期,通常以文本框的形式显示当前选定的日期,并且可以通过弹出的日期选择器来选择新的日期。

以下是 DatePicker 控件的属性的说明:

  • BlackoutDates: 获取或设置为不可选择的日期的标记集合。这个属性允许您指定一些日期,使其在日历中不可选择。通常用于标记某些特殊日期,例如节假日或已过期的日期。
  • DisplayDateStart: 获取或设置要显示的第一个日期。用于设置日历中可显示的日期范围的起始日期。
  • DisplayDateEnd: 获取或设置要显示的最后日期。用于设置日历中可显示的日期范围的结束日期。
  • DisplayDate: 获取或设置要显示的日期。用于设置日历显示的月份或年份。
  • CalendarStyle: 获取或设置呈现日历时所使用的样式。允许您自定义日历的外观和样式。
  • IsTodayHighlighted: 获取或设置一个值,该值指示是否将突出显示当前日期。如果设置为 true,则当前日期会以特殊方式突出显示。
  • IsDropDownOpen: 获取或设置一个值,该值指示 DatePicker 下拉列表是打开还是关闭。当设置为 true 时,显示日期选择器弹出窗口。
  • SelectedDateFormat: 获取或设置用于显示所选的日期的格式。允许您指定所选日期的显示格式,例如短日期格式或长日期格式。
  • Text: 获取 DatePicker 显示的文本,或设置选定的日期。可以通过设置这个属性来直接设置选定的日期,或者获取当前选定的日期的文本表示。
  • FirstDayOfWeek: 获取或设置在一周中被视为周的开始。用于指定日历中一周的起始日期,例如星期日或星期一。
  • SelectedDate: 获取或设置当前选定的日期。用于获取用户选择的日期,或者设置初始选定的日期。
  • HasEffectiveKeyboardFocus: 获取一个值,该值指示 DatePicker 是否具有焦点。用于确定 DatePicker 是否当前具有键盘焦点。

以下是 DatePicker 控件的事件的说明:

  • CalendarClosed: 当 DatePicker 下拉列表关闭时引发此事件。这个事件在用户关闭日期选择器弹出窗口后触发,可以用于在日期选择完成后执行一些逻辑操作。
  • CalendarOpened: 当 DatePicker 下拉列表打开时引发此事件。这个事件在用户打开日期选择器弹出窗口时触发,可以用于在用户打开日期选择器时执行一些逻辑操作。
  • SelectedDateChanged: 当 SelectedDate 属性发生改变时引发此事件。这个事件在用户选择了一个新的日期时触发,可以用于在日期改变时执行一些逻辑操作。
  • DateValidationError: 当 Text 属性不是日期形式的字符串时引发此事件。这个事件在用户输入的文本无法解析为有效日期时触发,可以用于在日期输入验证失败时执行一些逻辑操作,例如显示错误信息或恢复默认日期。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <DatePicker x:Name="datePicker" HorizontalAlignment="Center" VerticalAlignment="Center"
                    SelectedDateChanged="DatePicker_SelectedDateChanged"/>
        <TextBlock x:Name="selectedDateText" HorizontalAlignment="Center" VerticalAlignment="Top"
                   Margin="0,20,0,0" FontSize="16"/>
    </Grid>
</Window>
using System.Windows;
using System.Windows.Controls;


namespace WpfApp2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
        private void DatePicker_SelectedDateChanged(object sender, RoutedEventArgs e)
        {
            // 当用户选择了一个新的日期时,更新 TextBlock 中显示的日期
            DateTime selectedDate = datePicker.SelectedDate ?? DateTime.Now; // 获取选定的日期,如果为空,则使用当前日期
            selectedDateText.Text = "选定日期: " + selectedDate.ToShortDateString();
        }
    }
}

Expander折叠控件

Expander 是一个内容控件,通常用于在界面上展示可展开和收缩的区域。它包含一个标题和一个内容,用户可以点击标题来展开或收缩内容。

属性成员:

  1. ExpandDirection: 定义了 Expander 的内容在展开时的方向。可选值有 Down、Up、Left 和 Right,其中默认方向为 Down。
  2. IsExpanded: 获取或设置内容窗口是否可见。当设置为 true 时,表示展开 Expander;当设置为 false 时,表示折叠 Expander。

事件成员:

  1. Expanded: 当 Expander 的内容展开时触发的事件。
  2. Collapsed: 当 Expander 的内容折叠时触发的事件。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <StackPanel>
            <Expander Header="更多的选择" ExpandDirection="Down" IsExpanded="True" Width="386" Height="96">
                <StackPanel>
                    <CheckBox Content="选择 1"/>
                    <CheckBox Content="选择 2"/>
                    <CheckBox Content="选择 3"/>
                </StackPanel>
            </Expander>
        </StackPanel>
    </Grid>
</Window>

MediaElement媒体播放器

MediaElement 是一个强大的控件,用于在 WPF 应用程序中播放音频和视频。

以下是关于 MediaElement 的介绍:

  • 继承关系: MediaElement 继承自 FrameworkElement 基类,这使得它可以像其他 WPF 控件一样在 UI 中进行布局和操作。
  • 功能特点: MediaElement 具有播放音频或视频的功能,并且支持多种常见的音频和视频格式,如 MP3、WAV、WMA、MP4、AVI 等。
  • 两种使用模式: MediaElement 可以在两种不同的模式下使用,具体取决于驱动控件的内容:
  • 独立模式(Independent Mode): 在此模式下,MediaElement 类似于图像,可以直接指定 URI 来播放音频或视频。
  • 时钟模式(Clock Mode): 在此模式下,MediaElement 可以被视为动画的目标,因此它将在计时树中具有相应的 Timeline 和 Clock 条目。这种模式常用于与动画和其他时间相关的功能集成。
  • VLC 库: 虽然 MediaElement 提供了基本的音频和视频播放功能,但如果需要更强大的功能,如更广泛的格式支持、流媒体支持等,可以考虑使用 VLC 库。

总的来说,MediaElement 是在 WPF 应用程序中播放音频和视频的重要控件之一,可以满足大多数基本的音视频播放需求,同时还具有灵活性,可根据应用程序的需要选择不同的使用模式。

以下是关于 MediaElement 控件的属性的说明:

  1. LoadedBehavior: 获取或设置加载媒体的行为。可以设置为 Play、Pause、Stop 或 Manual。设置为 Manual 表示希望手动控制播放。
  2. CanPause: 获取一个值,指示是否可以暂停媒体。
  3. IsBuffering: 获取一个值,指示是否正在缓冲媒体。
  4. DownloadProgress: 获取一个百分比值,表示位于远程服务器上的内容已经下载的百分比。
  5. BufferingProgress: 获取一个值,指示缓冲进度的百分比,取值范围为 0 到 1。
  6. NaturalVideoHeight: 获取与媒体关联的视频的高度。
  7. NaturalDuration: 获取媒体的自然持续时间,即视频播放的总时长。
  8. HasAudio: 获取一个值,指示媒体是否具有音频。
  9. HasVideo: 获取一个值,指示媒体是否具有视频。
  10. Position: 获取或设置媒体的播放位置,通过媒体的播放时间表示。
  11. SpeedRatio: 获取或设置媒体的播放速率,可以设置为正数(加速播放)或负数(减速播放)。
  12. UnloadedBehavior: 获取或设置卸载媒体的行为。
  13. NaturalVideoWidth: 获取与媒体关联的视频的宽度。
  14. ScrubbingEnabled: 获取或设置一个值,指示 MediaElement 是否允许在暂停状态下更新帧的查找操作。
  15. Clock: 获取或设置 MediaElement 媒体播放相关联的时钟。
  16. Balance: 获取或设置扬声器的音量平衡比例。
  17. Volume: 获取或设置媒体的音量,取值范围为 0 到 1,默认为 0.5。
  18. StretchDirection: 获取或设置一个值,确定扩展的限制应用于映像。
  19. Stretch: 获取或设置 MediaElement 媒体的拉伸方式。
  20. Source: 获取或设置 MediaElement 的媒体源。这是 MediaElement 控件的关键属性,用于指定要播放的音频或视频的位置。
  21. IsMuted: 获取或设置一个值,指示媒体是否静音。

以下是关于 MediaElement 控件的事件成员的说明:

  • BufferingEnded: 当媒体缓冲结束时发生的事件。这表示媒体已经完成了缓冲,可以开始播放。
  • BufferingStarted: 当媒体缓冲开始时发生的事件。这表示媒体开始进行缓冲,通常在开始播放之前发生。
  • MediaOpened: 当媒体加载完成时发生的事件。在该事件中,媒体资源已经成功加载,并且可以开始播放或进行其他操作。
  • MediaFailed: 当媒体加载过程中遇到错误时发生的事件。这个事件表示媒体加载失败,可能由于无法找到媒体文件、格式不支持等原因。
  • MediaEnded: 当媒体播放结束时发生的事件。这表示媒体已经播放到末尾,并且播放已完成。
  • ScriptCommand: 当在媒体中遇到脚本命令时发生的事件。这个事件通常用于处理媒体中嵌入的脚本命令,例如 JavaScript。

例子:

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="学习之路" Height="450" Width="800">
    <Grid>
        <MediaElement x:Name="mediaPlayer" Source="Media/sample.mp3"
                      LoadedBehavior="Manual" UnloadedBehavior="Stop"
                      Volume="0.5" Stretch="UniformToFill"
                      MediaOpened="mediaPlayer_MediaOpened" MediaEnded="mediaPlayer_MediaEnded"/>
        <StackPanel HorizontalAlignment="Center" VerticalAlignment="Bottom" Orientation="Horizontal">
            <Button Content="播放" Click="PlayButton_Click"/>
            <Button Content="暂停" Click="PauseButton_Click"/>
            <Button Content="停止" Click="StopButton_Click"/>
        </StackPanel>
    </Grid>
</Window>
using System.Windows;

namespace WpfApp2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void PlayButton_Click(object sender, RoutedEventArgs e)
        {
            mediaPlayer.Play();
        }

        private void PauseButton_Click(object sender, RoutedEventArgs e)
        {
            mediaPlayer.Pause();
        }

        private void StopButton_Click(object sender, RoutedEventArgs e)
        {
            mediaPlayer.Stop();
        }

        private void mediaPlayer_MediaOpened(object sender, RoutedEventArgs e)
        {
            // 媒体加载完成时发生的逻辑
            Console.WriteLine("媒体已加载。");
        }

        private void mediaPlayer_MediaEnded(object sender, RoutedEventArgs e)
        {
            // 媒体播放结束时发生的逻辑
            Console.WriteLine("媒体已结束。");
        }
    }
}

  • 17
    点赞
  • 22
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

程序员老李头

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值