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

Custom style for PropertyGridField

23 Answers 408 Views

PropertyGrid

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

Hans asked on 04 Apr 2014, 02:32 PM

I am using the RadPropertyGrid in 2 different scenario's and in one of these scenario's the style needs to be different than the other scenario, but both need to be customized. I have created a custom style for the RadPropertyGrid itself, but now I need to customize the PropertyGridField as well. I can't find a way to explicitly apply a style to this control.

Usually in ItemsControls there is an ItemContainerStyle property that allows this, but I can only go as far as the RadPropertyGrid's PropertyGridPresenter, which seems to be a ContentControl instead of an ItemsControl. Also, the PropertyGridPresenter has no style so I am unsure how exactly to customize it in order to control the style of the PropertyGridField.

I am currently overriding the RadPropertyGrid in order to create a different style key to customize all occurances of this control. I hoped I could find a method that creates the PropertyGridFields, such as the ItemsControl.GetContainerForItemOverride, but to no avail.

How can I explicitly style the PropertyGridField used in a "MyPropertyGrid" derived control?

Kind regards,
Beijerinc (on behalf of Hans)

23 Answers, 1 is accepted

answered on 07 Apr 2014, 08:55 AM

Hello Beijerinc,

You may use the FieldStyle property of RadPropertyGrid, in order to explicitly set style for its PropertyGridFields, as proposed below:

<UserControl.Resources>

<Style x:Key="fieldStyle" TargetType="telerik:PropertyGridField" BasedOn="{StaticResource PropertyGridFieldStyle}">

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

</Style>

</UserControl.Resources>

<Grid>

<telerik:RadButton x:Name="b1" Content="Button"/>

<telerik:RadPropertyGrid FieldStyle="{StaticResource fieldStyle}" Item="{Binding ElementName=b1}"/>

</Grid>

Regards,
Vanya Pavlova
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

answered on 10 Apr 2014, 09:14 AM

Thank you for your response, Vanya.

I have tried setting the FieldStyle with my customized style, but now all my fields are gone. At first I thought there may be a style problem, so I tried setting the FieldStyle to the default Telerik style, but the same thing happens.

I am starting to think the FieldStyle property is not properly hooked up, especially since the PropertyGridField itself specifies PropertyGridFields in a DataTemplate for the purposes of property nesting. I don't think it is possible to persist the FieldStyle set in the RadPropertyGrid down to a PropertyGridField into this DataTemplate through code behind. As far as I know a DataTemplate is pretty much a solid barrier through which all XAML context is lost (except for static resources).

Could you perhaps provide a sample project setting the FieldStyle to a style that e.g. sets a different selection background color?

Kind regards,
Beijerinc

answered on 15 Apr 2014, 08:24 AM

Hello Beijerinc,

Are you using Expression Blend to extract PropertyGrid's style? Your problem might be related to the fact that Blend clears some of the bindings of RadPropertyGrid - ItemsSouce of the ItemsControls for example. What I could suggest is to work with the templates provided in our xaml files coming with the full installation. Please note that the styles used in our themes are theme specific. Thus, you should predefine the template of PropertyGridField against each theme. You can find it together with all the other templates used for the PropertyGrid inside "Telerik.Windows.Controls.Data.xaml" file browsing to "InstallationFolder\Silverlight\Themes.Implicit\OfficeBlack(or Office2013/ Windows8 )\Themes" folder. Also, you can check our Implicit Styles help article for a reference.

Regards,
Yoan
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

answered on 22 Apr 2014, 07:20 AM

Hello Yoan,

Actually, I pulled the style from a decompiler, because that has always been accurate in the past. I have the sources right here as well, so I decided to take a look in there, but I can't find the problem. Also, I am a little stumped by how this FieldStyle would be assigned to the fields. There are no style properties on the PropertyGridPresenter, where I would expect them seeing as how they should be persisted down to the presenter's internals. Perhaps you can take a look at my XAML?

001.<ResourceDictionary

002. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

003. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

004. xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"

005. xmlns:telerikdata="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Data"

006. xmlns:telerikchromes="clr-namespace:Telerik.Windows.Controls.Chromes;assembly=Telerik.Windows.Controls"

007. xmlns:telerikinput="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input"

008. xmlns:telerikpropertygrid="clr-namespace:Telerik.Windows.Controls.Data.PropertyGrid;assembly=Telerik.Windows.Controls.Data"

009. xmlns:phoenixrepositoryentities="clr-namespace:Optimizers.Phoenix.Framework.Repository.Entities;assembly=Optimizers.Phoenix.Framework.Web.SL.Services"

010. xmlns:wmsforms="clr-namespace:Optimizers.Phoenix.WMS.Web.SL.Controls.Forms;assembly=Optimizers.Phoenix.WMS.Web.SL.Controls"

011. xmlns:system="clr-namespace:System;assembly=mscorlib">

012.

013. <SolidColorBrush x:Key="GridView_ToggleButtonStroke" Color="Black" />

014. <SolidColorBrush x:Key="GridView_ToggleButtonForeground" Color="#FF9D9D9D" />

015. <LinearGradientBrush x:Key="GridView_ToggleButtonBorder" EndPoint="0.854,0.854" StartPoint="0.146,0.146">

016. <GradientStop Color="#FF282828" Offset="1" />

017. <GradientStop Color="#FFBFBFBF" />

018. </LinearGradientBrush>

019. <LinearGradientBrush x:Key="GridView_ToggleButtonBackground" EndPoint="0.854,0.854" StartPoint="0.146,0.146">

020. <GradientStop Color="#FFD1D1D1" Offset="1" />

021. <GradientStop Color="White" />

022. </LinearGradientBrush>

023. <SolidColorBrush x:Key="ItemOuterBorder_Selected" Color="#FFFFC92B" />

024. <SolidColorBrush x:Key="ItemInnerBorder_Selected" Color="White" />

025. <LinearGradientBrush x:Key="ItemBackground_Selected" EndPoint="0.5,1" StartPoint="0.5,0">

026. <GradientStop Color="#FFFCE79F" Offset="1" />

027. <GradientStop Color="#FFFDD3A8" />

028. </LinearGradientBrush>

029. <SolidColorBrush x:Key="ItemOuterBorder_Over" Color="#FFFFC92B" />

030. <SolidColorBrush x:Key="ItemInnerBorder_Over" Color="White" />

031. <LinearGradientBrush x:Key="ItemBackground_Over" EndPoint="0.5,1" StartPoint="0.5,0">

032. <GradientStop Color="#FFFFFBA3" Offset="1" />

033. <GradientStop Color="#FFFFFBDA" Offset="0" />

034. </LinearGradientBrush>

035. <SolidColorBrush x:Key="ControlOuterBorder" Color="#FFD2DAE4" />

036. <SolidColorBrush x:Key="ControlInnerBorder" Color="#FFFFFFFF" />

037. <SolidColorBrush x:Key="PropertyGrid_IndentCellBackground" Color="#FFE4E4E4" />

038. <SolidColorBrush x:Key="PropertyGrid_TemplatesBorderBrush" Color="#FFCBCBCB" />

039. <SolidColorBrush x:Key="ToggleButton_Indicator" Color="Black" />

040.

041. <SolidColorBrush x:Key="RadioButton_Indicator" Color="Black" />

