Questions on UI for WPF Forum

0 answers

68 views

can i use the dragdropmaneger to drag the telerik:RadTimlineAnnotation?

Hi, i am creating the below UI,

as seen in the picture below, the thumb is data blind elapsed time, and its working as expected, but i am not able to drag the thumb.

Thanks.

DragAndDrop

updated question on 24 Sep 2023

0 answers

95 views

Rendering problems on VisibleRangeChanged

Hi

I have a problem with rendering of the ScheduleView when I change VisibleRange. I use a WeekViewDefinition with a Horizontal orientation. In the handler of the VisibleRangeChangedCommand I replace the content of the binding source of the AppointmentsSource property. When I switch to a new week the new Appointments are not rendered correctly (see screenshot). When I resize my dialog containing the ScheduleView the ScheduleView is updated and rendered correctly.

I started to get this problem when I set the MinTimeRulerExtent property, so that I do not get a scrollbar on my ScheduleView. I guess applying the scrollbar forces an update of the ScheduleView.

Is there a way to force an update after the VisibleRangeChanged event to get the proper rendering?

I use the Windows8 theme and 2021.1.119 version of Telerik WPF components.

Here is the definition of my ScheduleView:

<UserControl
    x:Class="Tennotech.Hilding.Watchman.Presentation.Views.Schedules.ScheduleExceptionsDetailsView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    xmlns:schedules="clr-namespace:Tennotech.Hilding.Watchman.Presentation.Views.Schedules"
    xmlns:dt="http://tennotech.com/desktop/xaml/2014"
    xmlns:b="http://schemas.microsoft.com/xaml/behaviors"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="300">
    
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="ScheduleResources.xaml"/>
            </ResourceDictionary.MergedDictionaries>
            
            <telerik:OrientedAppointmentItemStyleSelector x:Key="AppointmentItemStyleSelector"> 
                <telerik:OrientedAppointmentItemStyleSelector.MonthViewStyle> 
                    <Style TargetType="telerik:AppointmentItem" BasedOn="{StaticResource AppointmentItemBaseStyle}"> 
                        <Setter Property="Margin" Value="2 1 2 0" /> 
                        <Setter Property="Background" Value="DarkSlateGray" />
                        <Setter Property="ToolTip" Value="{Binding Appointment.ToolTip}" />
                    </Style> 
                </telerik:OrientedAppointmentItemStyleSelector.MonthViewStyle> 

                <!-- This is the style used by schedules -->
                <telerik:OrientedAppointmentItemStyleSelector.HorizontalStyle> 
                    <Style TargetType="telerik:AppointmentItem" BasedOn="{StaticResource AppointmentItemBaseStyle}">
                        <Setter Property="Margin" Value="0 2 0 10" /> 
                        <Setter Property="Background" Value="#324245" /> 
                        <Setter Property="ToolTip" Value="{Binding Appointment.ToolTip}" />
                    </Style> 
                </telerik:OrientedAppointmentItemStyleSelector.HorizontalStyle>
                
                <telerik:OrientedAppointmentItemStyleSelector.VerticalStyle> 
                    <Style TargetType="telerik:AppointmentItem" BasedOn="{StaticResource AppointmentItemBaseStyle}"> 
                        <Setter Property="Template" Value="{StaticResource AppointmentItemVerticalControlTemplate}"/> 
                        <Setter Property="ResizeCursor" Value="SizeNS"></Setter> 
                        <Setter Property="Margin" Value="1 5 0 5" />
                        <Setter Property="Background" Value="Pink" /> 
                        <Setter Property="ToolTip" Value="{Binding Appointment.ToolTip}" />
                    </Style> 
                </telerik:OrientedAppointmentItemStyleSelector.VerticalStyle> 
            </telerik:OrientedAppointmentItemStyleSelector> 
            
            <DataTemplate x:Key="ToolTipTemplate"> 
                <Grid> 
                    <StackPanel> 
                        <StackPanel Orientation="Horizontal" Margin="0 0 0 0"> 
                            <TextBlock Text="{Binding Start, StringFormat='hh:mm tt'}" TextWrapping="Wrap" FontSize="12" /> 
                            <TextBlock Text=" - " FontSize="10" /> 
                            <TextBlock Text="{Binding End, StringFormat='hh:mm tt'}" TextWrapping="Wrap" FontSize="12" /> 
                        </StackPanel> 
                        <TextBlock Text="{Binding Start, StringFormat='dddd dd MMM yyyy'}" Margin="0 3" FontSize="12" /> 
                    </StackPanel> 
                </Grid> 
            </DataTemplate>
            
            <schedules:ScheduleSlotStyleSelector x:Key="SpecialSlotStyleSelector"> 
                <schedules:ScheduleSlotStyleSelector.ScheduleStyle> 
                    <Style TargetType="telerik:HighlightItem">
                         
                        <Setter Property="Template"> 
                            <Setter.Value> 
                                <ControlTemplate>
                                    <Grid Margin="-2 1 -2 1">
                                        <Border Background="Black"/>
                                        <Border BorderBrush="Gray" BorderThickness="1"/> 
                                    </Grid> 
                                </ControlTemplate> 
                            </Setter.Value> 
                        </Setter> 
                    </Style> 
                </schedules:ScheduleSlotStyleSelector.ScheduleStyle>
                
                <schedules:ScheduleSlotStyleSelector.HistoricStyle> 
                    <Style TargetType="telerik:HighlightItem">
                         
                        <Setter Property="Template"> 
                            <Setter.Value> 
                                <ControlTemplate>
                                    <Grid Margin="-2 1 -2 1">
                                        <Border Background="Transparent"/>
                                        <Border BorderBrush="Gray" BorderThickness="1"/> 
                                    </Grid> 
                                </ControlTemplate> 
                            </Setter.Value> 
                        </Setter> 
                    </Style> 
                </schedules:ScheduleSlotStyleSelector.HistoricStyle> 

            </schedules:ScheduleSlotStyleSelector> 
            
        </ResourceDictionary>
    </UserControl.Resources>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>

        <!--
        SpecialSlotStyleSelector="{StaticResource SpecialSlotStyleSelector}"
        MouseOverHighlightStyle="{StaticResource MouseOverHighlightStyle}"
        SelectionHighlightStyle="{StaticResource SelectionHighlightStyle}"
        -->
        
        <telerik:RadScheduleView
            x:Name="ScheduleView"
            AppointmentsSource="{Binding Appointments}"
            VisibleRangeChangedCommand="{Binding VisibleRangeChangedCommand}"
            VisibleRangeChangedCommandParameter="{Binding VisibleRange, RelativeSource={RelativeSource Self}}"
            CurrentDate="{Binding CurrentDate, Mode=TwoWay}"
            SnapAppointments="True"
            TodayButtonVisibility="Hidden"
            IsInlineEditingEnabled="False"
            NavigationHeaderVisibility="Visible"
            SpecialSlotsSource="{Binding SpecialSlots}"
            FirstVisibleTime="0:00"
            ResourceTypesSource="{Binding ResourceTypes}"
            AppointmentStyleSelector="{StaticResource AppointmentItemStyleSelector}"
            GroupHeaderStyleSelector="{StaticResource SchemaGroupHeaderStyleSelector}"
            GroupHeaderContentTemplateSelector="{StaticResource SchemaGroupHeaderContentTemplateSelector}"
            ToolTipTemplate="{StaticResource ToolTipTemplate}"
            SpecialSlotStyleSelector="{StaticResource SpecialSlotStyleSelector}"
            MinTimeRulerExtent="200"
            >
            <!--
            MinTimeRulerExtent="200"
             -->
            
            <b:Interaction.Behaviors>
                <schedules:PreventCloseDialogBehavior/>
                <schedules:PreventAddScheduleDialogException/>
                <schedules:FastAppointmentAddBehavior Appointments="{Binding Appointments}"/>
                <schedules:FilterAppointmentsBehavior/>
            </b:Interaction.Behaviors>
            
            <telerik:RadScheduleView.DragDropBehavior> 
                <schedules:ScheduleDragDropBehavior />
            </telerik:RadScheduleView.DragDropBehavior>
            <telerik:RadScheduleView.SlotSelectionBehavior> 
                <schedules:ScheduleSlotSelectionBehavior/> 
            </telerik:RadScheduleView.SlotSelectionBehavior> 

            <telerik:RadScheduleView.ActiveViewDefinition>
                <telerik:WeekViewDefinition
                    TimerulerMajorTickStringFormat="{}{0:%H}:{0:mm}"
                    ShowWeekGroupHeaders="False"
                    MinorTickLength="15min"
                    Orientation="Horizontal"
                    StretchGroupHeaders="True"
                    FirstDayOfWeek="Monday"
                    VisibleDays="7" />
                
            </telerik:RadScheduleView.ActiveViewDefinition>

            <telerik:RadScheduleView.GroupDescriptionsSource>
                <telerik:GroupDescriptionCollection>
                    <telerik:DateGroupDescription/>
                    <telerik:ResourceGroupDescription ResourceType="Schedules" />
                </telerik:GroupDescriptionCollection>
            </telerik:RadScheduleView.GroupDescriptionsSource>
        </telerik:RadScheduleView>
        
        <DockPanel Grid.Column="1" Margin="20 0 0 0" MinWidth="300">
            <TextBlock Text="{dt:Text ScheduleExceptions}" DockPanel.Dock="Top" Style="{StaticResource Title}"/>

            <telerik:RadGridView
                x:Name="ScheduleGrid"
                DockPanel.Dock="Bottom"
                ItemsSource="{Binding ScheduleExceptions}"
                AutoExpandGroups="True"
                AutoGenerateColumns="False"
                CanUserFreezeColumns="False"
                CanUserReorderColumns="False"
                CanUserSelect="True"
                EnableRowVirtualization="True"
                GroupRenderMode="Flat"
                IsReadOnly="True"
                RowIndicatorVisibility="Collapsed"
                SelectionMode="Single"
                SelectionUnit="FullRow"
                ShowGroupPanel="False"
                dt:CommandBindingsBehavior.RegisterCommandBindings="{Binding CommandBindings}">
                
                <b:Interaction.Behaviors>
                    <schedules:RowDoubleClickBehavior Command="{Binding RowDoubleClickedCommand}"/>
                </b:Interaction.Behaviors>
                
                <!--
                <b:Interaction.Triggers>
                    <b:EventTrigger EventName="RowActivated" >
                        <b:InvokeCommandAction Command="{Binding RowActivatedCommand}" />
                    </b:EventTrigger>
                </b:Interaction.Triggers>
                -->
                
                <telerik:RadGridView.Columns>
                    <telerik:GridViewDataColumn
                        SortingState="Ascending"
                        DataMemberBinding="{Binding Start}"
                        Header="{dt:Text Start}" />
                    
                    <telerik:GridViewDataColumn
                        IsSortable="False"
                        DataMemberBinding="{Binding End}"
                        Header="{dt:Text End}" />
                    
                    <telerik:GridViewDataColumn
                        IsSortable="False"
                        DataMemberBinding="{Binding IsActive}"
                        Header="{dt:Text IsActive}" />
                    
                    <telerik:GridViewColumn
                        Header="Delete"
                        IsSortable="False"> 
                        <telerik:GridViewColumn.CellTemplate> 
                            <DataTemplate> 
                                <telerik:RadButton
                                    Content="Delete"
                                    Command="telerik:RadGridViewCommands.Delete"
                                    CommandParameter="{Binding}" /> 
                            </DataTemplate> 
                        </telerik:GridViewColumn.CellTemplate> 
                    </telerik:GridViewColumn> 
                </telerik:RadGridView.Columns>
            </telerik:RadGridView>
        </DockPanel>
        
    </Grid>
