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

[Solved] how to remove the border around the cell using the style

1 Answer 273 Views

GridView

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

This question is locked. New answers and comments are not allowed.

Ravi asked on 09 May 2013, 09:06 AM

CellYellowBorder.PNG

Hi There,
I have created a style for GridView cell i am unable to change the yellow border around the cell when we are in editmode, cna you please help me to remove this?

attached a screenshot please see once.

sample style which i created suing blend.

<ControlTemplate x:Key="GridViewCellTemplate" TargetType="telerik:GridViewCell">

<Grid>

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="SelectionStates">

<VisualState x:Name="Unselected"/>

<VisualState x:Name="Selected">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="Background_Selected">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

<VisualStateGroup x:Name="CommonStates">

<VisualState x:Name="Normal"/>

<VisualState x:Name="Current">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="Background_Current">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="MouseOver">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="Background_Over">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

<VisualStateGroup x:Name="EditingStates">

<VisualState x:Name="Edited">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="PART_ContentPresenter">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Thickness>0</Thickness>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="VerticalAlignment" Storyboard.TargetName="PART_ContentPresenter">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<VerticalAlignment>Stretch</VerticalAlignment>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="PART_CellBorder">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<SolidColorBrush Color="#FFFFFFFF"/>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Display"/>

</VisualStateGroup>

<VisualStateGroup x:Name="DisabledStates">

<VisualState x:Name="Enabled"/>

<VisualState x:Name="Disabled">

<Storyboard>

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="PART_CellBorder">

<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.4"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="PART_ContentPresenter">

<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.7"/>

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="Background_Disabled">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

<VisualStateGroup x:Name="ValueStates">

<VisualState x:Name="CellValid"/>

<VisualState x:Name="CellInvalid">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="Background_Invalid">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="InvalidUnfocused">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="Background_Invalid_Unfocused">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Border x:Name="PART_CellBorder" BorderBrush="{TemplateBinding VerticalGridLinesBrush}" BorderThickness=

"{Binding VerticalGridLinesWidth, ConverterParameter=Right, Converter={StaticResource GridLineWidthToThicknessConverter}, RelativeSource={RelativeSource TemplatedParent}}"

Background="{Binding Background, RelativeSource={RelativeSource TemplatedParent}}" Margin="1 0 0 0"/>

<Border x:Name="Background_Over" BorderBrush="#FFFFC92B" Grid.ColumnSpan="2" Grid.Column="2" CornerRadius="1" Visibility="Collapsed"/>

<Border x:Name="Background_Selected" Grid.ColumnSpan="2" Grid.Column="2" CornerRadius="1" Margin="1 1 2 2" Visibility="Collapsed"/>

<Border x:Name="Background_Current" BorderBrush="{x:Null}" Grid.ColumnSpan="2" Grid.Column="2" CornerRadius="1" Margin="1 1 2 2" Visibility="Collapsed"/>

<Border x:Name="Background_Invalid" BorderBrush="#FFDB000C" BorderThickness="1" Background="White" Grid.ColumnSpan="2" Grid.Column="2" CornerRadius="1" Margin="1 1 2 2" Visibility="Collapsed">

<ToolTipService.ToolTip>

<ToolTip x:Name="validationTooltip" Content="{TemplateBinding Errors}" Placement="Right" Template="{StaticResource GridViewCell_ValidationToolTipTemplate}"/>

</ToolTipService.ToolTip>

<Grid Background="Transparent" HorizontalAlignment="Right" Height="12" Margin="1 -4 -4 0" VerticalAlignment="Top" Width="12">

<Path Data="M 1,0 L6,0 A 2,2 90 0 1 8,2 L8,7 z" Fill="#FFDB000C" Margin="1 3 0 0"/>

<Path Data="M 0,0 L2,0 L 8,6 L8,8" Fill="White" Margin="1 3 0 0"/>

</Grid>

</Border>

<Border x:Name="Background_Invalid_Unfocused" BorderBrush="#FFCE7D7D" BorderThickness="1" Grid.ColumnSpan="2" Grid.Column="2" CornerRadius="1" Margin="1 1 1 2" Opacity="1" Visibility="Collapsed">

<Border BorderThickness="1">

<Border.Background>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFCDCDC"/>

<GradientStop Color="#FFFCC1C1" Offset="1"/>

</LinearGradientBrush>

</Border.Background>

<Border.BorderBrush>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFEBF4FD"/>

<GradientStop Color="#FFDBEAFD" Offset="1"/>

</LinearGradientBrush>

</Border.BorderBrush>

</Border>

<Border x:Name="Background_Disabled" BorderBrush="#FFF8F8F8" BorderThickness="1" Background="#FFE0E0E0" Grid.ColumnSpan="2" Grid.Column="2" Margin="0 0 1 1" Visibility="Collapsed"/>

<ContentPresenter x:Name="PART_ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

</Grid>

</ControlTemplate>

<Style x:Key="GridViewCellStateLessStyle" TargetType="telerik:GridViewCell">

<Setter Property="Template" Value="{StaticResource GridViewCellTemplate}"/>

<Setter Property="Padding" Value="5 0 3 0"/>

<Setter Property="BorderBrush" Value="#FFCBCBCB"/>

<Setter Property="BorderThickness" Value="0 0 1 0"/>

<Setter Property="VerticalContentAlignment" Value="Center"/>

<Setter Property="HorizontalContentAlignment" Value="Stretch"/>

<Setter Property="Background" Value="Transparent"/>

</Style>

Regards,
Srinivas.

1 Answer, 1 is accepted

answered on 10 May 2013, 02:43 PM

Hello Srinivas,

In order to achieve your goal, I can suggest you to style the TextBox (which is the default GridViewCell's editor. Please check this forum thread where we have already discussed how to change the border's color. If you want to completely remove this border you will have to set the BorderThickness property to "0":

<Style x:Key="TextBoxStyle" TargetType="TextBox">

<Setter Property="Background" Value="{StaticResource PickerBackground_Normal}" />

<Setter Property="Foreground" Value="{StaticResource ControlForeground_Normal}" />

<Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder_Normal}" />

<Setter Property="FontStyle" Value="Normal" />

<Setter Property="FontWeight" Value="Normal" />

<Setter Property="VerticalAlignment" Value="Stretch" />

<Setter Property="BorderThickness" Value="0" />

.

I hope this information helps.

Greetings,
Yoan
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.