How to hide the DropDownContent when click a button on DropDownContent?

3 posts, 1 answers
  1. Jimmy
    Jimmy avatar
    24 posts
    Member since:
    Nov 2006

    Posted 10 Aug 2011 Link to this post

    I have a RadDropDownButton and in the content of the drop down I have some RadButton.when user's mouse over the RadDropDownButton, the DropDownContent opend . I want to achieved this: when the user click the button in the content or the mouse leave the DropDownContent, the RadDropDownButton closes up (which just like a tooltip,when click or mouseleave, the popup will hide).  Is there a way to prevent this?  Sample code below:

    <telerik:RadDropDownButton x:Name="Currentfull" Margin="0,0,0,4" Style="{StaticResource OtherExamplesDropdownButtonStyle}" VerticalContentAlignment="Center" >
                                <StackPanel Orientation="Horizontal" Margin="6,0" Height="18" VerticalAlignment="Center" AutoOpenDelay="0:0:0.2">
                                    <Image Width="16" Height="16" Source="/Images/Currentfull.png" Margin="3,0" VerticalAlignment="Center" />
                                    <TextBlock VerticalAlignment="Center" Text="CurrentFull" FontSize="13"  FontFamily="Arial" Foreground="#FF3D4350" />
                                </StackPanel>
                                <telerik:RadDropDownButton.DropDownContent>
                                    <Grid x:Name="PopupRoot">
                                        <Border BorderBrush="#FFAAB9C0" BorderThickness="1" Background="#FFF4F4F4" CornerRadius="1" Padding="10,16,0,0">
                                            <Border.Effect>
                                                <DropShadowEffect BlurRadius="6" Opacity="0.4" ShadowDepth="1"/>
                                            </Border.Effect>
                                            <StackPanel Margin="0,0,10,10">
                                                <telerik:RadButton  Content="GetData" FontSize="14" Name="rb_GetData"  Style="{StaticResource OtherExampleItemButtonStyle}" Click="rb_GetData_Click" />
                                                <telerik:RadButton  Content="SaleList" FontSize="14" Name="rb_SaleList"  Style="{StaticResource OtherExampleItemButtonStyle}" Click="rb_SaleList_Click"/>                                                                                   
                                            </StackPanel>
                                        </Border>
                                        <Path Data="M7.0710683,0 L14.142137,7.0710683 L0,7.0710683 z" Fill="#FFF4F4F4" HorizontalAlignment="Left" Height="7.071" Margin="25,-6,0,0" Stretch="Fill" UseLayoutRounding="False" VerticalAlignment="Top" Width="14.142">
                                            <Path.Effect>
                                                <DropShadowEffect Direction="90" Opacity="0.4" ShadowDepth="1" BlurRadius="0"/>
                                            </Path.Effect>
                                        </Path>
                                    </Grid>
                                </telerik:RadDropDownButton.DropDownContent>
                            </telerik:RadDropDownButton>
  2. Answer
    Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 16 Aug 2011 Link to this post

    Hello Jimmy,

    The RadDropDownButton DropDownContent can be closed by setting the RadDropDownButton.IsOpen property to false. This is why in your scenario you can handle the click of the buttons displayed in the DropDownContent of the RadDropDownButton to set the IsOpen property. You can also handle the PopupRoot Grid MouseLeave event to also close the DropDownContent.
    <telerik:RadDropDownButton x:Name="Currentfull" Margin="0,0,0,4" AutoOpenDelay="0:0:0.2"
            VerticalContentAlignment="Center" HorizontalAlignment="Center" VerticalAlignment="Center">
        <StackPanel Height="18" Margin="6,0" VerticalAlignment="Center" Orientation="Horizontal">
            <Image Width="16" Height="16" Margin="3,0" VerticalAlignment="Center" />
            <TextBlock VerticalAlignment="Center" FontFamily="Arial" FontSize="13" Foreground="#FF3D4350"
                    Text="CurrentFull" />
        </StackPanel>
        <telerik:RadDropDownButton.DropDownContent>
            <Grid x:Name="PopupRoot" MouseLeave="PopupRoot_MouseLeave">
                <Border Background="#FFF4F4F4" BorderBrush="#FFAAB9C0" BorderThickness="1" CornerRadius="1"
                        Padding="10,16,0,0">
                    <Border.Effect>
                        <DropShadowEffect BlurRadius="6" Opacity="0.4" ShadowDepth="1" />
                    </Border.Effect>
                    <StackPanel Margin="0,0,10,10">
                        <telerik:RadButton Name="rb_GetData" Click="rb_GetData_Click" Content="GetData"
                                FontSize="14" />
                        <telerik:RadButton Name="rb_SaleList" Click="rb_SaleList_Click" Content="SaleList"
                                FontSize="14" />
                    </StackPanel>
                </Border>
                <Path Width="14.142" Height="7.071" Margin="25,-6,0,0" HorizontalAlignment="Left"
                        VerticalAlignment="Top" Data="M7.0710683,0 L14.142137,7.0710683 L0,7.0710683 z"
                        Fill="#FFF4F4F4" Stretch="Fill" UseLayoutRounding="False">
                    <Path.Effect>
                        <DropShadowEffect BlurRadius="0" Direction="90" Opacity="0.4" ShadowDepth="1" />
                    </Path.Effect>
                </Path>
            </Grid>
        </telerik:RadDropDownButton.DropDownContent>
    </telerik:RadDropDownButton>


    private void rb_GetData_Click(object sender, RoutedEventArgs e)
    {
        Currentfull.IsOpen = false;
    }
     
    private void rb_SaleList_Click(object sender, RoutedEventArgs e)
    {
        Currentfull.IsOpen = false;
    }
     
    private void PopupRoot_MouseLeave(object sender, MouseEventArgs e)
    {
        Currentfull.IsOpen = false;
    }

    Give this a try and let me know if this is what you had in mind.

    Kind regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>

  3. DevCraft banner
  4. Jimmy
    Jimmy avatar
    24 posts
    Member since:
    Nov 2006

    Posted 05 Sep 2011 Link to this post

    thank you for your help
Back to Top