Questions on UI for WPF Forum

1 answer

78 views

RadVirtualGrid - CellValueNeeded doesn't support complex data types?

I have a list of <Data>, which I use to bind to a VirtualGrid
Data:

-Value [InnerData]:

-- Name [string]

-- Description [string]

I use CellTemplateNeeded event handler to select a DataTemplate for the columns :

private void RadVirtualGrid_CellTemplateNeeded(object sender, CellTemplateEventArgs e)
{
  e.DataTemplate = this.Resources["Template"] as DataTemplate;
}

        <DataTemplate x:Key="Template">
            <StackPanel>
                <Label Content="{Binding Name}" />
                <Label Content="{Binding Description}" />
            </StackPanel>
        </DataTemplate>

And then I use CellValueNeeded to set the Value:

private void RadVirtualGrid_CellValueNeeded(object sender, CellValueEventArgs e)
{
  e.Value = viewModel.List[e.RowIndex].Value;
}

So, basically I want to be able to "bind" an object to the Value of the Column.

Then, I want to display multiple properties of the object in the DataTemplate.

It works fine with string data, for e.g.:

e.Value = viewModel.List[e.RowIndex].Value.Name

<Label Content="{Binding }" />

It doesn't work with objects:

e.Value = viewModel.List[e.RowIndex].Value

<Label Content="{Binding Name}" />

A workaround was to "bind" to a string which contains both properties, $"{name}--#--{description}", then use a converter to get the name and description and display it.
But, I want to be able to pass an object, as I might need to display multiple properties.

Is there a limitation here? Can you recommend a better way to do it?

Thanks

VirtualGrid

answered on 04 Jun 2024

0 answers

72 views

RadRichTextBox Basealignment is not changing

In my project, there is radrichtextbox. I am trying to change fontfamily and basealignment of the text present inside the radrichtextbox whenever that radrichtextbox loads using below code.

radRichTextBox.FontFamily = new System.Windows.Media.FontFamily("Symbol");
radRichTextBox.ChangeBaselineAlignment(Telerik.Windows.Documents.Model.BaselineAlignment.Subscript);

But I see no change in the text. Am I missing something?

General Discussions

RichTextBox

asked on 04 Jun 2024

1 answer

106 views

ValidationErrorTemplate: ToolTip display mode on MultiColumnComboBox ?

Hi,

I'm using a RadMultiColumnComboBox and can't seem to be able to set the validation error template to Tooltip using:

telerik:ValidationErrorTemplateHelper.DisplayMode="ToolTip"

It always set the validation message on the right of the control, and in my case it's being clipped by the windows limits.

This usually works great on all other controls.

Thank you for your help

MultiColumnComboBox

answered on 03 Jun 2024

0 answers

56 views

Null pane with custom RemovePane method

I'm getting a null reference exception when closing one of the pane and could not figure out why it is null in the RemovePane(RadPane pane) method.

We have override to that method,

protected override void RemovePane(RadPane pane)
        {
            if(pane.Header.ToString().ToLower()=="digital" || pane.Header.ToString().ToLower() == "analog")
                SaveDebugPaneLayout(pane);
            pane.DataContext = null;
            pane.Content = null;
            pane.ClearValue(RadDocking.SerializationTagProperty);
            pane.RemoveFromParent();
        }

And also the CreatePaneForItem method,

protected override RadPane CreatePaneForItem(object item)
        {
            var viewModel = item as DebugPaneViewModel;
            if (viewModel != null)
            {
                var pane = viewModel.IsDocument ? new RadDocumentPane() : new RadPane();

                pane.DataContext = item;
    
                if (viewModel.ContentType != null)
                {
                    if (viewModel.GetType().ToString().EndsWith("EditorViewModel")) 
                    {
                        if (pane.Content == null)
                        {
                            dynamic obj = Activator.CreateInstance(viewModel.ContentType);
                            pane.Content = obj;
                            obj.DataContext = viewModel;
                        }
                    }
                    else
                    {
                        pane.Content = Activator.CreateInstance(viewModel.ContentType);
                    }
                }

                RadDocking.SetSerializationTag(pane, viewModel.ID);
                return pane;
            }

            return base.CreatePaneForItem(item);
        }

How can I know which pane is null when it is executing the RemovePane(). I tried looking at when panes are being added but did not see anything suspicious.

Docking

asked on 31 May 2024

1 answer

82 views

How to display the drop down with all records on arrow key down in RadAutoCompleteBox

Dear All,

I am using the RadAutoCompleteBox as follows. I would like to display all Products when pressing the "Keyboard Down Arrow" on the RadAutoCompleteBox. Is this possible?

