Questions on UI for WinUI Forum

1 answer

203 views

Creating a Listview with Alphabetical Groups

How can I create a listview with alphabetical group header like a simple agenda?

ListView

answered on 20 Feb 2023

1 answer

384 views

I can't find the Telerik.WinUI.Controls.Trial package.

I wanted to try your components for .NET MAUI & WINUI.

I was able to make the MAUI demo work.

I can't find the Telerik.WinUI.Controls.Trial NUGet package for the WINUI demo.

Thank you.

General Discussions

answered on 07 Feb 2023

0 answers

268 views

Exception when adding resources after Telerik upgrade: Error HRESULT E_FAIL has been returned...

We upgraded our telerik packages from version 16.2.22.914 to 17.0.23.118 and now we're getting this error when adding Telerik resource dictionaries to our application, I can't figure out what to change to make this work.

Packages:

Telerik.Reporting
Telerik.Reporting.Services.AspNetCore
Telerik.Reporting.Services.WebServiceDataSource
Telerik.Reporting.Services.HttpClient
Telerik.ReportViewer.WinUI
Telerik.WebReportDesigner.Services
In the screenshot below, Resources is referring to App.Resources

Add comment41

General Discussions

asked on 02 Feb 2023

1 answer

236 views

Spline series are incorrectly drawn

Hi,

In this sample app, I have 2 spline series to show the bug. The render of each spline is not correct.

Thanks
Sébastien

DataGrid

answered on 24 Jan 2023

1 answer

217 views

LineSeries requires at minimum 3 data to draw a line serie

Hi,

To repro the bug, just uncomment the 3rd data in the MainWindow.xaml.cs file.

This is the same bug as seen in UWP control https://www.telerik.com/forums/lineseries-requires-at-minimum-3-data-to-draw-a-line-serie.

If you fix this one, it would be great to have the same fix for UWP too.
Thank you

Sébastien

Chart

answered on 24 Jan 2023

1 answer

316 views

TreeView Control

When can we expect a TreeView control? The TV is great for things such as Help systems with nested levels.

General Discussions

answered on 29 Nov 2022

0 answers

1.5K+ views

How to know if the user closed Print dialog?

Hi All,

Currently we use Telerik WinUI reportviewer and programmatically we need to print a report. We call PrintReport() method of the reportviewer control for that purpose. But, we should somehow know if the user clicked on "Cancel" button or "Print" button on the print dialog. How to subscribe to print/cancel events? or how to know if the user closed print dialog?

Any custom solution would be helpful.

Thanks,

General Discussions

asked on 05 Oct 2022

1 answer

430 views

How to modify SelectedItems in the DataGrid in the ViewModel

The SelectedItems in the Documentation is an ObservableCollection but it only has a getter and no setter.

I am able to get SelectedItems like this using interactivity behavior by passing SelectedItems as a command parameter to the ViewModel

But I would like also be able to modify SelectedItems in the ViewModel as well

<telerikGrid:RadDataGrid x:Name="UserGrid"
                                     ItemsSource="{x:Bind ViewModel.Source}"
                                     AutoGenerateColumns="False"
                                     RowHeight="25"
                                     SelectionMode="Multiple"
                                     SelectionUnit="Row"
                                     UserGroupMode="Disabled">
                <i:Interaction.Behaviors>
                    <ic:EventTriggerBehavior EventName="SelectionChanged">
                        <ic:InvokeCommandAction
                            Command="{x:Bind ViewModel.SelectedUsersCommand}"
                            CommandParameter="{x:Bind UserGrid.SelectedItems,Mode=OneWay}"/>
                    </ic:EventTriggerBehavior>
                </i:Interaction.Behaviors>
                <telerikGrid:RadDataGrid.Columns>
                    <telerikGrid:DataGridTemplateColumn SizeMode="Fixed" Width="10">
                        <telerikGrid:DataGridTemplateColumn.CellContentTemplate>
                            <DataTemplate>
                                <StackPanel VerticalAlignment="Center" Margin="5 0 0 0">
                                    <CheckBox/>
                                </StackPanel>
                            </DataTemplate>
                        </telerikGrid:DataGridTemplateColumn.CellContentTemplate>
                    </telerikGrid:DataGridTemplateColumn>
                    <telerikGrid:DataGridTextColumn x:Uid="NameColumn" SizeMode="Auto"  PropertyName="UserName"/>
                    <telerikGrid:DataGridTextColumn x:Uid="EmailColumn" SizeMode="Auto"  PropertyName="UserEmail"/>
                    <telerikGrid:DataGridTextColumn x:Uid="DepartmentColumn" SizeMode="Auto"  PropertyName="DepartmentName"/>
                    <telerikGrid:DataGridBooleanColumn x:Uid="UserStatusColumn" SizeMode="Auto" PropertyName="UserActiveIndicator"/>
                    <telerikGrid:DataGridDateColumn x:Uid="DateCreatedColumn" SizeMode="Auto" PropertyName="RecordCreated" CellContentFormat="{}{0:d}"/>
                    <telerikGrid:DataGridDateColumn x:Uid="DateModifiedColumn" SizeMode="Auto" PropertyName="RecordModified" CellContentFormat="{}{0:d}"/>
                </telerikGrid:RadDataGrid.Columns>
            </telerikGrid:RadDataGrid>

