Questions on UI for WPF Forum

2 answers

280 views

Hide label with value 0 in RadPieChart

Hello all,

How hide label with value 0 in a RadPieChart ?

Here is my current code (and the result is in attachment) :

<telerik:RadPieChart x:Name="PieChart" Grid.Row="0">

<telerik:RadPieChart.Behaviors>

<telerik:ChartTooltipBehavior />

</telerik:RadPieChart.Behaviors>

<telerik:RadPieChart.Series>

<telerik:DoughnutSeries ItemsSource="{Binding GraphItems}" ValueBinding="Value" ShowLabels="True">

<telerik:DoughnutSeries.TooltipTemplate>

<DataTemplate>

<Border Background="Black" Padding="5" TextElement.Foreground="White">

<StackPanel>

<TextBlock Text="{Binding DataItem.Label}" />

<StackPanel Orientation="Horizontal">

<TextBlock Text="{Binding Value}" FontWeight="Bold" />

</StackPanel>

</Border>

</DataTemplate>

</telerik:DoughnutSeries.TooltipTemplate>

<telerik:DoughnutSeries.SliceStyles>

<Style TargetType="Path">

<Setter Property="Fill" Value="{Binding DataItem.Color}" />

</Style>

</telerik:DoughnutSeries.SliceStyles>

<telerik:DoughnutSeries.LabelDefinitions>

<telerik:ChartSeriesLabelDefinition Margin="9 0 0 0" DefaultVisualStyle="{StaticResource LabelStyle}">

<telerik:ChartSeriesLabelDefinition.Binding>

<telerik:PropertyNameDataPointBinding PropertyName="Value" />

</telerik:ChartSeriesLabelDefinition.Binding>

</telerik:ChartSeriesLabelDefinition>

</telerik:DoughnutSeries.LabelDefinitions>

</telerik:DoughnutSeries>

</telerik:RadPieChart.Series>

</telerik:RadPieChart>

Thx,

ChartView

answered on 16 Aug 2018

1 answer

268 views

turn off drag and drop on a radDocking

Hi,

I want to stop the user the ability to undock.

i.e - to turn off drag and drop.

How can we achieve this ?

Thanks,

Ian

General Discussions

answered on 16 Aug 2018

5 answers

164 views

Bar series with Point series in one cartesian chart?

Hi,

I am having problems displaying Histogram(bar series) with Points(point series) within them in a CartesianChart in WPF.

If I declare only one single Horizontal axis(Categorical) for both the series, then the series are appearing one after another horizontally.

If I declare two separate axis(categorical) for both, then the scales arent getting adjusted equally.

I would want to achieve such that either both share a single Horizontal axis and both series are drawn overlapping or

let both series have two separate axis and their scale is equvivalent.

How do I achieve this?

Chart

answered on 16 Aug 2018

0 answers

195 views

RadRibbonGallery MVVM

Hello,

I'm trying to add RadRibbonGallery to MVVM examplefrom the Example Demo:
\Telerik_UI_for_WPF_2018_1_220_Demos\Examples\RibbonView\MVVM

so i already add a template selector and add the elements in view model
the RadRibbonGallery displayed

BUT, the images inside each item has border when mouse is hover, and on click the item NOT selected,

only if i click on the the BORDER of each item inside the Galley, then the item selected

here is my progress until now:

the template selector:

<mvvm:ButtonsTemplateSelector x:Key="groupsSelector"

Button="{StaticResource ButtonTemplate}"

SplitButton="{StaticResource SplitButtonTemplate}"

ButtonsGroup="{StaticResource ButtonsGroup}"

SmallButtonGroup="{StaticResource SmallButtonGroup}"

Gallery="{StaticResource RibbonViewElementGalleryTemplate}" />

<DataTemplate x:Key="RibbonViewElementGalleryTemplate">

<telerik:RadRibbonGallery ItemsSource="{Binding Items}"

SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}"

Width="240"

MaxWidth="240"

ViewportWidth="220"

ViewportHeight="48"

ItemWidth="64"

ItemHeight="48"

PopupViewportWidth="300">