<telerik:RadAutoCompleteBox Height="23" Width="180" Background="#FFEDF4AB" Margin="3,0,0,0" 
							ItemsSource="{Binding Products}" 
							SelectedItem="{Binding SelectedProductItem, Mode=TwoWay}"                                                
							SelectionMode="Single" 
							TextSearchMode="StartsWith"
							SearchText="{Binding Name, Mode=TwoWay}"
							TextSearchPath="Name"
							DisplayMemberPath="Name"
							AutoCompleteMode="Suggest" >
	<telerik:RadAutoCompleteBox.DropDownItemTemplate>
		<DataTemplate>
			<StackPanel Orientation="Horizontal">
				<TextBlock Text="{Binding Name}" FontWeight="Bold" Foreground="Black" Width="200" />
			</StackPanel>
		</DataTemplate>
	</telerik:RadAutoCompleteBox.DropDownItemTemplate>
	<Behaviors:Interaction.Triggers>
		<Behaviors:EventTrigger EventName="SelectionChanged">
			<Behaviors:InvokeCommandAction Command="{Binding SelectProductCommand}" />
		</Behaviors:EventTrigger>
	</Behaviors:Interaction.Triggers>
</telerik:RadAutoCompleteBox>

AutoCompleteBox

answered on 31 May 2024

0 answers

58 views

Style or Template for RadToolBarOverflowPanel

Hello,

is there a way to style the RadToolBarOverflowPanel? Or add a template for its items?

I would like to display the button on the left side and show the tooltip next to it.

Any help would be appreciated.

Best regards :)

Styling

ToolBar

asked on 30 May 2024

1 answer

60 views

Correctly style PaneHeaders in different RadPaneGroups

Hi, I have an issue trying to style RadDocking control.

I want that my PaneHeaders change their background when user selects them. I tried to modify RadPaneGroup ControlTemplate and RadPane Control Template, but with no luck. Could you please provide me detail sample for that?

One more question - how to correctly control height of the RadGroupHeader (Part where PaneHeaders *(tabs) are suited)? I simply dont understand which part of template should be responcible for that.

P.S. I am using Office 2019 theme.

Docking

answered on 30 May 2024

0 answers

62 views

AStarRouter

Can you please give a small example of "AStart Router" used in routing with tree layout.

Diagram

asked on 28 May 2024

0 answers

95 views

GridViewDataColumn ; SearchBox error in Distinct values

I have customized filtering control along with behavior,

Im trying to use SearchBox control in distinct values filter ive tried "EnableDistinctValuesFiltering="True""
even though i have search box it doest work,

example: in this screenshot ive type pending but the list still remains the same

here is my style

GridView

updated question on 27 May 2024

2 answers

100 views

RadDesktopAlert MVVM - Handle Button Click

I am attempting to use the desktop alert but instead of reacting to a click on the content I want a button. How do I route this?

View Model Method; show the alert (works)

        private void ShowAlert()
        {
            if (IsShowAlert &&
                AlertTitle.IsNotNullOrEmpty() &&
                AlertText.IsNotNullOrEmpty())
            {
                // Create a new BitmapImage
                BitmapImage bitmap = new BitmapImage();
                bitmap.BeginInit();
                bitmap.UriSource = new Uri("pack://application:,,,/Images/GSI_Cloud_256.ico");
                bitmap.EndInit();

                var image = new System.Windows.Controls.Image() { Source = bitmap };

                desktopAlertManager.ShowAlert(new DesktopAlertParameters
                {
                    Header = AlertTitle,
                    Content = AlertText,
                    Icon = image,
                    IconColumnWidth = 48,
                    IconMargin = new Thickness(10, 0, 20, 0),
                    ShowDuration = AlertShowDuration,
                    Command = new DelegateCommand(OnAlertCommandExecuted)
                });
            }
        }

Respond to the Button Press:

        private void OnAlertCommandExecuted(object param)
        {
            IsShowTrayApp = true;
        }