042. <SolidColorBrush x:Key="PropertyGrid_SearchIndicator_Background" Color="#FF919191" />

043. <SolidColorBrush x:Key="PropertyGrid_DescriptionBackground" Color="Transparent" />

044. <SolidColorBrush x:Key="ControlBackground" Color="Transparent" />

045. <SolidColorBrush x:Key="ControlForeground" Color="#FF000000" />

046.

047. <telerik:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />

048. <telerikpropertygrid:FlatItemSourceConverter x:Key="FlatItemSourceConverter" />

049. <telerikpropertygrid:HeaderVisibilityConverter x:Key="HeaderVisibilityConverter" />

050. <telerikpropertygrid:GroupingItemsSourceConverter x:Key="GroupingItemsSourceConverter" />

051.

052. <DataTemplate x:Key="StringTemplate" DataType="phoenixrepositoryentities:PhoenixCustomEntity">

053. <TextBox telerikpropertygrid:AutoBindBehavior.UpdateBindingOnElementLoaded="Text" />

054. </DataTemplate>

055. <DataTemplate x:Key="BooleanTemplate" DataType="phoenixrepositoryentities:PhoenixCustomEntity">

056. <CheckBox telerikpropertygrid:AutoBindBehavior.UpdateBindingOnElementLoaded="IsChecked" />

057. </DataTemplate>

058. <DataTemplate x:Key="IntegerTemplate" DataType="phoenixrepositoryentities:PhoenixCustomEntity">

059. <telerikinput:RadNumericUpDown telerikpropertygrid:AutoBindBehavior.UpdateBindingOnElementLoaded="Value" />

060. </DataTemplate>

061. <DataTemplate x:Key="DoubleTemplate" DataType="phoenixrepositoryentities:PhoenixCustomEntity">

062. <telerikinput:RadNumericUpDown telerikpropertygrid:AutoBindBehavior.UpdateBindingOnElementLoaded="Value" />

063. </DataTemplate>

064. <DataTemplate x:Key="DateTimeOffsetTemplate" DataType="phoenixrepositoryentities:PhoenixCustomEntity">

065. <telerikinput:RadDateTimePicker telerikpropertygrid:AutoBindBehavior.UpdateBindingOnElementLoaded="SelectedValue" />

066. </DataTemplate>

067.

068. <wmsforms:CharacteristicEditorTemplateSelector x:Key="CharacteristicsEditorTemplateSelector"

069. StringTemplate="{StaticResource StringTemplate}"

070. BooleanTemplate="{StaticResource BooleanTemplate}"

071. IntegerTemplate="{StaticResource IntegerTemplate}"

072. DoubleTemplate="{StaticResource DoubleTemplate}"

073. DateTimeOffsetTemplate="{StaticResource DateTimeOffsetTemplate}" />

074.

075. <Style x:Key="PropertyGridNestedToggleButtonStyle" TargetType="telerik:RadToggleButton">

076. <Setter Property="Background" Value="{StaticResource GridView_ToggleButtonBackground}" />

077. <Setter Property="Foreground" Value="{StaticResource GridView_ToggleButtonForeground}" />

078. <Setter Property="BorderBrush" Value="{StaticResource GridView_ToggleButtonBorder}" />

079. <Setter Property="BorderThickness" Value="1" />

080. <Setter Property="HorizontalContentAlignment" Value="Center" />

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

082. <Setter Property="Padding" Value="0" />

083.

084. <Setter Property="Template">

085. <Setter.Value>

086. <ControlTemplate TargetType="telerik:RadToggleButton">

087. <Border Background="Transparent" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">

088. <VisualStateManager.VisualStateGroups>

089. <VisualStateGroup x:Name="CommonStates">

090. <VisualState x:Name="Normal" />

091. <VisualState x:Name="MouseOver" />

092. <VisualState x:Name="Disabled" />

093. </VisualStateGroup>

094. <VisualStateGroup x:Name="CheckStates">

095. <VisualState x:Name="Checked">

096. <Storyboard>

097. <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="plus" Storyboard.TargetProperty="(UIElement.Opacity)">

098. <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0" />

099. </DoubleAnimationUsingKeyFrames>

100. <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="minus" Storyboard.TargetProperty="(UIElement.Opacity)">

101. <EasingDoubleKeyFrame KeyTime="00:00:00" Value="1" />

102. </DoubleAnimationUsingKeyFrames>

103. </Storyboard>

104. </VisualState>

105. <VisualState x:Name="Unchecked" />

106. </VisualStateGroup>

107. <VisualStateGroup x:Name="FocusStates">

108. <VisualState x:Name="Focused" />

109. <VisualState x:Name="Unfocused" />

110. </VisualStateGroup>

111. </VisualStateManager.VisualStateGroups>

112.

113. <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"

114. Width="9" Height="9" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">

115. <Grid>

116. <Path x:Name="plus" Fill="{StaticResource GridView_ToggleButtonStroke}" Stretch="Fill" Stroke="{x:Null}"

117. Width="5" Height="5" Margin="{TemplateBinding Padding}"

118. Data=

"M1.937,0 L2.937,0 2.937,2.0209999 5,2.0209999 5,3.0209999 2.937,3.0209999 2.937,5 1.937,5 1.937,3.0209999 0,3.0209999 0,2.0209999 1.937,2.0209999 z"

/>

119. <Rectangle x:Name="minus" Fill="{StaticResource GridView_ToggleButtonStroke}" Stroke="{x:Null}" RadiusX="0" RadiusY="0" Opacity="0"

120. Width="5" Height="1" Margin="{TemplateBinding Padding}" HorizontalAlignment="Center" VerticalAlignment="Center" />

121. </Grid>

122. </Border>

123. </Border>

124. </ControlTemplate>

125. </Setter.Value>

126. </Setter>

127. </Style>

128.

129. <Style x:Key="PropertyGridGripperStyle" TargetType="Thumb">

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

131. <Setter Property="BorderBrush" Value="Transparent" />

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

133. <Setter Property="Width" Value="8" />

134. <Setter Property="Padding" Value="0" />

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

136. <Setter Property="VerticalContentAlignment" Value="Stretch" />

137. <Setter Property="Cursor" Value="SizeWE" />

138.

139. <Setter Property="Template">

140. <Setter.Value>

141. <ControlTemplate TargetType="Thumb">

142. <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"

143. Padding="{TemplateBinding Padding}"

144. HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

145. </ControlTemplate>

146. </Setter.Value>

147. </Setter>

148. </Style>

149.

150. <Style x:Key="ItemsControlStyle" TargetType="ItemsControl">

151. <Setter Property="Template">

152. <Setter.Value>

153. <ControlTemplate TargetType="ItemsControl">

154. <ScrollViewer Margin="0 -1 0 0">

155. <ItemsPresenter />

156. </ScrollViewer>

157. </ControlTemplate>

158. </Setter.Value>

159. </Setter>

160. </Style>

161.

162. <Style x:Key="VirtualizedItemsControlStyle" TargetType="ItemsControl" BasedOn="{StaticResource ItemsControlStyle}">

163. <Setter Property="ItemsPanel">

164. <Setter.Value>

165. <ItemsPanelTemplate>

166. <VirtualizingStackPanel />

