themes eingebaut, müssen noch verfeinert werden

This commit is contained in:
OliverT87 2025-06-21 13:00:43 +02:00
parent f2646952c1
commit 53d3a39fa5
10 changed files with 281 additions and 233 deletions

View File

@ -0,0 +1,9 @@
namespace Project_Periodensystem.Model
{
public enum AppTheme
{
Dark,
Light,
Classic
}
}

View File

@ -4,8 +4,29 @@
xmlns:i="using:Avalonia.Interactivity"
x:Class="Project_Periodensystem.View.AboutPage"
Background="#5C5144">
<UserControl.Styles>
<Style Selector="Button">
<Setter Property="Background" Value="Black"/>
<Setter Property="Foreground" Value="White"/>
</Style>
<Style Selector="Button:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="DarkRed"/>
</Style>
<Style Selector="Button:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="Red"/>
</Style>
</UserControl.Styles>
<Grid>
<StackPanel VerticalAlignment="Center"
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<!-- Content -->
<StackPanel Grid.Row="0"
VerticalAlignment="Center"
HorizontalAlignment="Center">
<TextBlock Text="Author: Oliver Träger"
FontSize="20"
@ -24,23 +45,34 @@
Margin="0,0,0,40"/>
</StackPanel>
<!-- Footer with Buttons -->
<Grid Grid.Row="1"
Margin="20,0,20,20">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Button Name="ThemeButton"
Grid.Column="0"
Click="ThemeButton_Click"
Width="250"
Height="40">
<TextBlock Text="Theme wechseln"
FontSize="16"
HorizontalAlignment="Center"/>
</Button>
<Button x:Name="BackButton"
Grid.Column="2"
Click="BackButton_Click"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Margin="20"
Padding="20,10"
Background="Black"
Foreground="White">
<Button.Styles>
<Style Selector="Button:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="DarkRed"/>
</Style>
<Style Selector="Button:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="Red"/>
</Style>
</Button.Styles>
Back
Width="200"
Height="40">
<TextBlock Text="Back"
FontSize="16"
HorizontalAlignment="Center"/>
</Button>
</Grid>
</Grid>
</UserControl>

View File

@ -3,6 +3,7 @@ using Avalonia.Controls;
using Avalonia.Interactivity;
using Avalonia.Markup.Xaml;
using Avalonia.VisualTree;
using Project_Periodensystem.Model;
namespace Project_Periodensystem.View
{
@ -14,26 +15,30 @@ namespace Project_Periodensystem.View
}
private void InitializeComponent()
=> AvaloniaXamlLoader.Load(this);
{
AvaloniaXamlLoader.Load(this);
}
private void BackButton_Click(object sender, RoutedEventArgs e)
private void BackButton_Click(object? sender, RoutedEventArgs e)
{
try
if (this.Parent is ContentControl content && content.Parent is MainWindow mainWindow)
{
var mainWindow = this.FindAncestorOfType<MainWindow>();
if (mainWindow != null)
mainWindow.ShowLandingPage();
}
}
private void ThemeButton_Click(object? sender, RoutedEventArgs e)
{
mainWindow.ShowLanding();
}
else
var nextTheme = MainWindow.CurrentTheme switch
{
Console.WriteLine("MainWindow nicht gefunden!");
}
}
catch (Exception ex)
AppTheme.Dark => AppTheme.Light,
AppTheme.Light => AppTheme.Classic,
_ => AppTheme.Dark
};
if (this.Parent is ContentControl content && content.Parent is MainWindow mainWindow)
{
Console.WriteLine($"Fehler in BackButton_Click: {ex.Message}");
Console.WriteLine($"StackTrace: {ex.StackTrace}");
mainWindow.UpdateTheme(nextTheme);
}
}
}

View File