</UserControl>

ScheduleView

asked on 22 Sep 2023

1 answer

121 views

RadGridView, DataTable and the correct way to update

Hi,

I'm using a RadGridView with its ItemsSource bound to a DataTable.DefaultView. I read a lot of forums post about the correct way to bind but I have one remaining question:

Once you bound your DataTable, in the ViewModel, do you work with the DataTable itself or do you access the DataTable.DefaultView to work with the data?

I'm experiencing some update bugs and some case where the RadGridView completely freeze so I'm trying to figure out how the properly work with DataTables. Also does RadGridView handles cases where AllowDBNull = false and no data is provided and cases when a column is set with Unique and similar values are entered in the column?

Thank you for your help.

GridView

answered on 22 Sep 2023

1 answer

89 views

How to use Telerik.2020.2.617.45 version

Hi Team,

I joined the project attaching Telerik.2020.2.617.45 version.

but I can download only 2023.xx version.

So How can i download 2020.2.617.45 version.

ComboBox

EntityFrameworkDataSource

GridView

MultiColumnComboBox

answered on 21 Sep 2023

0 answers

226 views

Font and Theme Changes at Runtime Sometimes Stop Working

Good day. I have functionality in my WPF application that allows the user to change the font size, font style, and theme variations at runtime, see code below. This functions perfectly when it works.