<telerik:RadRibbonGallery.ItemsPanel>

<ItemsPanelTemplate>

<telerikRibbonViewPrimitives:RibbonGalleryPanel />

</ItemsPanelTemplate>

</telerik:RadRibbonGallery.ItemsPanel>

<telerik:EventToCommandBehavior.EventBindings>

<telerik:EventBinding Command="{Binding MouseLeftButtonUpCommand}" EventName="MouseLeftButtonUp" RaiseOnHandledEvents="True" PassEventArgsToCommand="True" />

</telerik:EventToCommandBehavior.EventBindings>

<telerik:RadRibbonGallery.ItemTemplate>

<DataTemplate>

<telerik:RadGalleryItem BorderBrush="Red"

BorderThickness="1"

Margin="1"

Padding="0"

Image="{Binding Image}"

IsHeader="{Binding IsHeader}"

Content="{Binding TipTitle, Mode=TwoWay}"

Width="64"

Height="48"

telerik:ScreenTip.Description="{Binding TipDescription}"

telerik:ScreenTip.Title="{Binding TipTitle}">

<telerik:RadGalleryItem.Template>

<ControlTemplate TargetType="telerikRibbonView:RadGalleryItem">

<Grid>

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="KeyboardNavigationStates">

<VisualState x:Name="KeyboardUnfocused" />

<VisualState x:Name="KeyboardFocused">

<Storyboard>

<DoubleAnimation Storyboard.TargetName="KeyboardNavigationVisual" Storyboard.TargetProperty="Opacity" To="1" Duration="0" />

</Storyboard>

</VisualState>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Border x:Name="BorderVisual" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}"

BorderThickness="{TemplateBinding BorderThickness}" >

<Grid>

<ContentControl x:Name="contentControl"

ContentTemplate="{TemplateBinding ContentTemplate}"

Content="{TemplateBinding Content}" IsTabStop="False"

HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

VerticalAlignment="{TemplateBinding VerticalContentAlignment}"

Foreground="{TemplateBinding Foreground}"

ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"

ContentStringFormat="{TemplateBinding ContentStringFormat}" />

<Image x:Name="Image"

Stretch="Fill"

Source="{TemplateBinding Image}"

HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

</Grid>

</Border>

<!--<Border x:Name="MouseOverSelectedBorder" Opacity="0" BorderThickness="1" BorderBrush="{StaticResource MarkerBrush}"/>

<Border x:Name="KeyboardNavigationVisual"

Opacity="0" CornerRadius="{StaticResource CornerRadius}"

BorderThickness="{TemplateBinding BorderThickness}"

BorderBrush="{StaticResource MouseOverBrush}" />-->

</Grid>

<ControlTemplate.Triggers>

<!--<Trigger Property="IsMouseOver" Value="True">

<Setter TargetName="BorderVisual" Property="BorderBrush" Value="{StaticResource MouseOverBrush}" />

</Trigger>

<Trigger Property="IsSelected" Value="True">

<Setter TargetName="BorderVisual" Property="BorderBrush" Value="{StaticResource PressedBrush}" />

</Trigger>-->

<MultiTrigger>

<MultiTrigger.Conditions>

<Condition Property="IsMouseOver" Value="True" />

<Condition Property="IsSelected" Value="True" />

</MultiTrigger.Conditions>

</MultiTrigger>

<Trigger Property="IsHeader" Value="True">

<Setter TargetName="BorderVisual" Property="Margin" Value="5 0 0 0" />

<Setter TargetName="contentControl" Property="HorizontalAlignment" Value="Left" />

<Setter TargetName="BorderVisual" Property="BorderThickness" Value="0" />

</Trigger>

<!--<Trigger Property="IsEnabled" Value="False">

<Setter TargetName="contentControl" Property="Opacity" Value="{StaticResource DisabledOpacity}" />

<Setter TargetName="Image" Property="Opacity" Value="{StaticResource DisabledOpacity}" />

</Trigger>-->

</ControlTemplate.Triggers>

</ControlTemplate>

</telerik:RadGalleryItem.Template>

</telerik:RadGalleryItem>

</DataTemplate>