167. </ItemsPanelTemplate>

168. </Setter.Value>

169. </Setter>

170. </Style>

171.

172. <Style x:Key="PropertyGridToggleButtonStyle" TargetType="telerik:RadToggleButton">

173. <Setter Property="Foreground" Value="#FF000000" />

174. <Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder}" />

175. <Setter Property="Height" Value="25" />

176. <Setter Property="HorizontalContentAlignment" Value="Left" />

177. <Setter Property="VerticalContentAlignment" Value="Stretch" />

178. <Setter Property="FontWeight" Value="Bold" />

179.

180. <Setter Property="Template">

181. <Setter.Value>

182. <ControlTemplate TargetType="telerik:RadToggleButton">

183. <Grid>

184. <VisualStateManager.VisualStateGroups>

185. <VisualStateGroup x:Name="CommonStates">

186. <VisualState x:Name="Normal" />

187. <VisualState x:Name="MouseOver" />

188. <VisualState x:Name="Disabled" />

189. </VisualStateGroup>

190. <VisualStateGroup x:Name="CheckStates">

191. <VisualState x:Name="Checked">

192. <Storyboard>

193. <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="ExpanderButton">

194. <EasingDoubleKeyFrame KeyTime="00:00:00.2" Value="180" />

195. </DoubleAnimationUsingKeyFrames>

196. <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderThickness" Storyboard.TargetName="IconOuterBorder">

197. <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0,0,0,0" />

198. </ObjectAnimationUsingKeyFrames>

199. <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderThickness" Storyboard.TargetName="IconInnerBorder">

200. <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="1,1,0,0" />

201. </ObjectAnimationUsingKeyFrames>

202. </Storyboard>

203. </VisualState>

204. <VisualState x:Name="Unchecked" />

205. </VisualStateGroup>

206. <VisualStateGroup x:Name="FocusStates">

207. <VisualState x:Name="Focused" />

208. <VisualState x:Name="Unfocused" />

209. </VisualStateGroup>

210. </VisualStateManager.VisualStateGroups>

211.

212. <Grid.ColumnDefinitions>

213. <ColumnDefinition Width="Auto" />

214. <ColumnDefinition Width="*" />

215. </Grid.ColumnDefinitions>

216.

217. <Border x:Name="IconOuterBorder" BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0,0,0,1"

218. Width="25" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="0" Grid.Row="0">

219. <Border x:Name="IconInnerBorder" Background="{StaticResource PropertyGrid_IndentCellBackground}"

220. BorderBrush="{StaticResource ControlInnerBorder}" BorderThickness="1 1 0 1">

221. <Path x:Name="ExpanderButton" RenderTransformOrigin="0.5,0.5"

222. Fill="{StaticResource ToggleButton_Indicator}" Width="7" Height="5" HorizontalAlignment="Center" VerticalAlignment="Center"

223. Data=

"M0,0L1,0 2,0 2,0.99999991 3,0.99999991 3,2 4,2 4,0.99999991 5,0.99999991 5,0 5.9999999,0 7,0 7,0.99999991 5.9999999,0.99999991 5.9999999,2 5,2 5,3 4,3 4,4 3,4 3,3 2,3 2,2 1,2 1,0.99999991 0,0.99999991z"

>

224. <Path.RenderTransform>

225. <RotateTransform/>

226. </Path.RenderTransform>

227. </Path>

228. </Border>

229. </Border>

230.

231. <Border BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0 0 0 1"

232. Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="0">

233. <Border Background="{StaticResource PropertyGrid_IndentCellBackground}"

234. BorderBrush="{StaticResource ControlInnerBorder}" BorderThickness="0 1 1 1">

235. <ContentPresenter x:Name="PART_ContentPresenter" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"

236. Margin="{TemplateBinding Padding}"

237. HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

238. </Border>

239. </Border>

240.

241. <Border x:Name="ExpandBorder" BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0 0 0 1"

242. Margin="0 -1 0 0" VerticalAlignment="Top" Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="0" />

243. </Grid>

244. </ControlTemplate>

245. </Setter.Value>

246. </Setter>

247. </Style>

248.

249. <DataTemplate x:Key="FlatTemplate">

250. <ItemsControl IsTabStop="False" ItemsSource="{Binding Converter={StaticResource FlatItemSourceConverter}}" Style="{StaticResource ItemsControlStyle}">

251. <ItemsControl.ItemTemplate>

252. <DataTemplate>

253. <telerikpropertygrid:PropertyGridField Content="{Binding}" Visibility="{Binding Visibility}" />

254. </DataTemplate>

255. </ItemsControl.ItemTemplate>

256. </ItemsControl>

257. </DataTemplate>

258.

259. <DataTemplate x:Key="FlatRenderingTemplate">

260. <telerik:ItemsControl VirtualizingStackPanel.VirtualizationMode="Standard" IsTabStop="False" ItemsSource="{Binding}">

261. <telerik:ItemsControl.Style>

262. <Style TargetType="telerik:ItemsControl">

263. <Setter Property="Template">

264. <Setter.Value>

265. <ControlTemplate TargetType="ItemsControl">

266. <ScrollViewer Margin="0 -1 0 0">

267. <ItemsPresenter />

268. </ScrollViewer>

269. </ControlTemplate>

270. </Setter.Value>

271. </Setter>

272.

273. <Setter Property="ItemsPanel">

274. <Setter.Value>

275. <ItemsPanelTemplate>

276. <VirtualizingStackPanel />

277. </ItemsPanelTemplate>

278. </Setter.Value>

279. </Setter>

280. </Style>

281. </telerik:ItemsControl.Style>

282.

283. <telerik:ItemsControl.ItemTemplateSelector>

284. <telerikpropertygrid:FlatRenderingItemTemplateSelector>

285. <telerikpropertygrid:FlatRenderingItemTemplateSelector.FieldTemplate>

286. <DataTemplate>

287. <telerikpropertygrid:PropertyGridField Content="{Binding}" Visibility="{Binding Visibility}" />

288. </DataTemplate>

289. </telerikpropertygrid:FlatRenderingItemTemplateSelector.FieldTemplate>

290. <telerikpropertygrid:FlatRenderingItemTemplateSelector.GroupTemplate>

291. <DataTemplate>

292. <telerik:RadToggleButton x:Name="expandCollapseButton" BorderBrush="{x:Null}"

293. Content="{Binding DisplayName}" IsChecked="{Binding IsExpanded, Mode=TwoWay}"

294. Style="{StaticResource PropertyGridToggleButtonStyle}" />

295. </DataTemplate>

296. </telerikpropertygrid:FlatRenderingItemTemplateSelector.GroupTemplate>

297. </telerikpropertygrid:FlatRenderingItemTemplateSelector>

298. </telerik:ItemsControl.ItemTemplateSelector>

299. </telerik:ItemsControl>

300. </DataTemplate>

301.

302. <DataTemplate x:Key="VirtualizedFlatTemplate">

303. <ItemsControl VirtualizingStackPanel.VirtualizationMode="Standard" IsTabStop="False"

304. ItemsSource="{Binding Converter={StaticResource FlatItemSourceConverter}}" Style="{StaticResource VirtualizedItemsControlStyle}">

305. <ItemsControl.ItemTemplate>

306. <DataTemplate>