The issue I am having is that when making changes to these values at runtime, the changes intermittently stop being applied. The way I understand theming is that I should be able to make these changes at runtime and they are automatically applied. Something is getting borked up causing the changes to stop being applied during runtime.

C#, WPF .NET 6

Theme: Office 2019

Telerik Version: 2023.1.117

I'm using the package Telerik.UI.Wpf.NetCore.Xaml for all controls. Theme packages come from No XAML.

// Theme Color Variation// High Contrast
Office2019Palette.LoadPreset(Office2019Palette.ColorVariation.HighContrast);

// Dark/Light Mode
if (RegistryHelper.IsWindowsDarkMode())
    Office2019Palette.LoadPreset(Office2019Palette.ColorVariation.Dark);
else
    Office2019Palette.LoadPreset(Office2019Palette.ColorVariation.Light);


// Change Font Family
Office2019Palette.Palette.FontFamily = new FontFamily(Settings.Default.FontFamily);


// Font Size
Telerik.Windows.Controls.Office2019Palette.Palette.FontSizeS = 10;
Telerik.Windows.Controls.Office2019Palette.Palette.FontSize = 12;
Telerik.Windows.Controls.Office2019Palette.Palette.FontSizeL = 14;

App.xaml for Telerik:

<prism:PrismApplication x:Class="Wpf.App"
                        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                        xmlns:prism="http://prismlibrary.com/">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>

                <!-- Telerik -->
                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2019;component/Themes/System.Windows.xaml" />
                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2019;component/Themes/Telerik.Windows.Controls.xaml" />
                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2019;component/Themes/Telerik.Windows.Controls.Input.xaml" />
                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2019;component/Themes/Telerik.Windows.Controls.Navigation.xaml" />

            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</prism:PrismApplication>