</telerik:RadRibbonGallery.ItemTemplate>

</telerik:RadRibbonGallery>

</DataTemplate>

public class RibbonViewElementGallery : RibbonViewElementBase

{

private string title;

public string Title

{

get { return title; }

set

{

if (this.title != value)

{

this.title = value;

this.OnPropertyChanged("Title");

}

private int selectedIndex;

public int SelectedIndex

{

get { return selectedIndex; }

set

{

if (this.selectedIndex != value)

{

this.selectedIndex = value;

this.OnPropertyChanged("SelectedIndex");

Log.Logger.Instance.Log("RibbonViewElementGallery SelectedIndex = " + this.selectedIndex.ToString(), Prism.Logging.Category.Debug, Prism.Logging.Priority.High);

}

private int width = 300;

public int Width

{

get { return width; }

set

{

if (this.width != value)

{

this.width = value;

this.OnPropertyChanged("Width");

}

private int popupViewportWidth = 400;

public int PopupViewportWidth

{

get { return popupViewportWidth; }

set

{

if (this.popupViewportWidth != value)

{

this.popupViewportWidth = value;

this.OnPropertyChanged("PopupViewportWidth");

}

private ObservableCollection<RibbonViewElementGalleryItem> items;

public ObservableCollection<RibbonViewElementGalleryItem> Items

{

get { return items; }

set

{

if (this.items != value)

{

this.items = value;

this.OnPropertyChanged("Items");

}

//

private ObservableCollection<RadMenuItem> popupMenuItems;

public ObservableCollection<RadMenuItem> PopupMenuItems

{

get { return popupMenuItems; }

set

{

if (this.popupMenuItems != value)

{

this.popupMenuItems = value;

this.OnPropertyChanged("PopupMenuItems");

}

public ICommand MouseLeftButtonUpCommand { get; private set; }

private void MouseLeftButtonUpCommand_Execute(object arg)

{

var e = arg as System.Windows.Input.MouseButtonEventArgs;

Logger.Instance.Log(String.Format("MouseButtonEventArgs Source : {0}", e.Source.ToString()), Prism.Logging.Category.Debug, Prism.Logging.Priority.High);

if (e.Source != null && e.Source is RadRibbonGallery)

{

}

private bool MouseLeftButtonUpCommand_CanExecute(object arg)

{

return true;

}

public RibbonViewElementGallery()

{

string ImagePath = "/k1.Windows.Core.Resources;component/RibbonView/{0}";

this.Title = "Gallery Demo";

this.Items = new ObservableCollection<RibbonViewElementGalleryItem>();

this.Items.Add(new RibbonViewElementGalleryItem()

{

Image = string.Format(ImagePath, "new.png"),

IsHeader = true,

IsSelected = false,

TipDescription = "Header of items",

TipTitle = "Header1"

});

for (int i = 0; i < 7; i++)

{

this.Items.Add(new RibbonViewElementGalleryItem(string.Format(ImagePath, "ProjectsHistory.png"), false, string.Format("Tip {0} Title", 10 * i + 1)));

this.Items.Add(new RibbonViewElementGalleryItem(string.Format(ImagePath, "SampleProjects.png"), false, string.Format("Tip {0} Title", 10 * i + 2)));

this.Items.Add(new RibbonViewElementGalleryItem(string.Format(ImagePath, "open.png"), false, string.Format("Tip {0} Title", 10 * i + 3)));

}

this.PopupMenuItems = new ObservableCollection<RadMenuItem>();

for (int i = 0; i < 5; i++)

{

this.PopupMenuItems.Add(new RadMenuItem()

{

Header = String.Format("Menu item {0}", i.ToString())

});

}

this.MouseLeftButtonUpCommand = new DelegateCommand<object>(MouseLeftButtonUpCommand_Execute, MouseLeftButtonUpCommand_CanExecute);

}

public class RibbonViewElementGalleryItem

{

private string image;

public string Image

{

get { return image; }

set { image = value; }

}

private bool isSelected;

public bool IsSelected

{

get { return isSelected; }

set { isSelected = value; }

}

private bool isHeader = false;

public bool IsHeader

{

get { return isHeader; }

set { isHeader = value; }

}

private string tipDescription = "tip Description";

public string TipDescription

{

get { return tipDescription; }

set { tipDescription = value; }

}

private string tipTitle = "tip Title";

public string TipTitle

{

get { return tipTitle; }

set { tipTitle = value; }

}

public RibbonViewElementGalleryItem()

{

}

public RibbonViewElementGalleryItem(string image, bool isSelected, string tipTitle)

{

this.Image = image;

this.TipTitle = tipTitle;

this.IsSelected = isSelected;

}

public override string ToString()

{

return string.Format("[GalleryItem : image = {0}]", this.image);

}

also the items with IsHeader = True
displayed inside the gallery as Item, when the Gallery is Open, they are not displayed as Headers

see images.

Can you help please with this issue or provide a link for help about this or Example of RadRibbonGallery MVVM ?

Thanks,

RibbonView and RibbonWindow

asked on 16 Aug 2018

0 answers

108 views

GridViewRow template customization

Hi.

I have RadGridView with some 12 columns defined. This grid is bound to list of business objects and is editable.

I would like some rows of the grid to have changed layout.

I was able to define and apply ControlTemplate for GridViewRow, to display row data in one TextBlock that has width equal to the width of the Grid.

This template works fine for rows selected by one of the businessobject properties (using DataTrigger)

But I need to further modify this Template in this way that, its width should be equal to the total width of the first 8 columns and the last 4 columns should be visible and editable as in standard grid row.

In existing threads i didn't found any soulution to this problem, so I would like to ask how can I achieve such an effect?

I am using RadGridView version 2018.1.

Thanks in advance.

GridView

asked on 15 Aug 2018

3 answers

139 views

RadRibbonView is too high in the Fluent theme

Hello,

In the documentation, it is said that the image for a large button should be 32 x 32 pixels. With images this size, there is a huge empty area in the bottom of the RibbonView.

If the height is correct, the buttons should be vertically aligned... or, better, a top margin should be added.

See the screenshot

RibbonView and RibbonWindow

answered on 15 Aug 2018

3 answers

114 views

RadRibbonButton has its content left aligned in Fluent theme

Hello,

When a button has a text that is larger than 32 pixels, the content of the button is left align, but it should be centered, as in other themes.

See the screen shot for an example.

RibbonView and RibbonWindow

answered on 15 Aug 2018

9 answers

464 views

RadGridView - Data Virtualization

Hi,

I have a requirement to populate high volume of data(>50000 rows) in the gridview. I feel data vitualization/lazy loading is a good way to implement this. If I load 500 records at a time and keep loading while scrolling the content the next set, how can I address the following scenarios :

Select All option(for the whole underlying datasource)
Sorting, grouping features of the grid(for the whole underlying datasource)
Export to excel feature(for the whole underlying datasource)

Assuming all the records are not loaded for the above mentioned scenarios,

Regards,
Anand

Data Virtualization

answered on 15 Aug 2018

3 answers

702 views

GridView control dynamic column binding

Hi,

I have a requirement to implement a screen to show information in a grid with distinct columns/data for each button click(3 buttons).

For e.g., Button1_Click -> Grid must render columns ( Column1, Column2)

Button2_Click -> Grid must render columns ( Column11, Column12, Column13)

Button3_Click -> Grid must render columns ( Column21, Column22, Column23, Column24 etc.,)

I do not want to have 3 different grids for each button click by show/hide and have their exclusive bindings just because i feel it is not a right approach. Also I should be able to bind my data fields appropriately to the columns. I really appreciate if someone can share their experience to achieve this in a manageable and scalable way. Hope the scenario is self explanatory. Thanks in advance.

Regards,

Chand.

GridView

answered on 15 Aug 2018

1 answer

138 views

Search As you type in hierarchical grid.

Hello,

We are extensively using hierarchical radgridview in our application. We want to provice search as you type functionality for child grids too but it look like it only searches parent grid. Can you let me know how to achive this functionlity ?

Thanks

Sandeep

GridView

answered on 15 Aug 2018