Questions on UI for WPF Forum

3 answers

377 views

Hi,

I have a little problem. I put RadPanel in application based on Visual Studio theme with the following code.

Unfortunately, scroll does not work properly as you can see on the screenshots. Any ideas how I can fix it?

PanelBar

answered on 11 Nov 2016

5 answers

187 views

Resize capabilities to RadPanelBarItems

Is it possible to allow users at runtime to resize a RadPanelBarItem? For example, if I have 4 RadPanelBarItems (see the WPF Controls Example) and I have ExpandMode set to multiple, I would like to allow my users to change the height of each expanded RadPanelBarItem. Maybe have a grip control between each RadPanelBarItem such what is shown in a WPF Grid when using the WPF GridSplitter control...

PanelBar

answered on 03 Oct 2016

1 answer

113 views

PanelBarItem not showing expand/collapse icon on second level

Can anyone tell me how to get the second level items to behave like the first level items? I would expect any level that has children to show an expander. In my example, the Send Items header should have an expander icon.

PanelBar

answered on 17 Aug 2016

1 answer

113 views

Applying VisualStudio2013_Dark Theme to PanelBar

Hi all,

I have successfully applied the VisualStudio2013 theme to the panelBar using implicit styling. However, I am still unable to figure out how to apply the VisualStudio2013_Dark Theme. Can anyone help me with this?

I have attached the sample program I used to try on.

<Application x:Class="MapSetUp.App"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

StartupUri="MainWindow.xaml">

<Application.Resources>

<ResourceDictionary>

<ResourceDictionary.MergedDictionaries>

<ResourceDictionary Source="Themes/Telerik.Windows.Controls.xaml"/>

<ResourceDictionary Source="Themes/Telerik.Windows.Controls.Navigation.xaml"/>

</ResourceDictionary.MergedDictionaries>

</ResourceDictionary>

</Application.Resources>

</Application>

<UserControl x:Class="Telerik.Windows.Examples.PanelBar.FirstLook.Example"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:interactions="http://schemas.microsoft.com/expression/2010/interactions"

xmlns:interactivity="http://schemas.microsoft.com/expression/2010/interactivity"

xmlns:local="clr-namespace:Telerik.Windows.Examples.PanelBar.FirstLook"

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

HorizontalAlignment="Center" VerticalAlignment="Center">

<UserControl.Resources>

<local:MainPageViewModel x:Key="myViewModel" />

</UserControl.Resources>

<Grid>

<Grid x:Name="LayoutRoot" Width="766" Height="360" HorizontalAlignment="Center" VerticalAlignment="Center"

Background="White" DataContext="{StaticResource myViewModel}">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="220" />

<ColumnDefinition Width="*" />

</Grid.ColumnDefinitions>

<telerik:RadPanelBar x:Name="radPanelBar" VerticalAlignment="Stretch"

BorderBrush="#FFCBD8E8" BorderThickness="1 1 0 1"

SelectedItem="{Binding SelectedCategory, Mode=TwoWay}"

SelectionChanged="radPanelBar_SelectionChanged">

<telerik:RadPanelBarItem IsExpanded="True">

<telerik:RadPanelBarItem.Header>

<TextBlock Text="Academic Staff" Margin="5 3" />

</telerik:RadPanelBarItem.Header>

<ListBox ItemsSource="{Binding Employees}" BorderThickness="0" BorderBrush="Transparent"

SelectedItem="{Binding SelectedEmployee, Mode=TwoWay}">

<ListBox.ItemTemplate>

<DataTemplate>

<StackPanel VerticalAlignment="Center" Orientation="Horizontal">

<Border Margin="10 5 15 5" BorderBrush="#FFA1A1A1"

BorderThickness="1">

<Image Source="{Binding SmallImagePath}" Stretch="None" />

</Border>

<TextBlock VerticalAlignment="Center" FontFamily="Segoe UI"

