When the ListBox is bound to the data ItemsSource, the content is displayed blank.

[wanghonghust]

This issue only occurs when using Neumorphism.Avalonia

1. xaml

	<ListBox ItemsSource="{Binding MenuItems}" Width="300" Theme="{StaticResource ListBoxCard}">
		<ListBox.ItemTemplate>
			<DataTemplate>
				<ListBoxItem>
					<TextBlock Text="{Binding Title}" />
				</ListBoxItem>
			</DataTemplate>
		</ListBox.ItemTemplate>
	</ListBox>

2. MenuItems

MenuItems = new ObservableCollection<MenuItem?>(){
    new MenuItem()
    {
        Icon = "HomeOutline",
        Title = "Home"
    },
    new MenuItem()
    {
        Icon = "ButtonPointer",
        Title = "Buttons"
     }
};

3.Item is not displayed properly
https://github.com/flarive/Neumorphism.Avalonia/assets/22725853/0dd6a31d-4baa-4e67-95dd-feb5f18b2ff1

[flarive]

Hello,

Going to have a look in next few days :)

[flarive]

Just commited the fix in master.

Fixed in ListBoxItem.xaml control theme, strange bug because of ContentTemplate="{TemplateBinding ContentTemplate}" in RippleEffect.
Also updated ListBox demo page with ItemsSource cases and with click command cases also.

[flarive]

@wanghonghust can you confirm the fix is working for you please ?

[wanghonghust]

您能确认该修复程序对您有用吗？

Very helpful, I tested it and the problem is fixed.

Code

<UserControl xmlns="https://github.com/avaloniaui"
             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:Neumorphism.Demo.ViewModels"
			 xmlns:icons="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
             x:Class="Neumorphism.Demo.Views.MainView"
             x:DataType="vm:MainViewModel">
  <Design.DataContext>
    <!-- This only sets the DataContext for the previewer in an IDE,
         to set the actual DataContext for runtime, set the DataContext property in code (look at App.axaml.cs) -->
    <vm:MainViewModel />
  </Design.DataContext>
	<StackPanel>
		<ListBox Width="400" Height="224"
											 ItemsSource="{CompiledBinding ListItems}"
						   ItemContainerTheme="{StaticResource ListBoxItemOutset}"
						   ToolTip.Tip='List box with data binding, click command and theme "ListBoxItemInset" applied'>

			<ListBox.Styles>
				<Style Selector="ListBoxItem">
					<Setter Property="Height" Value="50"/>
					<Setter Property="CornerRadius" Value="100"/>
					<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
					<Setter Property="Margin" Value="8,3,8,3"/>
					<Setter Property="Padding" Value="10,0,5,0"/>
				</Style>
			</ListBox.Styles>
			<ListBox.ItemsPanel>
				<ItemsPanelTemplate>
					<StackPanel Orientation="Vertical" Margin="0"/>
				</ItemsPanelTemplate>
			</ListBox.ItemsPanel>
			<ListBox.ItemTemplate>
				<DataTemplate>
					<Grid ColumnDefinitions="Auto,*,Auto" HorizontalAlignment="Stretch" Background="Transparent">
						<icons:MaterialIcon Grid.Column="0" Kind="{CompiledBinding Icon}" Width="24" Height="24" Margin="0,0,8,0" Foreground="Gray" />
						<TextBlock Grid.Column="1" Text="{CompiledBinding Title}" VerticalAlignment="Center" Foreground="{DynamicResource MaterialDesignToolForeground}" />
						<icons:MaterialIcon Grid.Column="2" Kind="ChevronRight" Width="24" Height="24" HorizontalAlignment="Right" Foreground="Gray" />
					</Grid>
				</DataTemplate>
			</ListBox.ItemTemplate>
		</ListBox>
		<icons:MaterialIcon Kind="About"/>
  <TextBlock Text="{Binding Greeting}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
	</StackPanel>
</UserControl>

 ListItems = new ObservableCollection<ListItem>() {
    new ListItem(){ Title="Home",Icon="Home" },
    new ListItem(){ Title="About",Icon="About"},
};