WPF TELERIK RADSCHEDULEVIEW Привязки шаблонов содержимого заголовка группы
Итак, что я пытаюсь сделать здесь, это изменить внешний вид моего RadScheduleView GroupHeaderContentTemplate по щелчку CheckBox. Этот CheckBox связан с ShowPictures недвижимость в моей viewmodel. Также есть GroupHeaderHeight свойство, чтобы установить максимальную высоту каждой группировки.
Свойства определены ниже:
private bool _ShowPictures;
public bool ShowPictures
{
get
{
return this._ShowPictures;
}
set
{
if (this._ShowPictures == value)
{
return;
}
this._ShowPictures = value;
this.RaisePropertyChanged(nameof(this.ShowPictures));
}
}
private int _GroupHeaderHeight;
public int GroupHeaderHeight
{
get
{
return this._GroupHeaderHeight;
}
set
{
if (this._GroupHeaderHeight == value)
{
return;
}
this._GroupHeaderHeight = value;
this.RaisePropertyChanged(nameof(this.GroupHeaderHeight));
}
}
CheckBoxs код:
<CheckBox Name="cbShowPictures" Content="Show Pictures" Grid.Column="9"
IsChecked="{Binding ShowPictures,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />
Мой код RadScheduleViews:
<UserControl.Resources>
<converters:DatabindingDebugConverter x:Key="DatabindingDebugConverter"/>
<BooleanToVisibilityConverter x:Key="BoolToVis"/>
<telerik:RadScheduleView x:Name="MainSchedule"
Grid.Row="0"
Margin="2"
TimeMarkersSource="{Binding TimeMarkers}"
CategoriesSource="{Binding Categories}"
MinAppointmentHeight="25"
NavigationHeaderVisibility="Visible"
AppointmentsSource="{Binding WorkOrderTasks,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
AppointmentCreated="MainSchedule_AppointmentCreated"
ResourceTypesSource="{Binding ResourceTypes}"
AppointmentDeleted="MainSchedule_AppointmentDeleted"
AppointmentEdited="MainSchedule_AppointmentEdited"
CurrentDate="{Binding FilterStart,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
SelectedAppointment="{Binding SelectedWorkOrderTask, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
FirstVisibleTime="8:00:00"
ShowAppointmentDeleteButton="False"
ToolTipTemplate="{StaticResource AppointmentToolTipTemplate}">
<telerik:RadScheduleView.ViewDefinitions>
<telerik:TimelineViewDefinition MinTimeRulerExtent="1"
MaxTimeRulerExtent="Infinity"
MinorTickLength="1h"
DayStartTime="{Binding DailyStartTime, Mode=TwoWay}"
DayEndTime="{Binding DailyEndTime, Mode=TwoWay}"
VisibleDays="{Binding VisibleDays, Mode=TwoWay}"
StretchGroupHeaders="True"
StretchAppointments="True"/>
<telerik:DayViewDefinition DayStartTime="{Binding DailyStartTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
DayEndTime="{Binding DailyEndTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
VisibleDays="{Binding VisibleDays, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
StretchGroupHeaders="False"
MinTimeRulerExtent="1"
MaxTimeRulerExtent="Infinity"
MinorTickLength="1h" />
<telerik:WeekViewDefinition DayStartTime="{Binding DailyStartTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
DayEndTime="{Binding DailyEndTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
VisibleDays="{Binding VisibleDays, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
StretchGroupHeaders="False"
MinTimeRulerExtent="1"
MaxTimeRulerExtent="Infinity"
MinorTickLength="1h"/>
<telerik:MonthViewDefinition DayStartTime="{Binding DailyStartTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
DayEndTime="{Binding DailyEndTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
VisibleDays="{Binding VisibleDays, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
StretchGroupHeaders="False"
MinTimeRulerExtent="1"
MaxTimeRulerExtent="Infinity"/>
<telerik:CustomViewDefinition DayStartTime="{Binding DailyStartTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
DayEndTime="{Binding DailyEndTime, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
VisibleDays="{Binding VisibleDays, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
StretchGroupHeaders="False"
MinTimeRulerExtent="1"
MaxTimeRulerExtent="Infinity"
MinorTickLength="1h"/>
</telerik:RadScheduleView.ViewDefinitions>
<telerik:RadScheduleView.ActiveViewDefinition>
<telerik:TimelineViewDefinition MinTimeRulerExtent="1"
MaxTimeRulerExtent="Infinity"
MinorTickLength="1h"
DayStartTime="{Binding DailyStartTime, Mode=TwoWay}"
DayEndTime="{Binding DailyEndTime, Mode=TwoWay}"
VisibleDays="{Binding VisibleDays, Mode=TwoWay}"
StretchGroupHeaders="False"
StretchAppointments="False"/>
</telerik:RadScheduleView.ActiveViewDefinition>
<telerik:RadScheduleView.AppointmentItemContentTemplate>
<DataTemplate>
<StackPanel Margin="4 2" MinHeight="20" >
<TextBlock Text="{Binding Subject}" FontWeight="Bold" />
<TextBlock Text="{Binding Appointment.Body}" TextWrapping="Wrap" />
<TextBlock Text="Time Range" Foreground="{StaticResource StrongBrush}"/>
<StackPanel Orientation="Horizontal" Margin="4 0">
<TextBlock Text="{Binding Path=Start, StringFormat='MMM dd, yyyy HH:MM'}"
FontWeight="SemiBold" Foreground="{StaticResource AccentBrush}" />
<TextBlock Text=" - " Foreground="{StaticResource AccentBrush}" />
<TextBlock Text="{Binding Path=End, StringFormat='MMM dd, yyyy HH:MM'}"
FontWeight="SemiBold" Foreground="{StaticResource AccentBrush}" />
</StackPanel>
</StackPanel>
</DataTemplate>
</telerik:RadScheduleView.AppointmentItemContentTemplate>
<telerik:RadScheduleView.GroupDescriptionsSource>
<telerik:GroupDescriptionCollection>
<schedule:ResourceGroupDescription ResourceType="Equipment" />
</telerik:GroupDescriptionCollection>
</telerik:RadScheduleView.GroupDescriptionsSource>
<telerik:RadScheduleView.GroupHeaderContentTemplate>
<DataTemplate>
<Border Background="{Binding Name.Brush}" Width="140" Height="{Binding GroupHeaderHeight, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Margin="1 1 1 0">
<StackPanel Margin="10 10 10 10">
<Image Margin="5 0 10 0" Height="60" Width="60" Visibility="{Binding ShowPictures, Converter= {StaticResource BoolToVis}, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
HorizontalAlignment="Left" Stretch="UniformToFill" Source="{Binding Name.Photo}" />
<TextBlock Text="{Binding FormattedName}" TextWrapping="Wrap" Margin="8 0" VerticalAlignment="Center" />
</StackPanel>
</Border>
</DataTemplate>
</telerik:RadScheduleView.GroupHeaderContentTemplate>
<telerik:RadScheduleView.TimeRulerItemStyleSelector>
<local:GroupItemStyleSelector>
<local:GroupItemStyleSelector.GroupItemStyle>
<Style TargetType="telerik:TimeRulerGroupItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="telerik:TimeRulerGroupItem">
<Border BorderBrush="{StaticResource BasicBrush}" BorderThickness="1 1 0 0">
<ContentPresenter Margin="4 2" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</local:GroupItemStyleSelector.GroupItemStyle>
</local:GroupItemStyleSelector>
</telerik:RadScheduleView.TimeRulerItemStyleSelector>
</telerik:RadScheduleView>
Я инициализирую ShowPictures в true, а GroupHeaderHeight в 60 в моем конструкторе моделей представления. Геттер и сеттеры вызываются, но визуально никаких изменений не происходит. Цель в том, чтобы при включении показа изображений я отображал изображение в шаблоне заголовка группы и увеличивал высоту, а при отключении я не отображал изображение и уменьшал высоту.
Пожалуйста, любые советы о том, как я мог бы улучшить или ошибки, которые я делаю с этим может быть оценен.
Если какой-либо код отсутствует, я добавлю, если спросят.
1 ответ
Я думаю, ShowPictures а также GroupHeaderHeight свойства определены в том же классе, что и TimeMarkers, Categoriesи т.д. свойства, а затем вы должны использовать RelativeSource чтобы иметь возможность связывать их с GroupHeaderContentTemplate:
<DataTemplate>
<Border Background="{Binding Name.Brush}" Width="140" Height="{Binding DataContext.GroupHeaderHeight, RelativeSource={RelativeSource AncestorType=telerik:RadScheduleView}}" Margin="1 1 1 0">
<StackPanel Margin="10 10 10 10">
<Image Margin="5 0 10 0" Height="60" Width="60" Visibility="{Binding DataContext.ShowPictures, Converter={StaticResource BoolToVis}, RelativeSource={RelativeSource AncestorType=telerik:RadScheduleView}}"
HorizontalAlignment="Left" Stretch="UniformToFill" Source="{Binding Name.Photo}" />
<TextBlock Text="{Binding FormattedName}" TextWrapping="Wrap" Margin="8 0" VerticalAlignment="Center" />
</StackPanel>
</Border>
</DataTemplate>