Questions on UI for WPF Forum

3 answers

70 views

Hi,

I recently noticed some strange behaviour when using the search panel of the GridView.

In our application the AvalonDock control (Xceed) is used for the UI. Each time the user selects a program in the menu, a UserControl is opened in a new docked document of the AvalonDock control.

Now for the strange behaviour:

Program A with GridViewA is launched
A search criteria is entered, GridViewA shows the result (so far so good)
Program B with GridViewB is launched. For GridViewB the search panel is hidden by default
Return to the docked document containing program A => the search panel is also hidden
Pressing CTRL+F opens the search panel for GridViewA, but no search criteria is shown => the displayed data is limited to the search criteria, impossible to view all records in GridViewA !!

Any help would be much appreciated !

Best Regards,
Hans

GridView

answered on 05 Mar 2019

8 answers

2.3K+ views

Scrolling entire elements problem

Hello,
We're using RadListbox to display elements of varying height. Some of them are small, some are large.
The default behaviour of the scroll mechanism seems to work based on the whole items.
For example if the user clicks with his mouse on the up or down arrow of the scrollbar (vertical one) he gets shifted by the length of the visible item. Gets shifted more for bigger items.
Also, when doing

var v = radlistboxChat.ChildrenOfType<ScrollViewer>();
foreach (var q in v)
{
q.ScrollToBottom();
}

to programatically scroll down to the last item, often we observe that in case of larger items, the item gets positioned at the top of the RadListbox, leaving an empty space below. My guess is that it happens because the previous item is also big, and if this was to scroll to the bottom, it would show the last element at the bottom but the previous element would not fit the remaining space and would need to be displayed partially, which the listbox doesnt want to do.

We found a simple solution to the problem. We do something like this:

<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
<telerik:RadListBox ScrollViewer.VerticalScrollBarVisibility="Disabled" >
</ScrollViewer>

This puts the listbox into a scrollviewer that works as expected. It operates on pixel lenghts rather than item height's, so the scrolling is smooth and scrolltobottom works as expected.
However, there is a very weird behaviour observed with this solution.
Populating items and refreshing the listbox becomes significantly longer. An average sized list of items refreshed in 90 ms without the additional scrollviewer, but it took 1800 ms to do the same with the scrollviewer, That's 20 times longer. Our requirements indicate that our list needs to refresh quickly, since its often refreshed.

My question to you is:
Can I make the scrollbar of the listbox behave like in our solution while and maintain it's original speed?
thanks.

ListBox

answered on 05 Mar 2019

2 answers

159 views

Pasting national characters to RadPasswordBox from clipboard.

Good day.

National characters in RadPasswordBox are displayed as a
question mark, if the password is inserted through the clipboard.

This behavior is not observed in either RadWatermarkTextBox or PasswordBox.

Please tell me how to solve this problem.

Below is a link to the project and files.
https://drive.google.com/open?id=1fnNaE2Gs0SLVfnf2jvBHpyL4pJLhlF9i

Regards,
Denis

PasswordBox

answered on 04 Mar 2019

2 answers

661 views

How to get selected cell on MouseDoubleClick event?

Hello

I'm using RadGridView and try to handle the MouseDoubleClick-Event. My problem is to get the RadGridCell the user has double-clicked on.

Can you help me with this?

Thanks!

Best regards

Tobias

GridView

answered on 04 Mar 2019

0 answers

185 views

RadTileView orientation and margin

Hey. I use RadTileView and this is a great solution. Could you tell me how I can adjust the vertical Tiles distribution instead of the horizontal one? And how can I set margin=0 for Tiles?

01.<telerik:RadTileView x:Name="tile" RowHeight="*" ColumnWidth="*" ItemsSource="{Binding Path=PictureCollection}" SelectedItem="{Binding Path=SelectedPicture}" Grid.Column="2" Grid.RowSpan="3" IsAutoScrollingEnabled="True" >

02.

03. <telerik:RadTileView.Style>

04. <Style TargetType="{x:Type telerik:RadTileView}">

05. <Setter Property="Margin"

06. Value="0"/>

07. </Style>

08. </telerik:RadTileView.Style>

09.

10. <telerik:RadTileView.ItemContainerStyle>

11. <Style TargetType="{x:Type telerik:RadTileViewItem}">

