cgx/petwash
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 优化UI

Browse Source
This commit is contained in:
GukSang.Jin
2026-02-26 13:49:38 +08:00
parent 5f52b06ac2
commit 76c594e14a
4 changed files with 102 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
PetWashControl/ViewModels/MainViewModel.cs
View File

@@ -71,6 +71,23 @@ public partial class MainViewModel : ObservableObject
[ObservableProperty]
private double _roomTemperature = 25.0;
[ObservableProperty]
private string _currentCarouselImage = "/Images/dog.png";
[ObservableProperty]
private string _deviceNumber = "设备编号: PW-001";
[ObservableProperty]
private string _currentDateTime = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
[ObservableProperty]
private string _currentDayOfWeek = DateTime.Now.ToString("dddd", new System.Globalization.CultureInfo("zh-CN"));
private readonly System.Timers.Timer _carouselTimer;
private readonly System.Timers.Timer _clockTimer;
private readonly string[] _carouselImages = { "/Images/dog.png", "/Images/dog1.jpg" };
private int _currentImageIndex = 0;
public MainViewModel()
{
_config = new ConfigurationService();
@@ -81,6 +98,31 @@ public partial class MainViewModel : ObservableObject
// 初始化洗护步骤
InitializeWashSteps();
// 初始化图片轮播定时器（每5秒切换）
_carouselTimer = new System.Timers.Timer(5000);
_carouselTimer.Elapsed += (s, e) =>
{
Application.Current.Dispatcher.Invoke(() =>
{
_currentImageIndex = (_currentImageIndex + 1) % _carouselImages.Length;
CurrentCarouselImage = _carouselImages[_currentImageIndex];
});
};
_carouselTimer.Start();
// 初始化时钟定时器（每秒更新）
_clockTimer = new System.Timers.Timer(1000);
_clockTimer.Elapsed += (s, e) =>
{
Application.Current.Dispatcher.Invoke(() =>
{
var now = DateTime.Now;
CurrentDateTime = now.ToString("yyyy-MM-dd HH:mm:ss");
CurrentDayOfWeek = now.ToString("dddd", new System.Globalization.CultureInfo("zh-CN"));
});
};
_clockTimer.Start();
}
private void InitializeWashSteps()

66
PetWashControl/Views/MainWindow.xaml
View File

@@ -105,6 +105,34 @@
<!-- 顶部标题栏 -->
<Border Grid.Row="0" Padding="30,20">
<Grid>
<!-- 左侧：设备信息和时间 -->
<StackPanel HorizontalAlignment="Left" VerticalAlignment="Center">
<Border
CornerRadius="12"
Padding="15,8"
Opacity="0.95">
<Border.Effect>
<DropShadowEffect Color="#000000" BlurRadius="8" ShadowDepth="3" Opacity="0.3"/>
</Border.Effect>
<StackPanel>
<TextBlock Text="{Binding DeviceNumber}"
FontSize="14"
FontWeight="SemiBold"
Foreground="#1B5E20"
Margin="0,0,0,4"/>
<!--<TextBlock Text="{Binding CurrentDateTime}"
FontSize="16"
FontWeight="Bold"
Foreground="#2E7D32"
Margin="0,0,0,2"/>
<TextBlock Text="{Binding CurrentDayOfWeek}"
FontSize="13"
Foreground="#558B2F"/>-->
</StackPanel>
</Border>
</StackPanel>
<!-- 中间：标题 -->
<TextBlock Text="全自动洗宠机"
FontSize="48"
FontWeight="Bold"
@@ -115,6 +143,8 @@
<DropShadowEffect Color="#FFFFFF" BlurRadius="10" ShadowDepth="0" Opacity="0.8"/>
</TextBlock.Effect>
</TextBlock>
<!-- 右侧：设置按钮 -->
<Button Content="⚙"
FontSize="32"
Width="60"
@@ -182,7 +212,7 @@
HorizontalAlignment="Center"/>
</Border>
<!-- 宠物大图 -->
<!-- 宠物大图轮播 -->
<Border Grid.Row="1"
Background="#F5F5F5"
CornerRadius="25"
@@ -191,9 +221,21 @@
<Border.Effect>
<DropShadowEffect Color="#4CAF50" BlurRadius="15" ShadowDepth="0" Opacity="0.4"/>
</Border.Effect>
<Image Source="/Images/dog.png"
<Image Source="{Binding CurrentCarouselImage}"
Stretch="Uniform"
Margin="10"/>
Margin="10">
<Image.Triggers>
<EventTrigger RoutedEvent="Image.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
From="0" To="1"
Duration="0:0:0.5"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
</Border>
</Grid>
</Border>
@@ -338,7 +380,7 @@
HorizontalAlignment="Center"/>
</Border>
<!-- 宠物大图 -->
<!-- 宠物大图轮播 -->
<Border Grid.Row="1"
Background="#F5F5F5"
CornerRadius="25"
@@ -347,9 +389,21 @@
<Border.Effect>
<DropShadowEffect Color="#FF6F00" BlurRadius="15" ShadowDepth="0" Opacity="0.4"/>
</Border.Effect>
<Image Source="/Images/dog.png"
<Image Source="{Binding CurrentCarouselImage}"
Stretch="Uniform"
Margin="10"/>
Margin="10">
<Image.Triggers>
<EventTrigger RoutedEvent="Image.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
From="0" To="1"
Duration="0:0:0.5"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
</Border>
</Grid>
</Border>