@ -1,7 +1,7 @@
using System;
using System.Globalization;
using Avalonia.Data.Converters;
using Avalonia.Media;
using System;
using System.Globalization;
namespace Project_Periodensystem.View.Converters
{
@ -9,14 +9,13 @@ namespace Project_Periodensystem.View.Converters
{
public object? Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
{
if (value is not string series)
return new SolidColorBrush(Color.Parse("#222222")); // fallback
if (value == null) return new SolidColorBrush(Colors.Gray);
return series switch
return value.ToString() switch
{
"Nichtmetall" => new SolidColorBrush(Color.Parse("#3e6418")),
"Metall" => new SolidColorBrush(Color.Parse("#711019")), // Übergangsmetall
"Post-Übergangsmetall" => new SolidColorBrush(Color.Parse("#555555")), // neu hinzugefügt
"Metall" => new SolidColorBrush(Color.Parse("#711019")),
"Post-Übergangsmetall" => new SolidColorBrush(Color.Parse("#555555")),
"Halbmetall" => new SolidColorBrush(Color.Parse("#015146")),
"Edelgas" => new SolidColorBrush(Color.Parse("#3a2151")),
"Halogen" => new SolidColorBrush(Color.Parse("#846011")),
@ -24,11 +23,13 @@ namespace Project_Periodensystem.View.Converters
"Erdalkalimetall" => new SolidColorBrush(Color.Parse("#846011")),
"Lanthanoid" => new SolidColorBrush(Color.Parse("#402c17")),
"Actinoid" => new SolidColorBrush(Color.Parse("#732e4c")),
_ => new SolidColorBrush(Color.Parse("#222222")),
_ => new SolidColorBrush(Color.Parse("#222222"))
};
}
public object? ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture) =>
public object? ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
}

View File

@ -2,31 +2,57 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="Project_Periodensystem.View.LandingPage"
Background="#5C5144">
<Grid>
<TextBlock Text="Willkommen zum Periodensystem der Elemente!"
FontSize="36"
HorizontalAlignment="Center"
VerticalAlignment="Top"
Margin="0,40,0,0"/>
<Button Name="StartButton"
Click="StartButton_Click"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Width="200"
Height="50"
Background="Black"
Foreground="White">
<Button.Styles>
<UserControl.Styles>
<Style Selector="Button">
<Setter Property="Background" Value="Black"/>
<Setter Property="Foreground" Value="White"/>
</Style>
<Style Selector="Button:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="DarkRed"/>
</Style>
<Style Selector="Button:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="Red"/>
</Style>
</Button.Styles>
</UserControl.Styles>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<!-- Hauptcontent -->
<Grid Grid.Row="0">
<StackPanel VerticalAlignment="Center"
Margin="0,-100,0,0">
<TextBlock Text="Willkommen zum Periodensystem der Elemente!"
FontSize="36"
HorizontalAlignment="Center"
Margin="0,0,0,20"/>
<Button Name="StartButton"
Click="StartButton_Click"
HorizontalAlignment="Center"
Width="200"
Height="50">
<TextBlock Text="Start"
FontSize="24"
HorizontalAlignment="Center"/>
</Button>
</StackPanel>
</Grid>
<!-- Theme Button -->
<Button Name="ThemeButton"
Grid.Row="1"
Click="ThemeButton_Click"
HorizontalAlignment="Left"
VerticalAlignment="Bottom"
Width="250"
Height="40"
Margin="20,0,0,20">
<TextBlock Text="Theme wechseln"
FontSize="16"
HorizontalAlignment="Center"/>
</Button>
</Grid>
</UserControl>

View File