307. <telerikpropertygrid:PropertyGridField Content="{Binding}" Visibility="{Binding Visibility}" />

308. </DataTemplate>

309. </ItemsControl.ItemTemplate>

310. </ItemsControl>

311. </DataTemplate>

312.

313. <DataTemplate x:Key="GroupTemplate">

314. <ItemsControl ItemsSource="{Binding Converter={StaticResource GroupingItemsSourceConverter}}" Style="{StaticResource ItemsControlStyle}">

315. <ItemsControl.ItemTemplate>

316. <DataTemplate>

317. <Border BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0 1 0 0" Margin="0 -1 0 0">

318. <Grid>

319. <Grid.RowDefinitions>

320. <RowDefinition Height="Auto" />

321. <RowDefinition Height="*" />

322. </Grid.RowDefinitions>

323.

324. <telerik:RadToggleButton x:Name="expandCollapseButton" BorderBrush="{x:Null}" Content="{Binding Key}" IsChecked="True"

325. Style="{StaticResource PropertyGridToggleButtonStyle}"

326. Grid.Column="0" Grid.Row="0" />

327.

328. <ContentPresenter x:Name="PART_ContentPresenter" Content="{Binding Items}"

329. Visibility="{Binding IsChecked, ElementName=expandCollapseButton, Converter={StaticResource BooleanToVisibilityConverter}}"

330. Grid.Column="0" Grid.Row="1">

331. <ContentPresenter.ContentTemplate>

332. <DataTemplate>

333. <ItemsControl ItemsSource="{Binding Converter={StaticResource FlatItemSourceConverter}}" IsTabStop="False">

334. <ItemsControl.ItemTemplate>

335. <DataTemplate>

336. <telerikpropertygrid:PropertyGridField Content="{Binding}" Visibility="{Binding Visibility}" />

337. </DataTemplate>

338. </ItemsControl.ItemTemplate>

339. </ItemsControl>

340. </DataTemplate>

341. </ContentPresenter.ContentTemplate>

342. </ContentPresenter>

343. </Grid>

344. </Border>

345. </DataTemplate>

346. </ItemsControl.ItemTemplate>

347. </ItemsControl>

348. </DataTemplate>

349.

350. <telerikpropertygrid:ItemTemplateConverter x:Key="ItemTemplateConverter"

351. FlatTemplate="{StaticResource FlatTemplate}"

352. FlatRenderingTemplate="{StaticResource FlatRenderingTemplate}"

353. VirtualizedFlatTemplate="{StaticResource VirtualizedFlatTemplate}"

354. GroupTemplate="{StaticResource GroupTemplate}" />

355.

356. <Style x:Key="PropertyGridIndentCellStyle" TargetType="telerikpropertygrid:PropertyGridIndentCell">

357. <Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder}" />

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

359. <Setter Property="Padding" Value="0" />

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

361. <Setter Property="VerticalContentAlignment" Value="Stretch" />

362.

363. <Setter Property="Template">

364. <Setter.Value>

365. <ControlTemplate TargetType="telerikpropertygrid:PropertyGridIndentCell">

366. <Border Background="Transparent" Width="25" />

367. </ControlTemplate>

368. </Setter.Value>

369. </Setter>

370. </Style>

371.

372. <Style x:Key="PropertyGridColumnResizerStyle" TargetType="telerikpropertygrid:PropertyGridColumnResizer">

373. <Setter Property="IsTabStop" Value="False" />

374.

375. <Setter Property="Template">

376. <Setter.Value>

377. <ControlTemplate TargetType="telerikpropertygrid:PropertyGridColumnResizer">

378. <Border Background="{TemplateBinding Background}" VerticalAlignment="Stretch">

379. <Thumb HorizontalAlignment="Right" Style="{StaticResource PropertyGridGripperStyle}" />

380. </Border>

381. </ControlTemplate>

382. </Setter.Value>

383. </Setter>

384. </Style>

385.

386. <Style x:Key="PropertyGridFieldStyle" TargetType="telerikpropertygrid:PropertyGridField">

387. <Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder}" />

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

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

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

391. <Setter Property="IsTabStop" Value="False" />

392.

393. <Setter Property="Template">

394. <Setter.Value>

395. <ControlTemplate TargetType="telerikpropertygrid:PropertyGridField">

396. <Border x:Name="PART_RootElement" Background="{TemplateBinding Background}"

397. BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">

398. <VisualStateManager.VisualStateGroups>

399. <VisualStateGroup x:Name="SelectionStates">

400. <VisualState x:Name="Unselected" />

401. <VisualState x:Name="Selected">

402. <Storyboard>

403. <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Chrome" Storyboard.TargetProperty="RenderSelected">

404. <DiscreteObjectKeyFrame KeyTime="00:00:00">

405. <DiscreteObjectKeyFrame.Value>

406. <system:Boolean>True</system:Boolean>

407. </DiscreteObjectKeyFrame.Value>

408. </DiscreteObjectKeyFrame>

409. </ObjectAnimationUsingKeyFrames>

410. </Storyboard>

411. </VisualState>

412. </VisualStateGroup>

413. </VisualStateManager.VisualStateGroups>

414.

415. <Grid>

416. <Grid.RowDefinitions>

417. <RowDefinition Height="*" />

418. <RowDefinition Height="Auto" />

419. </Grid.RowDefinitions>

420.

421. <Grid x:Name="PART_PropertyGridFieldGridN" MinHeight="25" Height="{TemplateBinding Height}">

422. <Grid.ColumnDefinitions>

423. <ColumnDefinition Width="Auto" />

424. <ColumnDefinition Width="{Binding LabelColumnWidth, ElementName=PropertyGridPresenter}" />

425. <ColumnDefinition Width="*" />

426. </Grid.ColumnDefinitions>

427.

428. <telerikchromes:ButtonChrome x:Name="Chrome" RenderNormal="True" Visibility="Collapsed"

429.

Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="0" />

430.

431. <!--<Border x:Name="PART_SelectionBackgroundN" />

432. <Border x:Name="Background_Over" />

433. <Grid x:Name="FieldIndicator" />-->

434. <Border x:Name="PART_SelectionBackgroundN" BorderBrush="{StaticResource ItemOuterBorder_Selected}" BorderThickness="1" Grid.Column="1" CornerRadius="1" HorizontalAlignment="Stretch" Margin="1,1,1,2" Visibility="Collapsed" VerticalAlignment="Stretch">

435. <Border BorderBrush="{StaticResource ItemInnerBorder_Selected}" BorderThickness="1" Background="{StaticResource ItemBackground_Selected}" CornerRadius="1"/>

436. </Border>

437. <Border x:Name="Background_Over" BorderBrush="{StaticResource ItemOuterBorder_Over}" BorderThickness="1" Grid.Column="1" Grid.ColumnSpan="2" CornerRadius="1" HorizontalAlignment="Stretch" Margin="1,1,1,2" Visibility=

"{Binding IsMouseOver, Converter={StaticResource BooleanToVisibilityConverter}, RelativeSource={RelativeSource TemplatedParent}}"

VerticalAlignment="Stretch">

438. <Border BorderBrush="{StaticResource ItemInnerBorder_Over}" BorderThickness="1" Background="{StaticResource ItemBackground_Over}" CornerRadius="1"/>

439. </Border>