Text="{Binding Name}" />

</StackPanel>

</DataTemplate>

</ListBox.ItemTemplate>

</ListBox>

</telerik:RadPanelBarItem>

<telerik:RadPanelBarItem>

<telerik:RadPanelBarItem.Header>

<TextBlock Text="Programs" Margin="5 3" />

</telerik:RadPanelBarItem.Header>

<ListBox ItemsSource="{Binding WeekDays}" BorderThickness="0" BorderBrush="Transparent">

<ListBox.ItemTemplate>

<DataTemplate>

<CheckBox Margin="10 5 5 5"

Command="{Binding DayCheckedCommand, Source={StaticResource myViewModel}}"

Content="{Binding Header}"

IsChecked="{Binding IsChecked, Mode=TwoWay}" />

</DataTemplate>

</ListBox.ItemTemplate>

</ListBox>

</telerik:RadPanelBarItem>

<telerik:RadPanelBarItem >

<telerik:RadPanelBarItem.Header>

<TextBlock Text="Selected Publications" Margin="5 3" />

</telerik:RadPanelBarItem.Header>

<ListBox ItemsSource="{Binding PublicationPeriods}" BorderThickness="0" BorderBrush="Transparent">

<ListBox.ItemTemplate>

<DataTemplate>

<CheckBox Margin="10 5 5 5"

Command="{Binding PublicationCheckedCommand, Source={StaticResource myViewModel}}"

Content="{Binding Header}"

IsChecked="{Binding IsChecked, Mode=TwoWay}" />

</DataTemplate>

</ListBox.ItemTemplate>

</ListBox>

</telerik:RadPanelBarItem>

<telerik:RadPanelBarItem>

<telerik:RadPanelBarItem.Header>

<TextBlock Text="Contact Information" Margin="5 3" />

</telerik:RadPanelBarItem.Header>

</telerik:RadPanelBarItem>

</telerik:RadPanelBar>

<Border Grid.Column="1" BorderBrush="#FFCBD8E8"

BorderThickness="1">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="Auto" />

</Grid.RowDefinitions>

<Border Margin="10" Background="#FFF9F9F9">

<Grid Margin="15 10" DataContext="{Binding SelectedEmployee}">

<Grid.RowDefinitions>

<RowDefinition Height="Auto" />

</Grid.RowDefinitions>

<Grid Margin="0 0 0 5">

<TextBlock HorizontalAlignment="Left" VerticalAlignment="Center"

FontFamily="Segoe UI" FontSize="16" FontWeight="Bold"

Foreground="#FF1E395B" Text="{Binding Department}" />

<Image HorizontalAlignment="Right"

Source="Images/PanelBar/Printer.png" Stretch="None" />

</Grid>

<Border Height="1" VerticalAlignment="Bottom" Background="#FFA0AFC3">

<Border.OpacityMask>

<LinearGradientBrush StartPoint="0,1" EndPoint="1,0">

<GradientStop Offset="1" />

<GradientStop Offset="0.5" Color="White" />

</LinearGradientBrush>

</Border.OpacityMask>

</Border>

<Grid Grid.Row="1" Margin="0 10 0 0">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto" />

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

<RowDefinition Height="Auto" />

</Grid.RowDefinitions>

<Border Grid.RowSpan="3" Margin="10 5 15 5" BorderBrush="#FFA1A1A1"

BorderThickness="1">

<Image Source="{Binding LargeImagePath}" Stretch="None" />

</Border>

<TextBlock Grid.Column="1" Margin="10 3 20 10"

HorizontalAlignment="Left" FontFamily="Segoe UI"

Text="Name:" TextAlignment="Right" />

<TextBlock Grid.Column="2" HorizontalAlignment="Left"

FontFamily="Segoe UI" FontSize="16" Foreground="#FF1E395B"

Text="{Binding Name}" />

<TextBlock Grid.Row="1" Grid.Column="1" Margin="10 3 20 10"

