tooltip doesn't display on selected combobox item.

3 posts, 0 answers
  1. Ravi
    Ravi avatar
    97 posts
    Member since:
    Jun 2012

    Posted 03 Jun 2013 Link to this post

    Hi There,

    I have created a style which will display a textblock in place of content control and i have to display a tooltip when user mouseover on selected item. unfortunately i am unable to see the tool tip even thought i set it. please see the below template for RadCombobox.
    Please let me know how i can do this.

    <ControlTemplate x:Key="NonEditableComboBox" TargetType="telerikInput:RadComboBox">
          <Grid x:Name="VisualRoot">
              <VisualStateManager.VisualStateGroups>
                  <VisualStateGroup x:Name="CommonStates">
                      <VisualState x:Name="Disabled">
                          <Storyboard>
                              <DoubleAnimationUsingKeyFrames Storyboard.TargetName="PART_DropDownButton" Storyboard.TargetProperty="Opacity">
                                  <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value=".5" />
                              </DoubleAnimationUsingKeyFrames>
                          </Storyboard>
                      </VisualState>
                      <VisualState x:Name="Normal">
                      </VisualState>
                      <VisualState x:Name="MouseOver">
                          <Storyboard>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundBorder" Storyboard.TargetProperty="Background">
                                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource HoverBackground}" />
                              </ObjectAnimationUsingKeyFrames>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">
                                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_MouseOver}" />
                              </ObjectAnimationUsingKeyFrames>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">
                                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_MouseOver}" />
                              </ObjectAnimationUsingKeyFrames>
                          </Storyboard>
                      </VisualState>
                      <VisualState x:Name="DropDownOpen">
                          <Storyboard>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundBorder" Storyboard.TargetProperty="Background">
                                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource DropDownOpenBackground}" />
                              </ObjectAnimationUsingKeyFrames>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">
                                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_Pressed}" />
                              </ObjectAnimationUsingKeyFrames>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">
                                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_Pressed}" />
                              </ObjectAnimationUsingKeyFrames>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusBorder" Storyboard.TargetProperty="Visibility">
                                  <DiscreteObjectKeyFrame KeyTime="0">
                                      <DiscreteObjectKeyFrame.Value>
                                          <Visibility>Collapsed</Visibility>
                                      </DiscreteObjectKeyFrame.Value>
                                  </DiscreteObjectKeyFrame>
                              </ObjectAnimationUsingKeyFrames>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PopupFakeBorder"
                                      Storyboard.TargetProperty="Visibility">
                                  <DiscreteObjectKeyFrame KeyTime="0">
                                      <DiscreteObjectKeyFrame.Value>
                                          <Visibility>Visible</Visibility>
                                      </DiscreteObjectKeyFrame.Value>
                                  </DiscreteObjectKeyFrame>
                              </ObjectAnimationUsingKeyFrames>
                          </Storyboard>
                      </VisualState>
                  </VisualStateGroup>
                  <VisualStateGroup x:Name="FocusStates">
                      <VisualState x:Name="Focused">
                          <Storyboard>
                              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusBorder" Storyboard.TargetProperty="Visibility">
                                  <DiscreteObjectKeyFrame KeyTime="0">
                                      <DiscreteObjectKeyFrame.Value>
                                          <Visibility>Visible</Visibility>
                                      </DiscreteObjectKeyFrame.Value>
                                  </DiscreteObjectKeyFrame>
                              </ObjectAnimationUsingKeyFrames>
                          </Storyboard>
                      </VisualState>
                      <VisualState x:Name="Unfocused" />
                  </VisualStateGroup>
              </VisualStateManager.VisualStateGroups>
              <Border x:Name="PopupFakeBorder" Visibility="Collapsed" BorderThickness="1,0,1,0" CornerRadius="5,5,0,0"
                      Grid.ColumnSpan="2" Background="{StaticResource PickerPopupBackground_fake}"
                      BorderBrush="{TemplateBinding BorderBrush}" />
              <Border IsHitTestVisible="False" Background="{TemplateBinding Background}" CornerRadius="5" />
              <telerik:RadToggleButton x:Name="PART_DropDownButton" Foreground="{TemplateBinding Foreground}" IsTabStop="False" Margin="0" Padding="0" ClickMode="Press">
                  <telerik:RadToggleButton.Template>
                      <ControlTemplate TargetType="telerik:RadToggleButton">
                          <ContentPresenter />
                      </ControlTemplate>
                  </telerik:RadToggleButton.Template>
                  <Grid>
                      <Grid.ColumnDefinitions>
                          <ColumnDefinition Width="*" />
                          <ColumnDefinition Width="36" />
                      </Grid.ColumnDefinitions>
                      <Border x:Name="BackgroundBorder"
                              CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"
                              Grid.ColumnSpan="2"
                              BorderBrush="{StaticResource Control_OuterBorderBrush}" BorderThickness="1" Background="{StaticResource DefaultBackground}" />
                      <ContentControl x:Name="DropDownIcon"
                                      Grid.Column="1"
                                      IsTabStop="False"
                                      Foreground="{StaticResource ButtonIconForeground_Normal}"
                                      Background="{StaticResource ButtonIconBackground_Normal}"
                                      Template="{StaticResource ArrowTemplateNonEditableCombobox}" />
                      <TextBlock x:Name="Content"
                                 FontFamily="Segoe UI"
                                 IsHitTestVisible="False"
                                 Grid.Column="0"
                                 Foreground="{TemplateBinding Foreground}"
                                 HorizontalAlignment="Left"
                                 Margin="{TemplateBinding Padding}"
                                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                 Text="{TemplateBinding SelectionBoxItem}"
                                 TextTrimming="CharacterEllipsis"
                                ToolTip="{TemplateBinding  SelectionBoxItem}">
                  
                      </TextBlock>
                      <!--<ContentPresenter x:Name="Content"
                                        Grid.Column="0"
                                        Margin="{TemplateBinding Padding}"
                                        IsHitTestVisible="False"
                                        Content="{TemplateBinding SelectionBoxItem}"
                                        ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                                        TextBlock.Foreground="Black"
                                        HorizontalAlignment="Left"
                                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />-->
                      <Border x:Name="FocusBorder"
                              BorderThickness="1"
                              Margin="1"
                              Visibility="Collapsed"
                              BorderBrush="{StaticResource Control_FocusBorderBrush}" Grid.ColumnSpan="2" CornerRadius="3" />
                  </Grid>
              </telerik:RadToggleButton>
              <Popup x:Name="PART_Popup">
                  <Grid x:Name="PopupRoot">
                      <Border BorderThickness="{TemplateBinding BorderThickness}" Margin="0,-10,0,0" Padding="0,10,0,0" BorderBrush="{TemplateBinding BorderBrush}" MinWidth="{TemplateBinding MinDropDownWidth}" MaxHeight="{TemplateBinding MaxDropDownHeight}" Background="{StaticResource PickerPopupBackground}" CornerRadius="0 0 5 5">
                          <Grid>
                              <Grid.RowDefinitions>
                                  <RowDefinition Height="Auto" />
                                  <RowDefinition Height="*" />
                              </Grid.RowDefinitions>
                              <telerik:RadButton x:Name="PART_ClearButton" Grid.Row="0" Margin="-1 -1 -1 0" Visibility="{TemplateBinding ClearSelectionButtonVisibility}" Content="{TemplateBinding ClearSelectionButtonContent}" />
                              <ScrollViewer x:Name="PART_ScrollViewer" Grid.Row="1" Foreground="{TemplateBinding Foreground}" Padding="0 1 0 0" BorderThickness="0" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
                                  <ItemsPresenter />
                              </ScrollViewer>
                          </Grid>
                      </Border>
                  </Grid>
              </Popup>
          </Grid>
      </ControlTemplate>

    Regards,
    Srinivas.
  2. Konstantina
    Admin
    Konstantina avatar
    2332 posts

    Posted 05 Jun 2013 Link to this post

    Hello,

    You could set instead the ItemTemplate of RadComboBox:

    <telerik:RadComboBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding DisplayText}">
                            <TextBlock.ToolTip>
                                <TextBlock Text="{Binding DisplayText}"/>
                            </TextBlock.ToolTip>
                        </TextBlock>
                    </DataTemplate>
                </telerik:RadComboBox.ItemTemplate>

    The DisplayText is the property to which the ComboBox is bound.
    I guess that is easier than changing the whole template.

    Could you please give it a try and let me know if that worked for you.

    Regards,
    Konstantina
    Telerik

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. UI for WPF is Visual Studio 2017 Ready
  4. Ravi
    Ravi avatar
    97 posts
    Member since:
    Jun 2012

    Posted 05 Jun 2013 Link to this post

    Hi Konstantina,

    Thanks for help, its working now.

    Regards,
    Srinivas.

Back to Top