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

Border and background on Expander when focus the control

9 Answers 455 Views
Expander
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Hans
Top achievements
Rank 1
Hans asked on 15 Apr 2011, 10:42 AM
Hi Telerik,

We implemented your Expander control but when we click with the mouse on the Expander control itself, like border or body, it will create a blue border and blue background. See image attached.

We tried to remove all borders and focusvisual styles but without luck.

Can you please help?

Thanks.

9 Answers, 1 is accepted

Sort by
0
Tina Stancheva
Telerik team
answered on 19 Apr 2011, 06:29 PM
Hi Hans,

I am not sure which border you need to remove but if you are referring to the focus visual border around the Expander header, you need to edit the ControlTemplate of the HeaderButton element of the control. I attached a sample project to illustrate this suggestion. Can you please have a look at it and let me know if this is what you had in mind?

Also, if you have defined a custom style for the control and you need to further customize it, it would be best to send us a small working project illustrating your scenario and we will examine it and implement the requested changes.

Best wishes,
Tina Stancheva
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Hans
Top achievements
Rank 1
answered on 19 Apr 2011, 09:55 PM
Hi,

Have you seen the image? Where do you see a border around the header? There is no border at all.
The blue border and the white background is on the full expander control.

I tried to implement your suggestion but as I already expected this is not working.

Please see attached a new image which will show a focussed and unfocused expander.
The problem is also that it will not leave the unfocused state when clicking on the Grid?

We removed all focussed states, etc. but it does not solve the issue.
0
Tina Stancheva
Telerik team
answered on 20 Apr 2011, 09:32 AM
Hi Hans,

Thank you for getting back to us and the clarification. I examined both pictures you sent and I was wondering whether you apply a custom theme or style to the control. Basically the Border around the control is controlled by the BorderThickness and BorderBrush properties of the control? Are those set in your case?

Unfortunately I cannot reproduce the scenario you described - "when we click with the mouse on the Expander control itself, like border or body, it will create a blue border and blue background". This is why I wanted to ask you whether you can send us a sample reproducing the issue so that we can look into it. Any styles/themes applied to the control might be causing this behavior, so if you can send them as well, that would greatly help us find the cause for your issue.

Thank you in advance for your cooperation.

All the best,
Tina Stancheva
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Hans
Top achievements
Rank 1
answered on 20 Apr 2011, 03:34 PM
Hi Telerik,

I solved this issue. It was not in the Expander but in a parent control of the Expander. Sorry for the inconvenience.

Now I have a same issue on an ItemsControl. See attached border. It does not have a style, only the itemspanel has a template. See XAML:

<Grid x:Name="LayoutRoot">
        <Grid Height="Auto">
            <Grid.RowDefinitions>
                <RowDefinition Height="72" />
                <RowDefinition Height="40" />
            </Grid.RowDefinitions>
            <TextBlock x:Name="tbMessage"
                       Text="{Binding Header}"
                       TextWrapping="Wrap"
                       Margin="10,0,10,10"/>
            <telerik:ItemsControl x:Name="ButtonList" Grid.Row="1"
                                  ItemsPanel="{StaticResource ItemsPanelTemplate}"
                                  ItemsSource="{Binding Buttons}">
                <telerik:ItemsControl.ItemTemplate >
                    <DataTemplate>
                        <Button Width="100"
                                Height="30"
                                Margin="10,0,0,0"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Top"
                                Click="Button_Click"
                                Content="{Binding Caption}"
                                ContentTemplate="{StaticResource MessageBoxButtonDataTemplate}"
                                Style="{StaticResource GreenPopupButton}" />
                    </DataTemplate>
                </telerik:ItemsControl.ItemTemplate>
            </telerik:ItemsControl>
        </Grid>
    </Grid>

I tried to search our full solution on the color of that line (#FFBD69) but cannot find it??

How can we disable this line?

Thanks.
0
Petar Mladenov
Telerik team
answered on 26 Apr 2011, 07:29 AM
Hi Hans,

From the code snippet you have sent, we are unable to detect where this border comes from. Could you please open a support ticket so that you will be able to send a file? A runnable sample will be highly appreciated and this we could provide with a better advice. Thank you for your cooperation.

All the best,
Petar Mladenov
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Hans
Top achievements
Rank 1
answered on 02 May 2011, 10:52 AM
Dear Telerik,

We really cannot build an example application for every issue we have.
We now solved it by replacing your ItemsControl by the default Silverlight ItemsControl.

Hans
0
Tina Stancheva
Telerik team
answered on 03 May 2011, 09:22 AM
Hi Hans,

I see your point. We ask for samples since it is sometimes hard to investigate each case when we are not aware of the scenario in which our controls are used.

However, we investigated further your case and the Border you need to remove is a part of the Telerik ItemsControl ControlTemplate. It defines a FocusVisualElement, which is a Border that is displayed when the ItemsControl is focuses. However, if you remove the FocusStates VisualStates from the control's Template, the border will be removed.

I attached a sample project, if you decide to go back to the Telerik's ItemsControl. I am sorry for the inconvenience.

Regards,
Tina Stancheva
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Ashley
Top achievements
Rank 1
answered on 02 Oct 2012, 04:14 PM
Hello Telerik Support,
I am getting the same issue. I don't understand your solution; are you suggesting I take the source for your controls, change it, build it and then use that in my project? Just to get rid of this inherited style? BTW I cannot see into your solution; I downloaded it, unpacked it and it wouldn't load in Visual Studio.
Regards,
Ashley

0
Tina Stancheva
Telerik team
answered on 05 Oct 2012, 03:15 PM
Hi Ashley,

My suggestion is to edit the default ControlTemplate of the ItemsControl to remove the focused visual state. In order to do that, you don't need to use our source, but instead use ExpressionBlend to get the template as described here.

Also, you're right there is an issue with the sample solution so I reattached it. Please give it a try and let me know if it helps.

Regards,
Tina Stancheva
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Tags
Expander
Asked by
Hans
Top achievements
Rank 1
Answers by
Tina Stancheva
Telerik team
Hans
Top achievements
Rank 1
Petar Mladenov
Telerik team
Ashley
Top achievements
Rank 1
Share this question
or