HorizontalAlignment="Left" FontFamily="Segoe UI"

Text="Position:" TextAlignment="Right" />

<StackPanel Grid.Row="1" Grid.Column="2" Margin="0 0 0 10">

<TextBlock HorizontalAlignment="Left" FontFamily="Segoe UI"

FontSize="13.333" FontWeight="Bold"

Foreground="#FF4C607A" Text="{Binding Position}" />

<TextBlock Width="309" Margin="0 10 0 0"

HorizontalAlignment="Left" FontFamily="Segoe UI"

FontSize="12" Text="{Binding PositionAdditionalInfo}"

TextWrapping="Wrap" />

</StackPanel>

<TextBlock Grid.Row="2" Grid.Column="1" Margin="10 2 20 0"

HorizontalAlignment="Left" FontFamily="Segoe UI"

Text="Office:" TextAlignment="Right" />

<TextBlock Grid.Row="2" Grid.Column="2" Width="309"

HorizontalAlignment="Left" FontFamily="Segoe UI"

FontSize="12" Text="{Binding Office}" TextWrapping="Wrap" />

</Grid>

</Border>

<StackPanel Grid.Row="1" Margin="25 10">

<TextBlock Margin="0 0 0 10" HorizontalAlignment="Left"

FontFamily="Segoe UI" FontSize="13" FontWeight="Bold"

Foreground="#FF1E395B" Text="{Binding AdditionalInfoType}" />

<TextBlock FontFamily="Segoe UI" Text="{Binding AdditionalInfo}"

TextWrapping="Wrap" />

</StackPanel>

</Grid>

</Border>

</Grid>

<!--<telerikQuickStart:QuickStart.ConfigurationPanel>

<StackPanel Margin="3">

<RadioButton Margin="0 2" Checked="OnRadioButtonClick" Content="Single ExpandMode"

IsChecked="true" Unchecked="OnRadioButtonClick" />

<RadioButton Margin="0 2" Content="Multiple ExpandMode" />

</StackPanel>

</telerikQuickStart:QuickStart.ConfigurationPanel>-->

</UserControl>

Regards,

Vincent

PanelBar

answered on 25 Apr 2016

1 answer

188 views

SelectionMode = None

Hi,

can I use PanelBar as a simple container without selection options?

I want use it as a navigator control that help to organize informations and inputs.

Is possible to disable background changes on mouse over, selections...?

Thank's,

marc.

PanelBar

answered on 10 Apr 2016

2 answers

106 views

How to bind RadPanelBar to View with graphics in WPF MVVM application.

I have an WPF MVVM Catel project with five Views: View_1, View_2, View_3, View_4 and View_5. Each View is implemented as catel:UserControl and has appropriate Model and ViewModel. There is a telerik:RadCartesianChart presenting diagram changing in real time in each View. There is also a catel:Window in my application that is the application main window. There is RadPanelBar in the application main window XAML. This RadPanelBar has five instances of telerik:RadPanelBarItem in XAML. I'm in need of binding of each telerik:RadPanelBarItem to appropriate View. For example: first RadPanelBarItem to View_1, the second one to View_2 e.t.c. Please give me a reference to example of that binding. Thank you very much in advance.

PanelBar

answered on 28 Mar 2016

4 answers

254 views

Using C#.NET WebBrowser on page with RadPanelBar

I’m trying to do something similar to Automation. I need to drive a Web App containing Telerik controls. Specifically, I need to click (which activates functionality) on elements of a RadPanelBar. The RadPanelBar has two levels. The top level has four siblings, each of which has about a dozen sub items.

I am using a Win Form application running a WebBrowser control. This hosts the page pointing to the Telerick based web page containing the RadPanelBar. I can successfully programmatically “Click” the top level item. I first find the HtmlElement from its text property as shown on the working Telerik application. I then simply use the element.InvokeMember(“click”) method. This successfully expands the list of sub items on the page. Doing the same on the sub elements successfully finds the HtmlElement, but the InvokeMember(“click”) method does nothing. It does not give an error nor does it activate the code behind associated with the element.

