进度条

Wpf_AiSportsMicrospace/MyUserControl/WxProgressBar.xaml

@@ -0,0 +1,13 @@
+<UserControl x:Class="Wpf_AiSportsMicrospace.MyUserControl.WxProgressBar"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
+             x:Name="root"
+             Height="30" Width="600">
+    <Grid Background="#222">
+        <Border x:Name="LeftBar" Background="#FF4D4D" HorizontalAlignment="Left"/>
+        <Border x:Name="RightBar" Background="#33CC33"  HorizontalAlignment="Right"/>
+        <TextBlock x:Name="ProgressTextBlock" Foreground="White" FontSize="14" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+    </Grid>
+</UserControl>

Wpf_AiSportsMicrospace/MyUserControl/WxProgressBar.xaml.cs

@@ -0,0 +1,71 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+using System.Windows;
+using System.Windows.Controls;
+using System.Windows.Data;
+using System.Windows.Documents;
+using System.Windows.Input;
+using System.Windows.Media;
+using System.Windows.Media.Imaging;
+using System.Windows.Navigation;
+using System.Windows.Shapes;
+
+namespace Wpf_AiSportsMicrospace.MyUserControl
+{
+    /// <summary>
+    /// WxProgressBar.xaml 的交互逻辑
+    /// </summary>
+    public partial class WxProgressBar : UserControl
+    {
+        public WxProgressBar()
+        {
+            InitializeComponent();
+        }
+
+        #region 左右进度属性
+        private double _leftProgress;
+        public double LeftProgress
+        {
+            get => _leftProgress;
+            set
+            {
+                _leftProgress = Clamp(value, 0, 1);
+                RightProgress = 1 - _leftProgress; // 左多右少
+                UpdateVisual();
+            }
+        }
+
+        private double _rightProgress;
+        public double RightProgress
+        {
+            get => _rightProgress;
+            set
+            {
+                _rightProgress = Clamp(value, 0, 1);
+                _leftProgress = 1 - _rightProgress; // 右多左少
+                UpdateVisual();
+            }
+        }
+        #endregion
+
+        private void UpdateVisual()
+        {
+            double width = ActualWidth;
+            if (width <= 0) return;
+
+            LeftBar.Width = width * _leftProgress;
+            RightBar.Width = width * _rightProgress;
+
+            ProgressTextBlock.Text = $"{Math.Round(_leftProgress * 100)}% : {Math.Round(_rightProgress * 100)}%";
+        }
+
+        private double Clamp(double value, double min, double max) => value < min ? min : value > max ? max : value;
+
+        protected override void OnRenderSizeChanged(SizeChangedInfo sizeInfo)
+        {
+            base.OnRenderSizeChanged(sizeInfo);
+            UpdateVisual();
+        }
+    }
+}

Wpf_AiSportsMicrospace/Views/JumpRope/MusicJumpRope.xaml

@@ -35,5 +35,9 @@
                   TextAlignment="Center"
                   />
         </Grid>
+
+        <Grid  VerticalAlignment="Top">
+            <local:WxProgressBar x:Name="PkBar"/>
+        </Grid>
     </Grid>
 </UserControl>

Wpf_AiSportsMicrospace/Views/JumpRope/MusicJumpRope.xaml.cs

@@ -59,6 +59,31 @@ namespace Wpf_AiSportsMicrospace.Views.JumpRope
 
         private async void UserControl_Loaded(object sender, RoutedEventArgs e)
         {
+            Random _rand = new Random();
+            // 初始化进度
+            PkBar.LeftProgress = 0.5;  // 左右各占50%
+            await Task.Delay(500);
+
+            for (int i = 0; i < 20; i++)
+            {
+                await Task.Delay(300);
+
+                // 随机生成一个变化值 0~0.1
+                double delta = _rand.NextDouble() * 0.1;
+
+                // 随机决定左增加还是右增加
+                if (_rand.Next(0, 2) == 0)
+                {
+                    // 左增加 → 右减少
+                    PkBar.LeftProgress = Math.Min(1, PkBar.LeftProgress + delta);
+                }
+                else
+                {
+                    // 右增加 → 左减少
+                    PkBar.RightProgress = Math.Min(1, PkBar.RightProgress + delta);
+                }
+            }
+
             DrawCirclesWithText();
             // 播放音乐
             PlayMusic("raisehand.mp3");