General Discussions

updated question on 20 Sep 2023

1 answer

197 views

RadNumericUpDown and Globalisation/Localisation

Hello,

I'm using several RadNumericUpDown controls and when the language/region is set to English, as expected they show numbers with dots as decimal separators, which is fine. But when I set any European language/region they still show dots rather than commas. How can I fix this issue?

My code is like the snippet below:

<telerik:RadNumericUpDown Value="{Binding ScaleMin}" HorizontalAlignment="Stretch" Width="120" Margin="5"
VerticalAlignment="Center" SmallChange="0.1" ValueFormat="Numeric" IsEnabled="{Binding IsAvailable}">
<telerik:RadNumericUpDown.NumberFormatInfo>
<global:NumberFormatInfo NumberGroupSeparator="" NumberDecimalDigits="1"/>
</telerik:RadNumericUpDown.NumberFormatInfo>
<telerik:RadNumericUpDown.Resources>
<Style TargetType="{x:Type TextBox}">
<Setter Property="MaxLength" Value="8"/>
</Style>
</telerik:RadNumericUpDown.Resources>
</telerik:RadNumericUpDown>

Thanks,

G.

Localization

NumericUpDown

answered on 20 Sep 2023

9 answers

461 views

Removing RadPanelBar highlighting in wpf

