RadButton not left aligned in UWP Release Mode

3 posts, 0 answers
  1. Daniel
    Daniel avatar
    11 posts
    Member since:
    Dec 2017

    Posted 02 Mar 2018 Link to this post

    Hi there!

    I am using the RadButton in an UWP app with Xamarin Forms.

    The title should be left aligned and he button should have a padding.

    In Debug Mode, everything looks fine but in release mode both padding and alignment are ignored. (See screenshots attached)

    This is my code in a clean Telerik template:

    <StackLayout Spacing="5" Padding="0,20,0,0" BackgroundColor="LightGray">
            <telerikInput:RadButton Text="Left Aligned With Padding" HorizontalContentAlignment="Start" Padding="20" BackgroundColor="White" />
            <telerikInput:RadButton Text="Left Aligned With Padding" HorizontalContentAlignment="Start" Padding="20" BackgroundColor="White" />
            <telerikInput:RadButton Text="Left Aligned With Padding" HorizontalContentAlignment="Start" Padding="20" BackgroundColor="White" />
        </StackLayout>
  2. Stefan Nenchev
    Admin
    Stefan Nenchev avatar
    665 posts

    Posted 05 Mar 2018 Link to this post

    Hi, Daniel,

    I have managed to easily reproduce the behavior with the same setup. Investigating the UWP layout at runtime, I have noticed that indeed the HorizontalContentAlignment is reset to "Center"(which is its default value) for some reason. I have logged the behavior as a bug at our end so we can review it in more details. You can track its progress on the following link from our Ideas & Feedback portal - Button: [UWP]HorizontalContentAlignment is reset to its default value in Release mode. I have added some points to your account for reporting the undesired behavior. Please subscribe to the public item in order to receive automatic notifications once there is any progress on the matter.

    In the meantime, as a workaround, I have managed to avoid the behavior by subscribing to the Loaded event of the native element in UWP and setting the HorizontalContentAlignment of the Button there:

    [assembly: ExportRenderer(typeof(TestButtons.MyRadButton), typeof(CustomButtonRenderer))]
    namespace TestButtons.UWP.CustomRenderers
    {
        class CustomButtonRenderer : Telerik.XamarinForms.InputRenderer.UWP.ButtonRenderer
        {
            protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
            {
                base.OnElementChanged(e);
                this.Control.Loaded += Control_Loaded;
            }
            private void Control_Loaded(object sender, Windows.UI.Xaml.RoutedEventArgs e)
            {
                (this.Element as RadButton).HorizontalContentAlignment = TextAlignment.Start;
            }
        }
    }
    Note that, in order to use a custom renderer for the RadButton, you need to create a custom class that inherits the RadButton one and eventually target this class in the custom renderer. This is a small limitation of the control as it inherits from the default Button class. Please have a look at the attached sample for more reference.

    Would such approach work for you?

    Have a great week.

    Regards,
    Stefan Nenchev
    Progress Telerik
    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 Feedback Portal and vote to affect the priority of the items
  3. Daniel
    Daniel avatar
    11 posts
    Member since:
    Dec 2017

    Posted 06 Mar 2018 in reply to Stefan Nenchev Link to this post

    Hi Stefan,

    your workaround is working for us. We will track the progress of the bug report.

    Thank you very much and best regards,

    Daniel

Back to Top