Alert Style with a Button:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation">

    <SolidColorBrush x:Key="DesktopAlert_BorderBrush" Color="#FF848484"/>
    <LinearGradientBrush x:Key="DesktopAlert_Background" EndPoint="0.5,1" StartPoint="0.5,0">
        <GradientStop Color="Cornsilk" Offset="0"/>
        <GradientStop Color="#FFD4D4D4" Offset="1"/>
    </LinearGradientBrush>
    <SolidColorBrush x:Key="DesktopAlert_InnerBorderBrush" Color="#FFFFFFFF"/>
    <CornerRadius x:Key="DesktopAlert_CornerRadius">1</CornerRadius>
    <SolidColorBrush x:Key="DesktopAlert_ButtonIconStroke" Color="#FFFFFFFF"/>
    <LinearGradientBrush x:Key="DesktopAlert_ButtonIconFill" EndPoint="0.5,1" StartPoint="0.5,0">
        <GradientStop Color="#FF282828"/>
        <GradientStop Color="#FF7C7C7C" Offset="1"/>
    </LinearGradientBrush>

    <DataTemplate x:Key="RadDesktopAlertHeaderTemplate">
        <Grid 
            x:Name="Header" 
            Grid.Column="1" 
            Grid.Row="0" 
            VerticalAlignment="Top" 
            HorizontalAlignment="Stretch"
            Background="{StaticResource ContainerHeaderBackgroundBrush}">

            <StackPanel
                HorizontalAlignment="Left"
                Orientation="Horizontal">

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

                    <Image 
                        RenderOptions.BitmapScalingMode="Fant"
                        Margin="5 0 5 0"
                        Source="/Images/GSI_Cloud_256.ico"/>

                    <Label
                        Grid.Column="1"
                        Foreground="White"
                        FontWeight="SemiBold"
                        FontSize="14"
                        VerticalContentAlignment="Center"
                        VerticalAlignment="Center"/>
                </Grid>
                
            </StackPanel>

            <StackPanel
                HorizontalAlignment="Right"
                Orientation="Horizontal">

                <Button Height="30" Width="30"  
	                x:Name="DesktopAlert_CloseButton" 
                    Content="🗙"
                    Background="Transparent"
                    BorderThickness="0"
                    Foreground="White"
                    FontSize="20"
                    Margin="0 -3 0 0"
                    FontWeight="Bold"
                    Command="{x:Static telerikNavigation:DesktopAlertCommands.Close}" />

            </StackPanel>

            <ContentPresenter 
                Content="{Binding}" 
                TextBlock.FontWeight="Bold" 
                Margin="0 0 0 0" 
                MinHeight="{Binding ActualHeight, ElementName=DesktopAlert_CloseButton}" Grid.RowSpan="2" VerticalAlignment="Top">

                <ContentPresenter.Resources>
                    <Style TargetType="{x:Type TextBlock}">
                        <Setter Property="TextWrapping" Value="Wrap"/>
                        <Setter Property="Foreground" Value="White" />
                        <Setter Property="VerticalAlignment" Value="Center" />
                        <Setter Property="HorizontalAlignment" Value="Left" />
                        <Setter Property="Margin" Value="30 0 0 0" />
                    </Style>
                </ContentPresenter.Resources>
            </ContentPresenter>

        </Grid>
    </DataTemplate>

    <ControlTemplate x:Key="RadDesktopAlertTemplate" TargetType="{x:Type telerikNavigation:RadDesktopAlert}">
        <Grid x:Name="LayoutRoot">
            <Border Background="White"
                    BorderThickness="{TemplateBinding BorderThickness}" 
                    CornerRadius="{StaticResource DesktopAlert_CornerRadius}">

                <Border BorderBrush="{StaticResource DesktopAlert_InnerBorderBrush}" BorderThickness="1">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="26" />
                        </Grid.RowDefinitions>
                        
                        <ContentPresenter 
                            ContentTemplate="{TemplateBinding HeaderTemplate}" 
                            Grid.Column="1" 
                            Content="{TemplateBinding Header}" 
                            Grid.Row="0" VerticalAlignment="Top"/>

                        <ContentPresenter 
                            x:Name="Content" 
                            Cursor="Hand" 
                            Grid.Column="1" 
                            HorizontalAlignment="Center" 
                            Margin="0 7 0 0" Grid.Row="1" VerticalAlignment="Top">

                            <ContentPresenter.Resources>
                                <Style TargetType="{x:Type TextBlock}">
                                    <Setter Property="TextWrapping" Value="Wrap"/>
                                    <Setter Property="TextTrimming" Value="CharacterEllipsis"/>
                                    <Setter Property="HorizontalAlignment" Value="Center" />
                                    <Setter Property="FontSize" Value="14" />
                                </Style>
                            </ContentPresenter.Resources>
                        </ContentPresenter>

                        <Grid Grid.Row="2">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="126" />
                            </Grid.ColumnDefinitions>

                            <Button
                                Style="{StaticResource ButtonStyle}"
                                Grid.Column="2"
                                Content="Open" 
                                Command="{Binding OnAlertCommandExecuted}"/>
                        </Grid>
                    </Grid>
                </Border>
            </Border>
        </Grid>
    </ControlTemplate>

    <Style TargetType="{x:Type telerikNavigation:RadDesktopAlert}">
        <Setter Property="Padding" Value="10 8"/>
        <Setter Property="Opacity" Value="0.9"/>
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="14"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="BorderBrush" Value="{StaticResource DesktopAlert_BorderBrush}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Width" Value="360"/>
        <Setter Property="Height" Value="130"/>
        <Setter Property="Template" Value="{StaticResource RadDesktopAlertTemplate}"/>
        <Setter Property="HeaderTemplate" Value="{StaticResource RadDesktopAlertHeaderTemplate}"/>
    </Style>
</ResourceDictionary>

DesktopAlert

answered on 24 May 2024