I am currently creating a basic Library Management system for self-learning purposes. I’m using WPF for my frontend and I currently have the list of books displayed to the user, the issue is, although I have it set so when the book image is clicked a popup is displayed, nothing happens. Here is my code:
<UserControl x:Class="LibraryManagementSystem.Frontend.Views.BooksView"
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:vm="clr-namespace:LibraryManagementSystem.Frontend.ViewModels"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<UserControl.Resources>
<Style x:Key="BootstrapButton" TargetType="Button">
<Setter Property="Background" Value="#007bff"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="BorderBrush" Value="#007bff"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Padding" Value="10,5"/>
<Setter Property="Margin" Value="5"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="FontWeight" Value="Bold"/>
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="HorizontalAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="4">
<ContentPresenter HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<UserControl.DataContext>
<vm:BooksViewModel />
</UserControl.DataContext>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<ItemsControl ItemsSource="{Binding PagedBooks}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="3"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Margin="10">
<Image Source="{Binding PictureUrl}" Height="150" Stretch="Uniform" MouseLeftButtonUp="BookImage_MouseLeftButtonUp"/>
<Button Content="View Details"
Style="{StaticResource BootstrapButton}"
CommandParameter="{Binding ID}"
Margin="0,10,0,0"/>
<Button Content="Add to Cart"
Style="{StaticResource BootstrapButton}"
CommandParameter="{Binding ID}"
Margin="0,5,0,0"/>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center" Margin="10">
<Button Content="Previous"
Style="{StaticResource BootstrapButton}"
Click="PreviousPageButton_Click"
IsEnabled="{Binding CanGoToPreviousPage}"
Margin="5"/>
<TextBlock Text="{Binding CurrentPage, StringFormat='Page {0}'}"
VerticalAlignment="Center"
Margin="5"/>
<Button Content="Next"
Style="{StaticResource BootstrapButton}"
Click="NextPageButton_Click"
IsEnabled="{Binding CanGoToNextPage}"
Margin="5"/>
</StackPanel>
<!-- Popup for Book Details -->
<Popup x:Name="BookDetailsPopup" Placement="Center" StaysOpen="False">
<Border Background="White" BorderBrush="Black" BorderThickness="1" Padding="20" Width="300" Height="400">
<StackPanel>
<Image x:Name="PopupImage" Height="200" Stretch="Uniform"/>
<TextBlock x:Name="PopupTitle" FontWeight="Bold" FontSize="16" Margin="0,10,0,0"/>
<TextBlock x:Name="PopupAuthor" Margin="0,5"/>
<TextBlock x:Name="PopupDescription" TextWrapping="Wrap" Margin="0,5"/>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="0,10,0,0">
<Button Content="Add to Cart" Style="{StaticResource BootstrapButton}" Click="AddToCartButton_Click"/>
<Button Content="Close" Style="{StaticResource BootstrapButton}" Click="ClosePopupButton_Click" Margin="10,0,0,0"/>
</StackPanel>
</StackPanel>
</Border>
</Popup>
</Grid>
</UserControl>
I’ve tried adding a breakpoint in the “BookImage_MouseLeftButtonUp” function to see if it even enters the function at least but it doesn’t which leads me to believe the issue is with the XAML itself and not the code because nothing executes to begin with. I’m not even sure if something is overlapping or what is wrong exactly. For context as well, if it makes any difference, The XAML code I provided is part of a MainWindow XAML file that has 4 tabs, one of them being a “Books” tab where the XAML I provided above is being displayed after clicking on that tab ofcourse.
Dev00 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.