Buttons

DataGrid

answered on 30 Sep 2022

2 answers

1.1K+ views

Grid splitter control should resize data grid height.

In the Grid there are three rows. On the top row is the DataGrid control and on in the middle row there is GridSplitter control then on the bottom is the TabControl.

The requirement is for the GridControl to resize when the GridSplitter resizes the Grid. There should be a MinHeight property set to display a minimum of 6 rows and GridControl should resize.

Current behavior is that GridControl takes all the space and does not resize when the Grid Splitter is moved up or down.

<Page
    x:Class="CSA2.Views.SearchUserPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:CSA2.Views"
    xmlns:vm="using:CSA2.ViewModels"
    xmlns:controls="using:CSA2.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="using:Microsoft.Xaml.Interactivity"
    xmlns:telerik="using:Telerik.UI.Xaml.Controls"
    xmlns:telerikGrid="using:Telerik.UI.Xaml.Controls.Grid"
    xmlns:telerikPrimitives="using:Telerik.UI.Xaml.Controls.Primitives"
    xmlns:gridPrimitives="using:Telerik.UI.Xaml.Controls.Grid.Primitives"
    xmlns:ic="using:Microsoft.Xaml.Interactions.Core"
    mc:Ignorable="d">
    <Page.Resources>
        <ResourceDictionary>
            <DataTemplate x:Key="ColumnHeaderCompleteTemplate">
                <FontIcon
                    Margin="0,3,0,0"
                    FontSize="16"
                    Glyph="&#xE73E;" />
            </DataTemplate>
        </ResourceDictionary>
    </Page.Resources>
    <Grid  x:Name="ContentArea" Margin="{StaticResource SmallTopBottomMargin}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <StackPanel Margin="0 5 0 5">
            <TextBlock x:Uid="SearchUser" Style="{ThemeResource SubtitleTextBlockStyle}"/>
            <Border BorderThickness=".5" BorderBrush="LightGray" CornerRadius="2">
                <Grid Margin="0 5 0 5">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <StackPanel>
                        <Grid HorizontalAlignment="Left">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <TextBlock x:Uid="UserNameText"
                                       Grid.Row="0"
                                       Grid.Column="0"
                                       VerticalAlignment="Center"
                                       Margin="5 0 5 0"/>
                            <TextBox x:Uid="UserNameNullText"
                                     Grid.Row="0"
                                     Grid.Column="1"
                                     Margin="0 0 5 0"
                                     Width="200"
                                     Text="{x:Bind ViewModel.UserName, Mode=TwoWay}"/>
                            <TextBlock Grid.Row="0" x:Uid="UserEmailText"
                                       Grid.Column="2"
                                       VerticalAlignment="Center"
                                       Margin="0 0 5 0"/>
                            <TextBox x:Uid="UserEmailNullText"
                                     Grid.Row="0"
                                     Grid.Column="3"
                                     Width="200"
                                     Text="{x:Bind ViewModel.UserEmail, Mode= TwoWay}"/>
                            <TextBlock x:Uid="UserRoleText"
                                       Grid.Row="0"
                                       Grid.Column="4"
                                       VerticalAlignment="Center"
                                       Margin="5 0 5 0"/>
                            <Button Grid.Row="0"
                                    Grid.Column="5"
                                    Margin="0 0 0 0" HorizontalAlignment="Stretch">
                                <StackPanel>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="Select"
                                                   Margin="0 0 10 0" />
                                        <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE70D;"/>
                                    </StackPanel>
                                </StackPanel>
                                <Button.Flyout>
                                    <Flyout Placement="Bottom">
                                        <StackPanel Orientation="Vertical">
                                            <ListView x:Name="UserRoles" ItemsSource="{x:Bind ViewModel.UserRoles, Mode=OneWay}"
                                                      SelectionMode="Multiple"
                                                      VerticalContentAlignment="Top"
                                                      ScrollViewer.IsVerticalRailEnabled="True"
                                                      ScrollViewer.VerticalScrollBarVisibility="Visible">
                                                <i:Interaction.Behaviors>
                                                    <ic:EventTriggerBehavior EventName="SelectionChanged">
                                                        <ic:InvokeCommandAction
                                                            Command="{x:Bind ViewModel.SelectedItemsCommand}"
                                                            CommandParameter="{x:Bind UserRoles.SelectedItems,Mode=OneWay}"/>
                                                    </ic:EventTriggerBehavior>
                                                </i:Interaction.Behaviors>
                                            </ListView>
                                        </StackPanel>
                                    </Flyout>
                                </Button.Flyout>
                            </Button>
                            <TextBlock x:Uid="UserDepartmentText"
                                       Grid.Row="0"
                                       Grid.Column="6"
                                       VerticalAlignment="Center"
                                       Margin="5 0 5 0"/>
                            <Button Grid.Row="0"
                                    Grid.Column="7"
                                    Margin="0 0 0 0" HorizontalAlignment="Stretch">
                                <StackPanel>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="Select"
                                                   Margin="0 0 10 0" />
                                        <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE70D;"/>
                                    </StackPanel>
                                </StackPanel>
                                <Button.Flyout>
                                    <Flyout Placement="Bottom">
                                        <StackPanel Orientation="Vertical">
                                            <ListView x:Name="UserDepartments" ItemsSource="{x:Bind ViewModel.UserDepartments, Mode=OneWay}"
                                                      SelectionMode="Multiple"
                                                      VerticalContentAlignment="Top"
                                                      ScrollViewer.IsVerticalRailEnabled="True"
                                                      ScrollViewer.VerticalScrollBarVisibility="Visible">
                                                <i:Interaction.Behaviors>
                                                    <ic:EventTriggerBehavior EventName="SelectionChanged">
                                                        <ic:InvokeCommandAction
                                                            Command="{x:Bind ViewModel.SelectedItemsCommand}"
                                                            CommandParameter="{x:Bind UserDepartments.SelectedItems,Mode=OneWay}"/>
                                                    </ic:EventTriggerBehavior>
                                                </i:Interaction.Behaviors>
                                            </ListView>
                                        </StackPanel>
                                    </Flyout>
                                </Button.Flyout>
                            </Button>
                            <TextBlock x:Uid="UserFunctionsText"
                                       Grid.Row="0"
                                       Grid.Column="8"
                                       VerticalAlignment="Center"
                                       Margin="5 0 5 0"/>
                            <Button Grid.Row="0"
                                    Grid.Column="9"
                                    Margin="0 0 0 0" HorizontalAlignment="Stretch">
                                <StackPanel>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="Select"
                                                   Margin="0 0 10 0" />
                                        <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE70D;"/>
                                    </StackPanel>
                                </StackPanel>
                                <Button.Flyout>
                                    <Flyout Placement="Bottom">
                                        <StackPanel Orientation="Vertical">
                                            <ListView x:Name="UserFunctions" ItemsSource="{x:Bind ViewModel.UserFunctions, Mode=OneWay}"
                                                      SelectionMode="Multiple"
                                                      VerticalContentAlignment="Top"
                                                      ScrollViewer.IsVerticalRailEnabled="True"
                                                      ScrollViewer.VerticalScrollBarVisibility="Visible">
                                                <i:Interaction.Behaviors>
                                                    <ic:EventTriggerBehavior EventName="SelectionChanged">
                                                        <ic:InvokeCommandAction
                                                            Command="{x:Bind ViewModel.SelectedItemsCommand}"
                                                            CommandParameter="{x:Bind UserFunctions.SelectedItems,Mode=OneWay}"/>
                                                    </ic:EventTriggerBehavior>
                                                </i:Interaction.Behaviors>
                                            </ListView>
                                        </StackPanel>
                                    </Flyout>
                                </Button.Flyout>
                            </Button>
                            <Button Grid.Row="0"
                                    Grid.Column="10"
                                    Margin="5 0 0 0"
                                    Command="{x:Bind ViewModel.SearchCommand}">
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock x:Uid="SearchButtonText"
                                               Margin="0 0 10 0" />
                                    <SymbolIcon Symbol="Zoom"/>
                                </StackPanel>
                            </Button>
                            <Button Grid.Row="1"
                                    Grid.Column="9"
                                    Command="{x:Bind ViewModel.AddUserCommand}">
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock x:Uid="CreateNewButtonText" Margin="0 0 20 0"/>
                                    <SymbolIcon Symbol="AddFriend"/>
                                </StackPanel>
                            </Button>
                            <Button Grid.Row="1"
                                    Grid.Column="10"
                                    Margin="5 0 0 0"
                                    Command="{x:Bind ViewModel.ClearCommand}">
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock x:Uid="ClearButtonText" Margin="0 0 20 0"/>
                                    <SymbolIcon Symbol="Refresh"/>
                                </StackPanel>
                            </Button>
                        </Grid>
                    </StackPanel>
                </Grid>
            </Border>
        </StackPanel>
        <Grid Grid.Row="1" Margin="0 5 0 5">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="10"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <telerikGrid:RadDataGrid x:Name="UserGrid"
                                     MinHeight="150"
                                     ItemsSource="{x:Bind ViewModel.Source}"
                                     AutoGenerateColumns="False"
                                     RowHeight="25"
                                     SelectionMode="Multiple"
                                     SelectionUnit="Row"
                                     UserGroupMode="Disabled">
                <i:Interaction.Behaviors>
                    <ic:EventTriggerBehavior EventName="SelectionChanged">
                        <ic:InvokeCommandAction
                            Command="{x:Bind ViewModel.SelectedUsersCommand}"
                            CommandParameter="{x:Bind UserGrid.SelectedItems,Mode=OneWay}"/>
                    </ic:EventTriggerBehavior>
                </i:Interaction.Behaviors>
                <telerikGrid:RadDataGrid.Columns>
                    <telerikGrid:DataGridTemplateColumn SizeMode="Fixed" Width="20">
                        <telerikGrid:DataGridTemplateColumn.CellContentTemplate>
                            <DataTemplate>
                                <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                                    <CheckBox/>
                                </StackPanel>
                            </DataTemplate>
                        </telerikGrid:DataGridTemplateColumn.CellContentTemplate>
                    </telerikGrid:DataGridTemplateColumn>
                    <telerikGrid:DataGridTextColumn SizeMode="Auto"  PropertyName="UserName" Header="Name"/>
                    <telerikGrid:DataGridTextColumn SizeMode="Auto"  PropertyName="UserEmail" Header="Email"/>
                    <telerikGrid:DataGridTextColumn SizeMode="Auto"  PropertyName="DepartmentName" Header="Department"/>
                    <telerikGrid:DataGridBooleanColumn SizeMode="Auto" PropertyName="UserActiveIndicator" Header="User Status" />
                    <telerikGrid:DataGridDateColumn SizeMode="Auto" PropertyName="RecordCreated" Header="Date Created" CellContentFormat="{}{0:d}"/>
                    <telerikGrid:DataGridDateColumn SizeMode="Auto" PropertyName="RecordModified" Header="Date Modified" CellContentFormat="{}{0:d}"/>
                </telerikGrid:RadDataGrid.Columns>
            </telerikGrid:RadDataGrid>
            <telerikPrimitives:RadGridSplitter Grid.Row="1"
                                               ResizeBehavior="BasedOnAlignment"
                                               ResizeDirection="Rows"
                                               HorizontalAlignment="Stretch">
                <telerikPrimitives:RadGridSplitter.Element>
                    <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}" Glyph="&#xE76F;" FontSize="10"/>
                </telerikPrimitives:RadGridSplitter.Element>
            </telerikPrimitives:RadGridSplitter>
            <Grid Grid.Row="2" Margin="0 2 0 0">
                <telerik:RadTabControl>
                    <telerik:RadTabControl.Items>
                        <telerik:RadTabItem Header="User Details">
                            <telerik:RadTabItem.Content>
                                <controls:AddEditControl x:Name="AddEditControl" DataContext="{x:Bind ViewModel.UserDetailsViewModel}" />
                            </telerik:RadTabItem.Content>
                        </telerik:RadTabItem>
                        <telerik:RadTabItem Header="Tab 2" Content="The content of tab item 2"/>
                        <telerik:RadTabItem Header="Tab 3" Content="The content of tab item 3"/>
                        <telerik:RadTabItem Header="Tab 4" Content="The content of tab item 4"/>
                    </telerik:RadTabControl.Items>
                </telerik:RadTabControl>
            </Grid>
        </Grid>
    </Grid>
</Page>

DataGrid

GridSplitter

TabControl

answered on 26 Sep 2022

1 answer

1.0K+ views

How to print a PDF file in WinUI project?

Hi,

We are using controls from Telerik UI for WinUI in our project. There is sales invoice report and generated PDF file of that report. We would like to show print dialog after processing the sales invoice. For this purpose we are using WinUI PdfViewer (RadPdfViewer control). The RadPdfViewer control shows content of PDF file, we are not able to print.

RadPdfViewer has Print() method. When we set DocumentSource as PDF file and call Print() method, should it show print dialog? See attached sample project, run and click "Print report" button. Nothing happen, but my expectation is showing print dialog. Any idea/solution to print pdf file?

General Discussions

PdfViewer

answered on 23 Sep 2022