440. <Grid x:Name="FieldIndicator" Visibility="{Binding RelativeSource={RelativeSource AncestorType=telerikdata:RadPropertyGrid}, Path=FieldIndicatorVisibility}">

441. <Border BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0,0,1,0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="25">

442. <Border BorderBrush="{StaticResource ControlInnerBorder}" BorderThickness="1,0,1,0" Background="{StaticResource PropertyGrid_IndentCellBackground}"/>

443. </Border>

444. </Grid>

445.

446. <Border BorderBrush="{StaticResource PropertyGrid_TemplatesBorderBrush}" BorderThickness="1 0 0 1"

447. Grid.Column="4" Grid.Row="0">

448. <ContentPresenter Margin="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

449. </Border>

450.

451. <Border BorderBrush="{StaticResource PropertyGrid_TemplatesBorderBrush}" BorderThickness="0 0 0 1"

452. Grid.Column="1" Grid.Row="0">

453. <StackPanel Orientation="Horizontal">

454. <telerikpropertygrid:PropertyGridIndentPresenter IndentLevel="{Binding Path=IndentLevel, RelativeSource={RelativeSource TemplatedParent}}">

455. <telerikpropertygrid:PropertyGridIndentPresenter.ItemsPanel>

456. <ItemsPanelTemplate>

457. <StackPanel Orientation="Horizontal" />

458. </ItemsPanelTemplate>

459. </telerikpropertygrid:PropertyGridIndentPresenter.ItemsPanel>

460.

461. <telerikpropertygrid:PropertyGridIndentPresenter.ItemTemplate>

462. <DataTemplate>

463. <telerikpropertygrid:PropertyGridIndentCell Style="{StaticResource PropertyGridIndentCellStyle}" />

464. </DataTemplate>

465. </telerikpropertygrid:PropertyGridIndentPresenter.ItemTemplate>

466.

467. <telerikpropertygrid:PropertyGridIndentPresenter.Template>

468. <ControlTemplate>

469. <ItemsPresenter />

470. </ControlTemplate>

471. </telerikpropertygrid:PropertyGridIndentPresenter.Template>

472. </telerikpropertygrid:PropertyGridIndentPresenter>

473.

474. <telerik:RadToggleButton x:Name="PART_NestedPropertiesButton" Background="Transparent" Width="25"

475.

IsChecked="{Binding Path=IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"

476.

Visibility=

"{Binding ShouldDisplayNestedProperties, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}"

477.

Style="{StaticResource PropertyGridNestedToggleButtonStyle}" />

478.

479. <TextBlock x:Name="PART_FieldLabelN" Text="{Binding DisplayName}" IsHitTestVisible="True"

480. Margin="4 2 0 2" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

481. </StackPanel>

482. </Border>

483.

484. <telerikpropertygrid:PropertyGridColumnResizer x:Name="ColumnResizer" Margin="0 0 -4 0" HorizontalAlignment="Right"

485.

Style="{StaticResource PropertyGridColumnResizerStyle}"

486.

Grid.Column="1" Grid.Row="0" />

487. </Grid>

488.

489. <ItemsControl ItemsSource="{Binding NestedProperties, Converter={StaticResource FlatItemSourceConverter}}"

490. Visibility=

"{Binding Path=ShouldDisplayNestedItemsControl, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}"

491. Grid.Column="0" Grid.Row="1">

492. <ItemsControl.ItemTemplate>

493. <DataTemplate>

494. <telerikpropertygrid:PropertyGridField Content="{Binding}" Visibility="{Binding Visibility}" />

495. </DataTemplate>

496. </ItemsControl.ItemTemplate>

497. </ItemsControl>

498. </Grid>

499. </Border>

500. </ControlTemplate>

501. </Setter.Value>

502. </Setter>

503. </Style>

504.

505. <Style x:Key="PropertyGridFieldStyle2" TargetType="telerikpropertygrid:PropertyGridField">

506. <Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder}"/>

507. <Setter Property="IsTabStop" Value="False"/>

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

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

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

511.

512. <Setter Property="Template">

513. <Setter.Value>

514. <ControlTemplate TargetType="telerikpropertygrid:PropertyGridField">

515. <Border x:Name="PART_RootElement" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" >

516.

517. <VisualStateManager.VisualStateGroups>

518. <VisualStateGroup Name="SelectionStates">

519. <VisualState x:Name="Unselected">

520. <Storyboard Duration="0">

521. <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_SelectionBackgroundN" Storyboard.TargetProperty="Visibility">

522. <DiscreteObjectKeyFrame KeyTime="00:00:00">

523. <DiscreteObjectKeyFrame.Value>

524. <Visibility>Collapsed</Visibility>

525. </DiscreteObjectKeyFrame.Value>

526. </DiscreteObjectKeyFrame>

527. </ObjectAnimationUsingKeyFrames>

528. </Storyboard>

529. </VisualState>

530. <VisualState x:Name="Selected">

531. <Storyboard Duration="0">

532. <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_SelectionBackgroundN" Storyboard.TargetProperty="Visibility">

533. <DiscreteObjectKeyFrame KeyTime="00:00:00">

534. <DiscreteObjectKeyFrame.Value>

535. <Visibility>Visible</Visibility>

536. </DiscreteObjectKeyFrame.Value>

537. </DiscreteObjectKeyFrame>

538. </ObjectAnimationUsingKeyFrames>

539. </Storyboard>

540. </VisualState>

541. </VisualStateGroup>

542. </VisualStateManager.VisualStateGroups>

543.

544. <Grid>

545. <Grid.RowDefinitions>

546. <RowDefinition />

547. <RowDefinition Height="Auto"/>

548. </Grid.RowDefinitions>

549. <Grid x:Name="PART_PropertyGridFieldGridN" MinHeight="25" Height="{TemplateBinding Height}">

550. <Grid.ColumnDefinitions>

551. <ColumnDefinition Width="Auto"/>

552. <ColumnDefinition Width="{Binding LabelColumnWidth, ElementName=PropertyGridPresenter}"/>

553. <ColumnDefinition Width="*"/>

554. </Grid.ColumnDefinitions>

555. <Border x:Name="PART_SelectionBackgroundN" BorderBrush="{StaticResource ItemOuterBorder_Selected}" BorderThickness="1" Grid.Column="1" CornerRadius="1" HorizontalAlignment="Stretch" Margin="1,1,1,2" Visibility="Collapsed" VerticalAlignment="Stretch">

556. <Border BorderBrush="{StaticResource ItemInnerBorder_Selected}" BorderThickness="1" Background="{StaticResource ItemBackground_Selected}" CornerRadius="1"/>

557. </Border>

558. <Border x:Name="Background_Over" BorderBrush="{StaticResource ItemOuterBorder_Over}" BorderThickness="1" Grid.Column="1" Grid.ColumnSpan="2" CornerRadius="1" HorizontalAlignment="Stretch" Margin="1,1,1,2" Visibility=

"{Binding IsMouseOver, Converter={StaticResource BooleanToVisibilityConverter}, RelativeSource={RelativeSource TemplatedParent}}"

VerticalAlignment="Stretch">

559. <Border BorderBrush="{StaticResource ItemInnerBorder_Over}" BorderThickness="1" Background="{StaticResource ItemBackground_Over}" CornerRadius="1"/>

