RadListPicker control margin

[Thomas]

Good afternoon,

I have the following code:

<StackPanel>
  <telerikPrimitives:RadToggleSwitch x:Name="LiveTileCheckBox" Content="{Binding IsChecked, Converter={StaticResource BoolToOnOffConverter}, ElementName=LiveTileCheckBox, Mode=TwoWay}" Header="Use Live Tile" IsChecked="{Binding LiveTileEnabled, Mode=TwoWay}"/>

                                    <telerikPrimitives:RadToggleSwitch x:Name="LiveTileModeCheckBox" Margin="0" Content="{Binding IsChecked, Converter={StaticResource BoolToModeConverter}, ElementName=LiveTileModeCheckBox, Mode=TwoWay}" Header="Mode" IsChecked="{Binding LiveTileMode, Mode=TwoWay}"/>

                                    <telerikInput:RadListPicker Header="Location"/>

</StackPanel>

I understand that the RadListPicker has been identified as a "touch target" and the default style has {StaticResource PhoneTouchTargetOverhang} as the margin as indicated by a previous post. However, I am trying to understand why there is a 10 pixel left/right indentation on the control itself. It appears that somewhere in the default style there is a redundancy in the margin. Is this by design, and why? The only way to bring it back into a lined-up appearance is to override the default control style and change the margin of the parent grid (which does not appear to be set to PhoneTouchTargetOverhang). Where are you redundantly setting the left/right margin or is this in the control code itself?

Out of the box, controls should line up evenly and any customization should be done via overriding styles. The code above is an example of how to reproduce the unwanted behavior that RadListPicker exhibits. By default the header and left/right margins of the selection box should align with the toggle switches above it within the StackPanel, not be on its own rules that have to be overridden to get them to appear correctly as a form should be.

Can you please tell me if this is a design flaw that will be fixed in an upcoming patch, or are you leaving it up to us to bring the control back into expected behavior via a set of complex styles?

[Thomas]

EDIT - After some playing around, I was able to create the expected behavior by adding Margin="0" to the RadListPicker. It appears that the default margin of the control is not the expected "0" if not explicitly set. As a side note, creating a copy in Blend did not reveal that the ControlTemplate's parent grid was set to something other than 0. So is this behavior hard-coded in the control or part of a redundancy of adding a margin coming down from a parent class?

[Dimitrina]

Hello Thomas,

Thank you for your feedback.

The 10 px. margin is by design but we will take your feedback into consideration for future releases. For the moment, you can use the approach you suggested (Margin=0). Sorry for the inconvenience and let us know if you have further questions or comments.


Regards,
Dimitrina
Telerik