Search code examples
xamlbindingwinui-3winui

How to bind background color to binded listview?


How can we bind the color here ?

DayItems.Add(new CustomCalendarViewDayItem(DateTime.Now.AddDays(1), "Tommorrow"));

Solution

  • You can add a property on the CustomCalendarViewDayItem in my answer for your original question:

    public record CustomCalendarViewDayItem
    {
        public CustomCalendarViewDayItem(DateTime dateTime, string text)
        {
            DateTime = dateTime;
            Text = text;
        }
    
        public DateTime DateTime { get; }
    
        public string Text { get; }
    
        public Brush Background { get; }
    }
    

    And change how to create the list:

    private void CalendarViewControl_CalendarViewDayItemChanging(CalendarView sender, CalendarViewDayItemChangingEventArgs args)
    {
        if (DayItems.Where(x => DateOnly.FromDateTime(x.DateTime) == DateOnly.FromDateTime(args.Item.Date.Date))
                .Select(x => x) is IEnumerable<CustomCalendarViewDayItem> dayItems)
        {
            args.Item.DataContext = dayItems;
        }
    }
    

    And the CalendarViewDayItemStyle should look like this:

    <CalendarView.CalendarViewDayItemStyle>
        <Style TargetType="CalendarViewDayItem">
            <Setter Property="FontSize" Value="10" />
            <Setter Property="FontWeight" Value="ExtraLight" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Grid
                            Margin="5"
                            VerticalAlignment="Center">
                            <ListView ItemsSource="{Binding}">
                                <ListView.ItemTemplate>
                                    <DataTemplate x:DataType="local:CustomCalendarViewDayItem">
                                        <ListViewItem
                                            Background="{x:Bind Background}"
                                            Content="{x:Bind Text}" />
                                    </DataTemplate>
                                </ListView.ItemTemplate>
                            </ListView>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </CalendarView.CalendarViewDayItemStyle>