This commit is contained in:
klappstuhl24 2023-08-04 17:05:25 +02:00
parent 83c4c46ed2
commit 152a7ac8b4
4 changed files with 131 additions and 4 deletions

View File

@ -3,7 +3,7 @@ Microsoft Visual Studio Solution File, Format Version 12.00
# Visual Studio Version 17
VisualStudioVersion = 17.6.33829.357
MinimumVisualStudioVersion = 10.0.40219.1
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "KIKunstKirstenKlöckner", "KIKunstKirstenKlöckner\KIKunstKirstenKlöckner.csproj", "{0085541E-50D4-42A5-9BFD-6CE402FB8B26}"
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "KIKunstKirstenKlöckner", "KIKunstKirstenKlöckner\KIKunstKirstenKlöckner.csproj", "{0085541E-50D4-42A5-9BFD-6CE402FB8B26}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution

View File

@ -26,8 +26,7 @@
@*<button @onclick="DoStuff">Klick mich</button>*@
<RadzenStack Orientation="Orientation.Vertical" AlignItems="AlignItems.Center">
<RadzenText TextStyle="TextStyle.H2">Nenne uns deinen Wunsch:</RadzenText>
<RadzenButton Text="Zur Gallery" Click="@NavigateToGallery" /> <RadzenText TextStyle="TextStyle.H2">Nenne uns deinen Wunsch:</RadzenText>
<RadzenTextBox @bind-Value=@request Placeholder="Dein Wunsch"/>
<RadzenPanel AllowCollapse="true" Style="width: 500px;" Text="Mehr Optionen">
@ -336,4 +335,12 @@
}
}
private void NavigateToGallery()
{
NavigationManager.NavigateTo("/gallery");
}
[Inject]
private NavigationManager NavigationManager { get; set; }
}

View File

@ -0,0 +1,120 @@
@page "/gallery"
<RadzenDataList WrapItems="@true" AllowPaging="true" Data="@imagePaths" PageSize="20" PagerHorizontalAlign="HorizontalAlign.Left" ShowPagingSummary="true" class="image-grid">
<Template Context="imagePath">
<div class="image-grid-item">
<RadzenCard Style="width: 200px; height: 200px; padding: 0; border: none;">
<RadzenButton Click="@(args => ShowImageInfo(imagePath))">
<RadzenImage Src="@imagePath" Style="width: 100%; height: 100%; object-fit: cover;" />
</RadzenButton>
</RadzenCard>
</div>
</Template>
</RadzenDataList>
<div class="image-popup" style="@popupStyle">
<div class="image-popup-content">
<div class="image-info">
<RadzenImage Src="@selectedImage" Style="max-width: 100%; max-height: 300px; object-fit: contain;" />
<p>@infoText</p>
</div>
<div class="close-button">
<RadzenButton Text="Close" Click="CloseImageInfo" />
</div>
</div>
</div>
<style>
.image-grid {
background-color: white; /* Hintergrund der RadzenDataList weiß machen */
}
.rz-data-list {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.image-grid-item {
margin: 5px;
}
.image-popup {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.9); /* Weißer Hintergrund mit Transparenz */
z-index: 9999;
}
.image-popup-content {
display: flex;
flex-direction: row;
justify-content: space-between;
max-width: 800px;
max-height: 400px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding: 20px;
border-radius: 5px;
background-color: white; /* Weißer Hintergrund für den Inhalt */
}
.image-info {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
}
.close-button {
flex: 0 0 auto;
display: flex;
align-items: flex-start;
justify-content: flex-end;
}
</style>
@code {
List<string> imagePaths = new List<string>();
string selectedImage;
string infoText = "Info Text";
string popupStyle = "display: none;";
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
// Get the physical path to the folder
string folderPath = Path.Combine(_environment.WebRootPath, "generated_images");
if (Directory.Exists(folderPath))
{
// Load the image file names from the folder
var imageFiles = Directory.GetFiles(folderPath, "*.jpg");
// Get the relative paths to the images
imagePaths = imageFiles.Select(file => file.Replace(_environment.WebRootPath, "").Replace("\\", "/")).ToList();
}
}
private void ShowImageInfo(string imagePath)
{
selectedImage = imagePath;
infoText = "Info Text"; // Hier kannst du den gewünschten Infotext setzen
popupStyle = "display: block;";
}
private void CloseImageInfo()
{
popupStyle = "display: none;";
}
[Inject]
private IWebHostEnvironment _environment { get; set; }
}

View File

@ -1,6 +1,6 @@
Kunststil und Techniken: Kirsten Klöckner ist eine Künstlerin, die sich auf Aquarell- und Tusche-Materialien spezialisiert hat. Diese Techniken erfordern ein hohes Maß an Geschick und Präzision, da sie sowohl transparente als auch deckende Effekte erzeugen kann. Die Verwendung von Papier als Untergrund ermöglicht es ihr, mit verschiedenen Strukturen und Texturen zu experimentieren. Die Vielfalt der Techniken, die sie beherrscht - wie Federzeichnung, Pinselzeichnung, Nass-in-Nass-Technik, Trocken-auf-Trocken-Technik und Lasur - ermöglicht es ihr, ihre künstlerische Vision in unterschiedlichen Ausdrucksformen zu realisieren.
Themen und Motive: Klöckners Kunst zeigt eine breite Palette von Themen und Motiven. Ihre Werke enthalten oft Naturmotive. Gleichzeitig widmet sie sich aber auch gesellschaftlichen und politischen Anliegen, wie zum Beispiel Gastfreundschaft, Verantwortung, Klimaschutz und kritischen Reflektionen über den Alltag. Die Vielfalt der Themen zeigt, dass sie eine Künstlerin ist, die sich für viele Facetten des Lebens interessiert und ihre Kunst als Ausdrucksmittel für verschiedene Gedanken und Gefühle nutzt.
Themen und Motive: Klöckners Kunst zeigt eine breite Palette von Themen und Motiven. Ihre Werke enthalten oft Naturmotive. Gleichzeitig widmet sie sich aber auch gesellschaftlichen und politischen Anliegen, wie zum Beispiel Gastfreundschaft, Verantwortung, Klimaschutz und kritischen Reflektionen über den Alltag. Die Vielfalt der Themen zeigt, dass sie eine Künstlerin ist, die sich für viele Facetten des Lebens interessiert und ihre Kunst als Ausdrucksmittel für verschiedene Gedanken und Gefühle nutzt. Oftmals werden die Kernobjekte eines Werkes sehr detailliert dargestellt und etwas weniger abstrakt.
Emotionen und Interpretation: Kirsten Klöckners Kunst scheint stark von Emotionen durchdrungen zu sein, die bei den Betrachtern Resonanz erzeugen. Die Assoziationen und Reaktionen anderer Menschen auf ihre Werke reichen von Freude und Dankbarkeit bis hin zu nachdenklichen Reflexionen über gesellschaftliche Fragen. Dies deutet darauf hin, dass ihre Kunst eine breite Palette von Emotionen anspricht und eine starke Verbindung zu den Betrachtern herstellt. Klöckners Fähigkeit, Emotionen in ihren Werken zu vermitteln, zeugt von ihrer künstlerischen Sensibilität und ihrer Fähigkeit, eine tiefere Ebene der Kommunikation mit ihrem Publikum zu erreichen.