560. </Border>

561. <Grid x:Name="FieldIndicator" Visibility="{Binding RelativeSource={RelativeSource AncestorType=telerikdata:RadPropertyGrid}, Path=FieldIndicatorVisibility}">

562. <Border BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0,0,1,0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="25">

563. <Border BorderBrush="{StaticResource ControlInnerBorder}" BorderThickness="1,0,1,0" Background="{StaticResource PropertyGrid_IndentCellBackground}"/>

564. </Border>

565. </Grid>

566. <Border BorderBrush="{StaticResource PropertyGrid_TemplatesBorderBrush}" BorderThickness="1,0,0,1" Grid.Column="4">

567. <ContentPresenter Margin="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

568. </Border>

569. <Border BorderBrush="{StaticResource PropertyGrid_TemplatesBorderBrush}" BorderThickness="0,0,0,1" Grid.Column="1">

570. <StackPanel Orientation="Horizontal" >

571. <telerikpropertygrid:PropertyGridIndentPresenter IndentLevel="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IndentLevel}">

572. <telerikpropertygrid:PropertyGridIndentPresenter.ItemsPanel>

573. <ItemsPanelTemplate>

574. <StackPanel Orientation="Horizontal"/>

575. </ItemsPanelTemplate>

576. </telerikpropertygrid:PropertyGridIndentPresenter.ItemsPanel>

577. <telerikpropertygrid:PropertyGridIndentPresenter.ItemTemplate>

578. <DataTemplate>

579. <telerikpropertygrid:PropertyGridIndentCell />

580. </DataTemplate>

581. </telerikpropertygrid:PropertyGridIndentPresenter.ItemTemplate>

582. <telerikpropertygrid:PropertyGridIndentPresenter.Template>

583. <ControlTemplate>

584. <ItemsPresenter />

585. </ControlTemplate>

586. </telerikpropertygrid:PropertyGridIndentPresenter.Template>

587. </telerikpropertygrid:PropertyGridIndentPresenter>

588. <telerik:RadToggleButton x:Name="PART_NestedPropertiesButton" Style="{StaticResource PropertyGridNestedToggleButtonStyle}" Background="Transparent" Width="25" Visibility=

"{Binding ShouldDisplayNestedProperties, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}"

IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsExpanded, Mode=TwoWay}"/>

589.

590. <TextBlock IsHitTestVisible="True" x:Name="PART_FieldLabelN" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="4,2,0,2" Text="{Binding DisplayName}"/>

591. </StackPanel>

592. </Border>

593.

594. <telerikpropertygrid:PropertyGridColumnResizer x:Name="ColumnResizer" Grid.Column="1" telerik:StyleManager.Theme="{StaticResource Theme}" Margin="0,0,-4,0" HorizontalAlignment="Right"/>

595. </Grid>

596. <ItemsControl Visibility=

"{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}, Path=ShouldDisplayNestedItemsControl }"

Grid.Row="1" ItemsSource="{Binding NestedProperties, Converter={StaticResource FlatItemSourceConverter}}">

597. <ItemsControl.ItemTemplate>

598. <DataTemplate>

599. <telerikpropertygrid:PropertyGridField Content ="{Binding}" telerik:StyleManager.Theme="{StaticResource Theme}" Visibility="{Binding Visibility}"/>

600. </DataTemplate>

601. </ItemsControl.ItemTemplate>

602. </ItemsControl>

603. </Grid>

604. </Border>

605.

606. </ControlTemplate>

607. </Setter.Value>

608. </Setter>

609. </Style>

610.

611. <Style TargetType="wmsforms:CharacteristicsForm">

612. <Setter Property="Background" Value="{StaticResource ControlBackground}" />

613. 

614. <Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder}" />

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

616. <Setter Property="HorizontalAlignment" Value="Stretch" />

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

618. <Setter Property="IsTabStop" Value="False" />

619.

620. <Setter Property="SortAndGroupButtonsVisibility" Value="Collapsed" />

621. <Setter Property="AutoGeneratePropertyDefinitions" Value="False" />

622. <Setter Property="LabelColumnWidth" Value="100" />

623.

624. <Setter Property="EditorTemplateSelector" Value="{StaticResource CharacteristicsEditorTemplateSelector}" />

625. <Setter Property="FieldStyle" Value="{StaticResource PropertyGridFieldStyle2}" />

626.

627. <Setter Property="Template">

628. <Setter.Value>

629. <ControlTemplate TargetType="wmsforms:CharacteristicsForm">

630. <Border x:Name="PART_RootElement" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">

631. <Grid x:Name="PART_PropertyGridContainer" Background="{TemplateBinding Background}">

632. <Grid.RowDefinitions>

633. <RowDefinition Height="Auto" />

634. <RowDefinition Height="*" />

635. <RowDefinition Height="Auto" />

636. </Grid.RowDefinitions>

637.

638. <Border x:Name="Header" BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0 0 0 1" MinHeight="28" Margin="0 0 0 2"

639. Visibility="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource HeaderVisibilityConverter}}">

640. <Border BorderBrush="{StaticResource ControlInnerBorder}" BorderThickness="0">

641. <Grid Margin="1">

642. <Grid.ColumnDefinitions>

643. <ColumnDefinition Width="Auto" />

644. <ColumnDefinition Width="Auto" />

645. <ColumnDefinition Width="*" />

646. </Grid.ColumnDefinitions>

647.

648. <telerik:RadRadioButton x:Name="groupButton" Width="28" Margin="0 0 3 0"

649.

IsChecked="{Binding Path=IsGrouped, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"

650.

Visibility="{TemplateBinding SortAndGroupButtonsVisibility}"

651.

Grid.Column="0" Grid.Row="0">

652. <ToolTipService.ToolTip>

653. <ToolTip telerik:LocalizationManager.ResourceKey="Categorize" />

654. </ToolTipService.ToolTip>

655. <Path Fill="{StaticResource RadioButton_Indicator}" Stretch="Fill" StrokeThickness="0" Width="17" Height="11"

656. Data=

"M7.0000019,8.9999981 L16.999998,8.9999981 L16.999998,9.9999981 L7.0000019,9.9999981 z M7.0000019,6.9999995 L16.999998,6.9999995 L16.999998,7.9999995 L7.0000019,7.9999995 z M0,6 L3.9999998,8.5 L0,11 z M6.999999,3.0000055 L16.999996,3.0000055 L16.999996,4.0000052 L6.999999,4.0000052 z M7.0000019,0.99999905 L16.999998,0.99999905 L16.999998,1.9999989 L7.0000019,1.9999989 z M0,0 L4,2.5000002 L0,5.0000005 z"

/>

657. </telerik:RadRadioButton>

658. <telerik:RadRadioButton x:Name="sortButton" Content="A-Z" Width="28" Margin="0 0 2 0"

659.

Visibility="{TemplateBinding SortAndGroupButtonsVisibility}"

660.

Grid.Column="1" Grid.Row="0">

661. <ToolTipService.ToolTip>

662. <ToolTip telerik:LocalizationManager.ResourceKey="Alphabetical" />

663. </ToolTipService.ToolTip>

664. </telerik:RadRadioButton>

665.

666. <TextBox x:Name="searchAsYouTypeTextBox"