@ -2,21 +2,35 @@ using Avalonia;
using Avalonia.Controls;
using Avalonia.Interactivity;
using Avalonia.Markup.Xaml;
using Avalonia.VisualTree;
using Avalonia.Media;
using Project_Periodensystem.Model;
using System;
using System.Collections.Generic;
namespace Project_Periodensystem.View
{
public partial class LandingPage : UserControl
{
private readonly Random random = new();
private readonly Dictionary<AppTheme, string> themeColors;
private AppTheme currentTheme;
private Button? startButton;
private DateTime lastClickTime = DateTime.MinValue;
private const int DEBOUNCE_MS = 500;
public LandingPage()
{
Logger.Log("=== LandingPage wird initialisiert ===");
Logger.Log($"=== LandingPage wird initialisiert am {DateTime.Now:dd.MM.yyyy HH:mm:ss} ===");
InitializeComponent();
themeColors = new Dictionary<AppTheme, string>
{
{ AppTheme.Dark, "#5C5144" },
{ AppTheme.Light, "#E8DFD8" },
{ AppTheme.Classic, "#7B8B6F" }
};
SetRandomTheme();
startButton = this.Find<Button>("StartButton");
if (startButton != null)
@ -36,6 +50,25 @@ namespace Project_Periodensystem.View
AvaloniaXamlLoader.Load(this);
}
private void SetRandomTheme()
{
var themes = Enum.GetValues<AppTheme>();
currentTheme = themes[random.Next(themes.Length)];
this.Background = new SolidColorBrush(Color.Parse(themeColors[currentTheme]));
Logger.Log($"Theme gewählt: {currentTheme}");
}
private void ThemeButton_Click(object? sender, RoutedEventArgs e)
{
var themes = Enum.GetValues<AppTheme>();
currentTheme = themes[(Array.IndexOf(themes, currentTheme) + 1) % themes.Length];
if (this.Parent is ContentControl content && content.Parent is MainWindow mainWindow)
{
mainWindow.UpdateTheme(currentTheme);
}
}
private void StartButton_Click(object? sender, RoutedEventArgs e)
{
// Stop event propagation
@ -54,16 +87,9 @@ namespace Project_Periodensystem.View
try
{
var mainWindow = this.FindAncestorOfType<MainWindow>();
if (mainWindow != null)
if (this.Parent is ContentControl content && content.Parent is MainWindow mainWindow)
{
Logger.Log("MainWindow gefunden, starte Navigation...");
mainWindow.ShowPeriodicTable();
Logger.Log("Navigation ausgeführt");
}
else
{
Logger.Log("FEHLER: MainWindow nicht gefunden!");
}
}
catch (Exception ex)

View File

@ -5,7 +5,6 @@
Width="1024"
Height="768">
<Grid>
<ContentControl Name="MainContent"/>
</Grid>
</Window>

View File

@ -1,101 +1,52 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Markup.Xaml;
using Avalonia.Media;
using Project_Periodensystem.Model;
using System;
using System.Collections.Generic;
namespace Project_Periodensystem.View
{
public partial class MainWindow : Window
{
private readonly ContentControl? mainContent;
private ContentControl? mainContent;
public static AppTheme CurrentTheme { get; set; } = AppTheme.Dark;
public static Dictionary<AppTheme, string> ThemeColors { get; } = new()
{
{ AppTheme.Dark, "#5C5144" },
{ AppTheme.Light, "#E8DFD8" },
{ AppTheme.Classic, "#7B8B6F" }
};
public MainWindow()
{
InitializeComponent();
try
{
Console.WriteLine("MainWindow wird initialisiert...");
var content = this.Find<ContentControl>("MainContent");
if (content == null)
{
Console.WriteLine("FEHLER: MainContent nicht gefunden!");
throw new Exception("MainContent control not found.");
mainContent = this.FindControl<ContentControl>("MainContent");
ShowLandingPage();
}
mainContent = content;
Console.WriteLine("Navigation zur Landing Page...");
ShowLanding();
}
catch (Exception ex)
public void ShowLandingPage()
{
Console.WriteLine($"FEHLER in MainWindow Constructor: {ex.Message}");
}
}
public void ShowLanding()
{
try
{
Console.WriteLine("ShowLanding wird aufgerufen...");
if (mainContent != null)
{
mainContent.Content = new LandingPage();
}
else
{
Console.WriteLine("FEHLER: mainContent ist null in ShowLanding!");
}
}
catch (Exception ex)
{
Console.WriteLine($"FEHLER in ShowLanding: {ex.Message}");
}
mainContent!.Content = new LandingPage();
}
public void ShowPeriodicTable()
{
try
{
Logger.Log("ShowPeriodicTable wird aufgerufen...");
if (mainContent != null)
{
var periodicTablePage = new PeriodicTablePage();
mainContent.Content = periodicTablePage;
Logger.Log("PeriodicTablePage wurde geladen");
}
else
{
Logger.Log("FEHLER: mainContent ist null in ShowPeriodicTable!");
}
}
catch (Exception ex)
{
Logger.Log($"FEHLER in ShowPeriodicTable: {ex.Message}");
}
mainContent!.Content = new PeriodicTablePage();
}
public void ShowAbout()
public void ShowAboutPage()
{
try
{
Console.WriteLine("ShowAbout wird aufgerufen...");
if (mainContent != null)
{
mainContent.Content = new AboutPage();
}
else
{
Console.WriteLine("FEHLER: mainContent ist null in ShowAbout!");
}
}
catch (Exception ex)
{
Console.WriteLine($"FEHLER in ShowAbout: {ex.Message}");
}
mainContent!.Content = new AboutPage();
}
private void InitializeComponent()
public void UpdateTheme(AppTheme theme)
{
AvaloniaXamlLoader.Load(this);
CurrentTheme = theme;
if (mainContent?.Content is UserControl control)
{
control.Background = new SolidColorBrush(Color.Parse(ThemeColors[theme]));
}
}
}
}

View File

@ -5,6 +5,19 @@
x:Class="Project_Periodensystem.View.PeriodicTablePage"
Background="#5C5144">
<UserControl.Styles>
<Style Selector="Button">
<Setter Property="Background" Value="Black"/>
<Setter Property="Foreground" Value="White"/>
</Style>
<Style Selector="Button:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="DarkRed"/>
</Style>
<Style Selector="Button:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="Red"/>
</Style>
</UserControl.Styles>
<UserControl.Resources>
<conv:SeriesToColorConverter x:Key="SeriesToColor"/>
</UserControl.Resources>
@ -25,7 +38,7 @@
HorizontalAlignment="Center"
Margin="0,0,0,20"/>
<!-- Periodensystem Grid -->
<!-- Periodic Table Grid -->
<ScrollViewer Grid.Row="1"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto">
@ -67,24 +80,34 @@
</Grid>
</ScrollViewer>
<!-- Footer with About Button -->
<Button Grid.Row="2"
x:Name="AboutButton"
Content="About"
<!-- Footer with Buttons -->
<Grid Grid.Row="2"
Margin="0,20,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Button Name="ThemeButton"
Grid.Column="0"
Click="ThemeButton_Click"
Width="250"
Height="40">
<TextBlock Text="Theme wechseln"
FontSize="16"
HorizontalAlignment="Center"/>
</Button>
<Button x:Name="AboutButton"
Grid.Column="2"
Click="AboutButton_Click"
HorizontalAlignment="Right"
Margin="0,20,0,0"
Padding="20,10"
Background="Black"
Foreground="White">
<Button.Styles>
<Style Selector="Button:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="DarkRed"/>
</Style>
<Style Selector="Button:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="Red"/>
</Style>
</Button.Styles>
Width="200"
Height="40">
<TextBlock Text="About"
FontSize="16"
HorizontalAlignment="Center"/>
</Button>
</Grid>
</Grid>
</UserControl>

View File

@ -1,42 +1,17 @@
using System;
using System.Globalization;
using System.Linq;
using Avalonia;
using Avalonia.Controls;
using Avalonia.Data.Converters;
using Avalonia.Interactivity;
using Avalonia.Markup.Xaml;
using Avalonia.Media;
using Avalonia.VisualTree;
using Project_Periodensystem.Model;
using Project_Periodensystem.Persistence;
using Project_Periodensystem.View.Converters;
using System;
using System.Globalization;
using System.Linq;
namespace Project_Periodensystem.View
{
// Converter to map element series to a color
public class SeriesToColorConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value == null) return new SolidColorBrush(Colors.Gray);
return value.ToString() switch
{
"Nichtmetall" => new SolidColorBrush(Color.Parse("#3e6418")),
"Metall" => new SolidColorBrush(Color.Parse("#711019")),
"Post-Übergangsmetall" => new SolidColorBrush(Color.Parse("#555555")),
"Halbmetall" => new SolidColorBrush(Color.Parse("#015146")),
"Edelgas" => new SolidColorBrush(Color.Parse("#3a2151")),
"Halogen" => new SolidColorBrush(Color.Parse("#846011")),
"Alkalimetall" => new SolidColorBrush(Color.Parse("#6c3b01")),
"Erdalkalimetall" => new SolidColorBrush(Color.Parse("#846011")),
"Lanthanoid" => new SolidColorBrush(Color.Parse("#402c17")),
"Actinoid" => new SolidColorBrush(Color.Parse("#732e4c")),
_ => new SolidColorBrush(Color.Parse("#222222"))
};
}
}
public partial class PeriodicTablePage : UserControl
{
private readonly Grid? periodicGrid;
@ -129,25 +104,26 @@ namespace Project_Periodensystem.View
}
}
private void ThemeButton_Click(object? sender, RoutedEventArgs e)
{
var nextTheme = MainWindow.CurrentTheme switch
{
AppTheme.Dark => AppTheme.Light,
AppTheme.Light => AppTheme.Classic,
_ => AppTheme.Dark
};
if (this.Parent is ContentControl content && content.Parent is MainWindow mainWindow)
{
mainWindow.UpdateTheme(nextTheme);
}
}
private void AboutButton_Click(object? sender, RoutedEventArgs e)
{
try
if (this.Parent is ContentControl content && content.Parent is MainWindow mainWindow)
{
Logger.Log("AboutButton wurde geklickt");
var mainWindow = this.FindAncestorOfType<MainWindow>();
if (mainWindow != null)
{
Logger.Log("Navigation zu About Page");
mainWindow.ShowAbout();
}
else
{
Logger.Log("FEHLER: MainWindow nicht gefunden");
}
}
catch (Exception ex)
{
Logger.Log($"FEHLER im AboutButton_Click: {ex.Message}");
mainWindow.ShowAboutPage();
}
}
}