I’ve looked at the underlying Dom for the page and have done Google searches using key words found in the actual html generated by the RadPanelBar in conjunction with keywords WebBrowser and InvokeMember. All to no avail.

I am hoping someone with underlying knowledge of the RadPanelBar can suggest reasons why it works on the first tier, but not the second and hopefully points me in the right direction.

Thanks for any help you can provide.

PanelBar

answered on 04 Feb 2016

1 answer

46 views

PanelBar Item Injection Broke

Hi there,

I just performed an upgrade from 2014 Q4 to 2015 Q1 and have run into an unexpected issue. I have been using Panel Bar Item injection via the prism framework to place panel bar items for each of my modules under their respective headers.

In my shell, the regions are laid out as follows:

<telerik:RadPanelBar

DockPanel.Dock="Left"

Width="200"

regions:RegionManager.RegionName="NavPanelRegion"

Background="LightBlue">

<telerik:RadPanelBarItem

regions:RegionManager.RegionName="NavPanelHomeRegion"

Header="Home">

</telerik:RadPanelBarItem>

<telerik:RadPanelBarItem

regions:RegionManager.RegionName="NavPanelToolsRegion"

Header="Tools">

</telerik:RadPanelBarItem>

<telerik:RadPanelBarItem

regions:RegionManager.RegionName="NavPanelMaintenanceRegion"

Header="Maintenance">

</telerik:RadPanelBarItem>

<telerik:RadPanelBarItem

regions:RegionManager.RegionName="NavPanelReportingRegion"

Header="Reporting">

</telerik:RadPanelBarItem>

</telerik:RadPanelBar>

Then each of the modules has one to many panel bar items defined:

<telerik:RadPanelBarItem x:Class="Modules.Dashboard.Views.DashboardPanelItemView"

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:regions="http://www.codeplex.com/CompositeWPF"

xmlns:vm="clr-namespace:Modules.Dashboard.ViewModels"

Header="Homepage">

<telerik:RadPanelBarItem.Resources>

<vm:DashboardCommandViewModel x:Key="DashboardCommandVm" />

</telerik:RadPanelBarItem.Resources>

<telerik:RadPanelBarItem.Command>

<Binding Source="{StaticResource DashboardCommandVm}" Path="Home" />

</telerik:RadPanelBarItem.Command>

</telerik:RadPanelBarItem>

And during module initalization, the following is called:

public void Initialize()

{

Container.RegisterType<Object, Views.DashboardView>("DashboardView");

this._regionViewRegistry.RegisterViewWithRegion(RegionNames.Navigation.HomeNavigationPanelRegion, typeof(Views.DashboardPanelItemView));

this._regionViewRegistry.RegisterViewWithRegion("ContentRegion", typeof(DashboardView));

}

Prior to the update, this worked just fine and the panel bar items were injected under their respective parents. Now, though, post-upgrade, it's no longer functioning.

Any thoughts?

PanelBar

answered on 05 Mar 2015

1 answer

102 views

Build a custom configuration widget

I am using a radPanelBar like the one here:

http://demos.telerik.com/aspnet-ajax/panelbar/examples/functionality/simple/defaultcs.aspx

I am using it to display an RSS feed coming from another website. I have 3 tabs to display 3 different feeds.

What I need to do now is to make custom configuration for the non programmer back end sitefinity user where they can go and select which tab from this PanelBar widget they want to display.

How do I go about building this?

PanelBar

answered on 21 Jan 2015

6 answers

226 views

RadPanelBar

I would like to change custom style for RadpanelBar to display the arrow on the left instead of on the right side.
How can I customize it? Also, when the row is expanded, the arrow will display differently.

PanelBar

answered on 19 Dec 2014