12. <Setter Property="Margin"

13. Value="0"/>

14. </Style>

15. </telerik:RadTileView.ItemContainerStyle>

16.

17.

18. <telerik:RadTileView.ItemTemplate>

19. <DataTemplate>

20. <TextBlock Text="{Binding Path=Name}" FontSize="14" FontWeight="Bold"/>

21. </DataTemplate>

22. </telerik:RadTileView.ItemTemplate>

23.

24. <telerik:RadTileView.ContentTemplate>

25. <DataTemplate>

26. <Grid Margin="0">

27. <Grid.RowDefinitions>

28. <RowDefinition Height="4*" x:Name="Row1"/>

29. <RowDefinition Height="*" x:Name="Row2"/>

30. </Grid.RowDefinitions>

31.

32. <Border Background="Black" Margin="0" Grid.Row="0" >

33. <Grid>

34. <local2:ZoomBorder ClipToBounds="True" x:Name="BorderName">

35. <Grid>

36. <Image x:Name="ImageTop" Source="{Binding Path=Image}" />

37. <Button Command=

"{Binding RelativeSource={RelativeSource AncestorType=Controls:MetroWindow, Mode=FindAncestor}, Path=DataContext.FullScreenCommand}"

CommandParameter="{Binding Path=Name}" HorizontalAlignment="Right" VerticalAlignment="Top" Width="50" Height="50" Style="{DynamicResource MetroCircleButtonStyle}" Background="{DynamicResource AccentColorBrush}" ToolTip="{x:Static res:Resources.FullScreen}" Opacity="0.7" Margin="0,20,20,0">

38. <Rectangle Fill="{DynamicResource BlackColorBrush}" Width="20" Height="20">

39. <Rectangle.OpacityMask>

40. <VisualBrush Visual="{StaticResource appbar_vector_group}" Stretch="Fill"/>

41. </Rectangle.OpacityMask>

42. </Rectangle>

43. </Button>

44. </Grid>

45. </local2:ZoomBorder>

46. </Grid>

47. </Border>

48. <Controls:Tile Margin="0" Content="{x:Static res:Resources.Capture_Image}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Command=

"{Binding RelativeSource={RelativeSource AncestorType=Controls:MetroWindow, Mode=FindAncestor}, Path=DataContext.WebCamCaptureCommand}"

CommandParameter="{Binding Path=Name}" Grid.Row="1" Height="{Binding ElementName=Row1, Path=Height}" Width="{Binding ElementName=BorderName, Path=Width}" FontWeight="Bold" FontSize="14"/>

49. </Grid>

50.

51. </DataTemplate>

52. </telerik:RadTileView.ContentTemplate>

53. </telerik:RadTileView>

TileView

asked on 03 Mar 2019

0 answers

349 views

CellTemplate or CellEditingTemplate?

I have a column which has read mode or edit mode. Read mode means that column display text in a textblock. Edit mode means that the column display a textbox or combobox so the use can input the value in the control. So I want to customize the datetemplate.

<telerik:GridViewDataColumn DataMemberBinding="{Binding Salary}">

<telerik:GridViewDataColumn.CellTemplate>

<DataTemplate>

<StackPanel>

<TextBlock Text="{Binding Salary}" Visibility="{Binding ReadOrEdit, Convert={StackResources BooleanToOpacityConverter}}" Validation.ErrorTemplate="{StackResources myTemplate}"/>

<TextBox Text="{Binding Salary}" Visibility="{Binding ReadOrEdit, Convert={StackResources InvertedBooleanToVisibilityConverter}}" Validation.ErrorTemplate="{StackResources myTemplate}"/>

</StackPanel>

</DataTemplate>

</telerik:GridViewDataColumn.CellTemplate>

</telerik:GridViewDataColumn>

The validation template likes

<ControlTemplate x:Key="myTemplate">

<DockPanel>

<Border BorderBrush="Red" BorderThickness="1">

<AdornedElementPlaceholder x:Name="controlWithError"/>

</Border>

<TextBlock Foreground="Red" FontSize="20" FontFamily="Segoe UI" Margin="3,0,0,0" MouseDown="Exclamation_MouseDown" Tag="{Binding AdornedElement.(Validation.Errors)[0].ErrorContent, ElementName=controlWithError}">!</TextBlock>