I am facing issue in removing the highlighting effect(yellow color on mouse hover) of RadPaneBar in wpf application.
How to remove mouse hover effect from RadPanebar or any specific styles to be applied to remove highlighting.
Let me know.

PanelBar

answered on 20 Sep 2023

0 answers

143 views

Color Picker background color when expanded

how to change the background color of a color picker control when expanded (black theme) to a customized color ?

ColorPicker

asked on 18 Sep 2023

0 answers

320 views

RadGridView - grouping and filtering for N3 numbers

Hi,

I have many RadGridView columns with binding to a Double number with StringFormat: 0:N3.

I configured the grouping header text to show the value and the number of elements (Aggregate Function).

For example:

Frequency Column with the following rows:

123.123

The group header will be:

Frequency: 123.123 (2)

The problem is with larger numbers For example:

123.1234

123.1235

On the cell, the user will see:

123.123

On the grouping headers, the user will see two groups:

Frequency: 123.123 (1)

On filtering, if the user selects equal to 123.123, the grid will display 0 rows.

Even if I update the Header Text to show N4 only when having 4 no zero decimals (using a converter), the filtering will not work as the user expects

I think that the easiest solution is to configure the grouping and filtering to apply the logic on the displayed value, how can I do that? (the display value is a string but the filtering operators shall be for number, it is an issue?)

Maybe another option is to write a custom filter/grouping where I can implement the operator logic on Math.Round 3 and then use it on the xaml?

I can't imagine any other simple solution but I am sure that you can :)

Please, I need a simpme solution that I can apply on the xaml styles to the whole application. I am not working with code behind at all to avoid copiying logic everywhere.

GridView

updated question on 16 Sep 2023

0 answers

289 views

RadNumericUpDown - decimal places doesn't affect the View Model value

Hello,

I have a NumericUpDown with the following configuration:

1. NumberDecimalDigits=3

2. Binding to Double property in ViewModel

3. Validation (IDataErrorInfo) between 20-3000.

4. Small change 0.001

5. Big change 0.1

When I write 123.1234, I can see 123.123 in the UI but in the view model, you don't remove the additional digits.

I have the following problems:

1. Sometimes when using arrows up/down or page up/down, the 4 digit is removed. I expected that the snall/large change takes effect without removing any digits because the NumberDecimalDigits shall affect the UI.

2. On grouping/filtering, I want to apply the logic on the UI value instead of the binding value.

For 1234.1234 and 1234.1235 will be created two different groups.

In case that I have a double with 4 digits, but in the UI is configured to N3, I don't want to see two groups with same value in the Header Text. The user will not understand why there are two groups.

How can I configure the RadNumericUpDown to show 3 digits but if there is an error and the number has 4 digits to show 4 digits? (with this solution the user will understand why there is an error if he types 19.9996.

For this value, it will be round 20.000 and mark as error when minimim value 20 is allowed. Showing 4 digits will solve it.

How can I configure the Grouping and Filtering of the RadGridView to consider some double value as N3?

GridView

NumericUpDown

updated question on 16 Sep 2023