667. Text="{Binding FilterText, ElementName=PropertyGridPresenter, Mode=TwoWay}"

668. Margin="0 0 0 0" HorizontalAlignment="Stretch"

669. telerik:TextBoxBehavior.SelectAllOnGotFocus="True"

670. telerik:TextBoxBehavior.UpdateTextOnEnter="True" telerik:TextBoxBehavior.UpdateTextOnTextChanged="True"

671. Visibility="{TemplateBinding SearchBoxVisibility}"

672. Grid.Column="2" Grid.Row="0" />

673.

674. <Border Background="{TemplateBinding Background}"

675. Width="22" Margin="0 1 1 1" HorizontalAlignment="Right"

676. Visibility="{TemplateBinding SearchBoxVisibility}"

677. Grid.Column="2" Grid.Row="0">

678. <Path Fill="{StaticResource PropertyGrid_SearchIndicator_Background}"

679. Stretch="Fill" StrokeThickness="2" Width="14" Height="14" Margin="4"

680. Data=

"M8.4939966,1.9999999 C6.5610008,1.9999999 4.9939971,3.5670033 4.9939971,5.5 C4.9939971,7.4329967 6.5610008,9 8.4939966,9 C10.426993,9 11.993997,7.4329967 11.993997,5.5 C11.993997,3.5670033 10.426993,1.9999999 8.4939966,1.9999999 z M8.4939976,0 C11.531564,-8.7786177E-08 13.993998,2.4624338 13.993998,5.5 C13.993998,8.5375662 11.531564,11 8.4939976,11 C7.3549109,11 6.2967014,10.65372 5.4188957,10.060686 L5.3678761,10.025319 L1.4142134,13.978982 L0,12.564768 L3.9563832,8.6083851 L3.9333115,8.5751028 C3.3402777,7.6972966 2.9939978,6.6390872 2.9939978,5.5 C2.9939978,2.4624338 5.4564314,-8.7786177E-08 8.4939976,0 z"

/>

681. </Border>

682. </Grid>

683. </Border>

684. </Border>

685.

686. <telerikpropertygrid:PropertyGridPresenter x:Name="PropertyGridPresenter" Margin="0 -1 0 0"

687.

ContentTemplate=

"{Binding Path=PropertyGridLayoutState, RelativeSource={RelativeSource Self}, Converter={StaticResource ItemTemplateConverter}}"

688.

PropertyDefinitions="{Binding PropertyDefinitions, RelativeSource={RelativeSource TemplatedParent}}"

689.

LabelColumnWidth="{Binding LabelColumnWidth, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"

690.

SearchInNestedProperties="{Binding SearchInNestedProperties, RelativeSource={RelativeSource TemplatedParent}}"

691.

RenderMode="{TemplateBinding RenderMode}" IsGrouped="{TemplateBinding IsGrouped}"

692.

Grid.Column="0" Grid.Row="1" />

693.

694. <Border x:Name="PART_DescriptionPanel" BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0 1 0 0"

695. MinHeight="75" Visibility="{TemplateBinding DescriptionPanelVisibility}"

696. Grid.Column="0" Grid.Row="2">

697. <Border Background="{StaticResource PropertyGrid_DescriptionBackground}"

698. BorderBrush="{StaticResource ControlInnerBorder}" BorderThickness="0 1 0 0">

699. <StackPanel Orientation="Vertical">

700. <TextBlock x:Name="PART_DescriptionLabelTextBlock" FontWeight="Bold" Margin="5"

701. Text="{Binding SelectedPropertyDefinition.DisplayName, ElementName=PropertyGridPresenter}" />

702. <TextBlock x:Name="PART_DescriptionContentTextBlock" TextWrapping="Wrap" Margin="5 0 5 5"

703. Text="{Binding SelectedPropertyDefinition.Description, ElementName=PropertyGridPresenter}" />

704. </StackPanel>

705. </Border>

706. </Border>

707. </Grid>

708. </Border>

709. </ControlTemplate>

710. </Setter.Value>

711. </Setter>

712. </Style>

713.</ResourceDictionary>

Kind regards,
Beijerinc

answered on 29 Apr 2014, 03:58 PM

FieldStyle-2.zip

Hi Beijerinc,

We spent some time to test the snippet you provided and isolate the problem you reported.
As it turns out, you have an inherited RadPropertyGrid element and you assign custom FieldStyle, which is pointing to a specific style targeted at PropertyGridField. Probably something went wrong with the styles you have defined.

By that reason we created a brand new project with inherited property grid, that uses the default templates of RadPropertyGrid. We set the FieldStyle attribute in the same way, as you did.

Would it be possible to take a look at the attached demo and let us know how it works by your side?

If the project works correctly, I may recommend you to add these styles to your project and manipulate it in the way you need.

*As a side note, I strongly recommend you to use pure NoXAML binaries, combined with implicit styles.

I look forward to hearing from you.

Regards,
Vanya Pavlova
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.

answered on 01 May 2014, 01:32 PM

Hello Vanya,

I have tried the project you provided. I added a Border with a background to the very bottom of the PropertyGridFieldStyle, started the project and discovered that it was working.

However, when I looked more closely in an attempt to discover the error I had made earlier, I found this:

<Style TargetType="wmsforms:CharacteristicsForm" BasedOn="{StaticResource CharacteristicsFormStyle}"/>

<Style TargetType="propertyGrid:PropertyGridIndentCell" BasedOn="{StaticResource PropertyGridIndentCellStyle}"/>

Please note the commented style (Telerik.Windows.Controls.Data.xaml line 2061). It is an implicit style for the PropertyGridField. The reason my Border had an effect was because the PropertyGridFieldStyle was not only applied to the FieldStyle property, but also applied as an implicit style. Once I commented this implicit style out, the PropertyGrid stopped showing it's fields, regardless of my added border.

I hope you can fix this in a future version of the control, as it is sorely needed. I want to thank you for the effort you put into this issue, Vanya. I greatly appreciate your help looking into this matter.

Kind regards,
Beijerinc

answered on 07 May 2014, 08:28 AM

Hi Hans,

If you isolate this additional Border element in a separate explicit style (the one with x:Key defined) it will be applied only to all RadPropertyGrid controls, where the FieldStyle attribute is pointing to this resource.
As the name implies, this explicit style always takes precedence over the implicit one.

Would it be possible to update the project with the problem you have and send it back to us as an attachment in a new thread?

Regards,
Vanya Pavlova
Telerik

answered on 16 May 2014, 03:35 PM

Hello Vanya,

It is not my intention to be rude, but my previous post contained a file name and line number to the only line that causes the problem. Comment this line out and the RadPropertyGrid will not draw it's fields at all.

The line references an implicity style for the PropertyGridField class. The project also contains an explicit style for this class that is assigned to the FieldStyle property of the RadPropertyGrid. The project should be able to run without this implicit style because the FieldStyle property is being set, but when the RadPropertyGrid is displayed it contains no fields (probably because it is drawing them with an non-existing style).

You don't have to add a border to the PropertyGridField style, simply comment out line 2061 of Telerik.Windows.Controls.Data.xaml and you will see that the RadPropertyGrid is unusable.

Kind regards,
Beijerinc

answered on 21 May 2014, 12:35 PM

Hello Hans,