</DockPanel>

</ControlTemplate>

I am not sure it is the right way. Should I put the textbox in CellEditingTemplate because of it is for editing? The reason is when we validate the textbox I found besides the textbox also inside the textbox there was a red border around the text. It means there are two adorners.

Thanks

GridView

asked on 03 Mar 2019

4 answers

457 views

Date cells registered as Date in Excel ?

This is a bit hard to describe, but I have a RadGridView that I'm exporting to Excel.

The date and time fields register as "General" (under Right Click --> "Format Cells") when I need them to be either "Date" or "Time" based on what they are. The Excel sorting of DateTime fields doesn't work property otherwise - it seems to sorts on the textual representation as opposed to proper dates.

The attached picture clearly shows what I have in mind.

How do I get Excel to see them (checkboxed) as either "Date" (for date columns/cells) or "Time" (for time columns/cells)...instead of "General" ?

Barry

Spreadsheet

answered on 01 Mar 2019

4 answers

181 views

Timeline Group Expand/Collapse Animation

Is there a way to speed up, or just remove, the animation that occurs when a group of Timeline items is expanded or collapsed? For groups containing more than 10 or so items, the animation to collapse or expand those groups begins to take a significant amount of time. This issue only gets worse with more items, and we would like to fix this.

TimeLine

answered on 01 Mar 2019

1 answer

88 views

Custom GridViewGroupPanelItem content

Is it possible to customize the GridViewGroupPanelItem content so that custom controls inside the header are not visible?

Please see the attached image i took from the example project ColumnSelection, can i remove the CheckBox from the GridViewGroupPanelItem?

Kind regards,

Gian Paolo Tessitore

GridView

answered on 01 Mar 2019

23 answers

4.2K+ views

Binding RadGridView with dynamic column.

Hi, I am developing a WPF Application using MVVM pattern. I m attaching the final output which is required named "Final output required.jpg" and also what I am currently getting named "GridView xaml.png".

I need to display data in a grid where the columns are dynamic. So in order to achieve that I had created two classes, one named rows and other one columns. Finally I bind the collection containing rows with the GridView. My code sample is as follows:

//Observable property to bind with

public ObservableCollection<Row> GridRows

{

get

{ return _gridRows; }

set

{

_gridRows = value;

RaisePropertyChanged(() => GridRows);

}

//Rad Grid

public class Grid

{

public Grid(){

Rows = new List<Row>();

}

//contains mutiple row

public List<Row> Rows { get; set; }

}

// RadGrid Row

public class Row

{

public Row()

{

Columns = new List<Column>();

}

// Row Name

public string RowName { get; set; }

//each row contains multiple columns

public List<Column> Columns{ get;set;}

}

//Rad Grid Column

public class Column {

public string ColumnName {get;set;}

public int Value { get; set; }

}

public void LoadData()

{

Grid table = new Grid();

for (int i = 1; i < 11; i++)

{

Row row = new Row();

row.RowName = "Row_" + i;

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

{

Column Column = new Column

{

ColumnName = "Row_" + i + "Col_" + j,

Value = i + j

};

row.Columns.Add(Column);

}

table.Rows.Add(row);

}

GridRows = new ObservableCollection<Row>(table.Rows);

}

The View for this is as follows:

<telerik:RadGridView Name="GridView"

CanUserReorderColumns="False"

CanUserSortColumns="False"

ItemsSource="{Binding GridRows}"

GridLinesVisibility="Both"

AutoGenerateColumns="True"

>

<telerik:RadGridView.Columns >

<telerik:GridViewColumn Header = "{Binding Name}" >

<telerik:GridViewColumn.CellTemplate>

<DataTemplate>

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

</DataTemplate >

</telerik:GridViewColumn.CellTemplate>

</telerik:GridViewColumn >

</telerik:RadGridView.Columns>

</telerik:RadGridView>

Basically what my requirement is to create dynamic columns as per the Collection of column in Rows. . I tried but it's showing Collection in column.

Also i want to inline editing for columns that why using the GridView. Please check the required output and suggest if there is any other i can use .

Please response soon as i'm in rush .Also let me know if anything not clear.

Thanks

GridView

answered on 01 Mar 2019