This is a migrated thread and some comments may be shown as answers.

DropDownContent closes every time

4 Answers 241 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

Pov Ser asked on 21 May 2014, 09:35 AM

I'm using DropDownButton in TabControl TabItem header with UserControl as DropDownContent.
When DropDown opens and i'm clicking on UserControl elements for example trying to resize OutlookBar or clicking other elements - DropDown always closes.
This problem does not show itself when using DropDownButton on clear Form as usual, but not when in TabItem header as Style.
Also i have Rotation problems. You can see that UserControl in upper ToggleButton is rotated like a crazy.

Here is Window xaml:

<Window

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" x:Class="MainWindow"

xmlns:me="clr-namespace:WpfApplication1"

Title="MainWindow" Height="350" Width="525">

<Window.Resources>

<Style x:Key="ClosableStyle" TargetType="telerik:RadTabItem">

<Setter Property="HeaderTemplate">

<Setter.Value>

<DataTemplate>

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="*" />

<ColumnDefinition Width="Auto" />

</Grid.ColumnDefinitions>

<TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content, Mode=TwoWay}" Grid.Column="0"></TextBlock>

<telerik:RadDropDownButton Width="30" Height="30" x:Name="MachinesKnopka3" Margin="5,0,0,0" DropDownButtonPosition="Right" DropDownIndicatorVisibility="Visible" DropDownPlacement="Right" DropDownHeight="600" DropDownWidth="800" Grid.Column="1" Padding="0" ClickMode="Release" IsOpen="False">

<telerik:RadDropDownButton.LayoutTransform>

<RotateTransform Angle="-90"/>

</telerik:RadDropDownButton.LayoutTransform>

<telerik:RadDropDownButton.DropDownContent>

<me:UserControl1></me:UserControl1>

</telerik:RadDropDownButton.DropDownContent>

</telerik:RadDropDownButton>

</Grid>

</DataTemplate>

</Setter.Value>

</Setter>

</Style>

</Window.Resources>

<Grid>

<telerik:RadTabControl ItemContainerStyle="{StaticResource ClosableStyle}" TabOrientation="Horizontal" TabStripPlacement="Left" FlowDirection="LeftToRight" Align="Right" Grid.Row="1" DropDownDisplayMode="Visible" telerik:StyleManager.Theme="Vista" AllowDragReorder="True">

<telerik:RadTabControl.Background>

<LinearGradientBrush EndPoint="0.504,1.5" StartPoint="0.504,0.03">

<GradientStop Color="#FFB7B7B7" Offset="0"/>

<GradientStop Color="#FFFFFFFF" Offset="0.567"/>

</LinearGradientBrush>

</telerik:RadTabControl.Background>

<telerik:RadTabItem Header="Tab1"/>

<telerik:RadTabItem Header="Tab2"/>

</telerik:RadTabControl>

</Grid>

</Window>

Here is UserControl:

<UserControl x:Class="UserControl1"

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

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

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

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

mc:Ignorable="d"

d:DesignHeight="300" d:DesignWidth="300">

<Grid>

<Grid VerticalAlignment="Stretch" Grid.Row="1">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="*"/>

</Grid.ColumnDefinitions>

<telerik:RadOutlookBar HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="0">

<telerik:RadOutlookBarItem Header="Online Games">

<TextBlock>BattleField IV</TextBlock>

</telerik:RadOutlookBarItem>

<telerik:RadOutlookBarItem Header="Social Network">

<TextBlock>FaceBook</TextBlock>

</telerik:RadOutlookBarItem>

</telerik:RadOutlookBar>

<TextBox Grid.Column="1">Text1</TextBox>

</Grid>

</UserControl>

4 Answers, 1 is accepted

answered on 23 May 2014, 11:16 AM

Hi Pov,

Thank you for the code snippet provided.

Let me get straight to your questions:
1. You can set the KeepOpen property of the RadDropDownButton to "true", so the dropdown content will remain open until the user click again the button to close it.

2. The issue with the TabStripPlacement is already logged in our feedback portal, where you can track its progress.Please have in mind that your vote is important for us. Based on the total amount of votes we will prioritise the items in our portal.

Also, I noticed that you are setting the Vista theme using our StyleManager.

Please note that we strongly suggest to use our Implicit Styles in combination with our NoXaml binaries. You can find more information on that matter in our Setting a Theme article.

I hope this information will help you and don't hesitate to write back if you have more questions.

Regards,
Milena
Telerik

Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.

answered on 27 May 2014, 01:07 PM

Hi Pov,

I noticed that the AllowDragReorder property of the RadTabControl is set to true. When you start a drag operation from the header as in your case, the reordering logic of the RadTabControl is activated and this is causing the closing of the dropdown content when you try to resize the RadOutlookBar. If you don't need to reorder the tab items, you can set the property to "false" and this will solve the problem. Otherwise, please write us back and we can think of some workaround.

I'm looking forward to your reply.

Regards,
Milena
Telerik