Thank you for getting back to us. As it turns out, it seems that there is some kind of misunderstanding, sorry for that. The line you are pointing to is the default implicit style, which is used to style all PropertyGridFields at once. If we comment out this line the grid will become unusable indeed, because the fields would not be styled at all. They rely on implicit styles to achieve desired look and feel.
I checked once again all themes and we do not have commented this style in any theme.

Can you point us to the decompiler results that you were referring to?
Your custom explicit styles should be outside of Telerik.Windows.Controls.Data.xaml if you need to alter the appearance of specific fields for specific property grid components.
Copy your custom style and set it only to those fields or property grids you need.

I believe that something went wrong in your project and I will be glad to be of help on that matter.

Regards,
Vanya Pavlova
Telerik

answered on 26 May 2014, 01:06 PM

Hello Vanya,

In the project that was included on this thread, the Telerik.Windows.Controls.Data.xaml file is a resource dictionary that defines styles for some of the controls used in the project. It styles the CharacteristicsForm class, included with the project, which is a derived RadPropertyGrid with its own style key. The purpose of the project is to apply a different style to one of the PropertyGridField controls used in the CharacteristicsForm (being a RadPropertyGrid).

The Telerik.Windows.Controls.Data.xaml file contains only a single style for the PropertyGridField, named "PropertyGridFieldStyle" (line 2045). This style is applied explicitly on line 2059, as such:

<Style x:Key="CharacteristicsFormStyle" TargetType="wmsforms:CharacteristicsForm">

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

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

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

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

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

<Setter Property="FieldStyle" Value="{StaticResource PropertyGridFieldStyle}"/>

</Style>

The style is also applied implicitly on line 2062, as such:

<Style TargetType="propertyGrid:PropertyGridField" BasedOn="{StaticResource PropertyGridFieldStyle}"/>

As you have seen, if the implicit style is commented out, the CharacteristicsForm breaks. However, if there is an explicit style available (as is the case here), Silverlight will use that instead of any implicit styles. Therefore, commenting out any implicit styles should have no effect at all.

Since it clearly does, we can safely deduce that the explicit style, provided by the FieldStyle property, is not applied to the fields of the CharacteristicsForm.

I would like to add that all styles in the example project are Telerik's default styles, save for the RadPropertyGrid's style being applied to TargetType CharacteristicsForm, as that is the point the example project is trying to make.

If it is still not clear what I mean, I would be happy to schedule a call with you Vanya, so that we can discuss the problem further and hopefully conclude the issue.

Kind regards,
Beijerinc

answered on 29 May 2014, 02:55 PM

Hello Beijerinc,

Thank you for sending this detailed explanation - indeed commenting the implicit style affects the PropertyGrid fields even if there is explicit style set to them, this is quite strange and we will definitely investigate it further.

However, please note that the Style set to FieldStyle property is still applied, you could easily test it by creating a custom PropertyGridFieldStyle and change, for example, the Background property:

<Style x:Key="CustomPropertyGridFieldStyle" TargetType="propertyGrid:PropertyGridField">

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

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

<Setter Property="IsTabStop" Value="False"/>

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

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

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

</Style>

Then setting the newly created CustomPropertyGridFieldStyle to the FieldStyle;

<Style x:Key="CharacteristicsFormStyle" TargetType="wmsforms:CharacteristicsForm">

...

<Setter Property="FieldStyle" Value="{StaticResource CustomPropertyGridFieldStyle}"/>

</Style>

will lead to having fields with red background. Indeed, the implicit style for PropertyGridField is still needed, so please leave it for now.

I hope you will find this helpful. If you have any additional questions or concerns, write to us again.

Regards,
Yana
Telerik

answered on 30 May 2014, 07:27 AM

Hello Yana,

I have tried your suggestion and the red background is indeed applied.

I was surprised by this (considering the weird behavior of the styles) and decided to check if changes to the ControlTemplate were also applied if a default implicit style was present. I copied the ControlTemplate and gave it a unique key, then applied it to a copy of the PropertyGridField style and removed the key of this style (to make it implicit). This somehow makes the PropertyGridFields disappear again.

To be sure I had made no mistakes, I did this again in a newly unzipped version of the example project, and the same thing happens. I made sure to comment out the implicit style already present to prevent conflicts. I also noticed a "find ancestor"-binding to the derived CharacteristicsForm type (while a binding to the RadPropertyGrid base class would have done fine), so I changed that as well, but to no effect. This strange behavior also occurs when I copy the entire ControlTemplate into the Style as a setter for the Template property.

I hope you will take this into consideration during your investigation, as I believe it may be linked to the Style behavior. Thank you for your help so far, I look forward to hearing from you.

Kind regards,
Beijerinc

answered on 10 Jun 2014, 01:35 PM

Hello Hans,

Thank you for getting back to us. As it turns out, you hit a problem, which could be replicated only in Silverlight, even if you do not use inherited RadPropertyGrid component.
I've already logged this bug on our Ideas and Feedback portal, and you may track its progress here.

We will do our best to provide a fix for this issue for one of our next internal builds.

I'm also updating your Telerik points correctly.

Regards,
Vanya Pavlova
Telerik

answered on 30 Oct 2014, 12:35 PM

image2.png

Hi,

I'm not sure if this is a related issue, but on selecting an item in the property grid, the background goes a very light colour.

As a result telerik labels in our user control be come unreadable (see attached picture).

Is there a way to make a style that will automatically change the labels to black when the property is selected?

answered on 31 Oct 2014, 11:02 AM

Hi Hans,

Can you post the control template, referred below?:

<Style x:Key="CustomPropertyGridFieldStyle" TargetType="propertyGrid:PropertyGridField">

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

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

<Setter Property="IsTabStop" Value="False"/>

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

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

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

</Style>

Is it a custom one or the default one?
As a rule of thumb, the default Foreground for this theme is set to a lighter color.
Then when you select it, it will enter the selected state of PropertyGridField, the selected foreground will turn to black.

Regards,
Vanya Pavlova
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

answered on 31 Oct 2014, 03:49 PM

Hello Hans,

If you want to force SelectedState of PropertyGridField, you may call VisualStateManager.GoToState() for this element.

However your custom control is not aware of the fact that property grid field enters selected state.

I would suggest you to use a small trick here using Binding to IsSelected property of the field:

<Window.Resources>

<telerik:BooleanToVisibilityConverter x:Key="booleanToVisibilityConverter"/>

<DataTemplate x:Key="dt">

<StackPanel Orientation="Horizontal">

<Grid>

<TextBlock Text="SomeText" Margin="0,0,2,0" VerticalAlignment="Center"/>

<TextBlock Text="SomeText" Visibility=

"{Binding IsSelected,RelativeSource={RelativeSource AncestorType=telerik:PropertyGridField},Converter={StaticResource booleanToVisibilityConverter}}"

Foreground="Black" VerticalAlignment="Center"/>

</Grid>

<TextBox Text="{Binding Height, Mode=TwoWay}" telerik:StyleManager.Theme="Expression_Dark"/>

</StackPanel>

</DataTemplate>

</Window.Resources>

Can you please give it a try and let me know how it corresponds to your needs?

Regards,
Vanya Pavlova
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Custom style for PropertyGridField

23 Answers, 1 is accepted