DropDownContent closes every time

5 posts, 0 answers
  1. Pov Ser
    Pov Ser avatar
    7 posts
    Member since:
    Nov 2009

    Posted 21 May 2014 Link to this post

    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: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:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 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>
        </Grid>
    </UserControl>

  2. Milena
    Admin
    Milena avatar
    201 posts

    Posted 23 May 2014 Link to this post

    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.

    <telerik:RadTabControl ItemContainerStyle="{StaticResource ClosableStyle}" TabOrientation="Horizontal" TabStripPlacement="Left"   FlowDirection="LeftToRight" Align="Right"  Grid.Row="1" DropDownDisplayMode="Visible" telerik:StyleManager.Theme="Vista" AllowDragReorder="True">...
    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.
     
  3. UI for WPF is Visual Studio 2017 Ready
  4. Pov Ser
    Pov Ser avatar
    7 posts
    Member since:
    Nov 2009

    Posted 23 May 2014 in reply to Milena Link to this post

    Setting KeepOpen to True is not a case. Then i will need to close somehow DropDown programmatically when focus was lost in my UserControl. Overall it is not critical but very conspicuous.
  5. Milena
    Admin
    Milena avatar
    201 posts

    Posted 27 May 2014 Link to this post

    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
     
    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.
     
  6. Pov Ser
    Pov Ser avatar
    7 posts
    Member since:
    Nov 2009

    Posted 03 Jun 2014 in reply to Milena Link to this post

    Thanks. It Works.
Back to Top
UI for WPF is Visual Studio 2017 Ready