Search code examples
xamarinuibuttonxamarin.iosxamarin-studio

Xamarin iOS styling on overriding on a UIButton


I am creating an iOS application (not Xamarin Forms) in Xamarin Studio and I have a question regarding styling. In this particular case I am setting the default appearance of a UIButton using the iOS Appearance API and calling this method from the FinishedLaunching method in the AppDelegate class.

private void SetUserInterfaceStyles()
{
    //UIButton
    UIButton.Appearance.TintColor = UIColor.FromRGB(73, 217, 41);
    UIButton.Appearance.BackgroundColor = UIColor.FromRGB(73, 217, 41);
    UIButton.Appearance.SetTitleColor(UIColor.White, UIControlState.Normal);  
}

Now this works fine but there particular cases where the styling of the button differs from the default size and when setting any of the colours in the storyboard using Xamarin iOS designer the settings are not applied and the defaults from the SetUserInterfaceStyles method are used. Setting the colour in the ViewDidLoad of the ViewController does override the default but I would prefer a designer solution.

Is there a way to have multiple styles defined for a button or a working method to override the default styling in the form designer?


Solution

  • Looks like the recommended method of accomplishing this is not to use the Appearance API but to sub class the UI Button class and then to assign that class to the Storyboard button.

    Something like this...

    public StandardButton(IntPtr handle) : base (handle)
    {
        this.TouchDown += (sender, e) => { SetButtonStyleOnClick(); };
        this.TouchUpInside += (sender, e) => { SetButtonStyleOnClickRelease(); };
    
        this.SetBackgroundImage(new UIImage().FromColour(ApplicationStyles.ButtonBackgroundColourEnabled), UIControlState.Normal);
        this.SetBackgroundImage(new UIImage().FromColour(ApplicationStyles.ButtonBackgroundColourDisabled), UIControlState.Disabled);
    
        this.Layer.CornerRadius = ApplicationStyles.StandardButtonCornerRadius;
        this.ClipsToBounds = true;
    
        this.TintColor = ApplicationStyles.ButtonBackgroundColourEnabled;
        this.SetTitleColor(ApplicationStyles.ButtonTitleColourEnabled, UIControlState.Normal);
        this.SetTitleColor(ApplicationStyles.ButtonTitleColourDisabled, UIControlState.Disabled);
    }
    
    private void SetButtonStyleOnClick()
    {
        var shrink = CGAffineTransform.MakeScale(0.95f, 0.95f);
    
        this.Transform = shrink;
        this.BackgroundColor = ApplicationStyles.ButtonBackgroundColourClicked;           
        UIView.BeginAnimations("shrink", this.Handle);
        UIView.SetAnimationDuration(0.25);
        UIView.SetAnimationDelegate(this);
        UIView.CommitAnimations();
    }
    
    private void SetButtonStyleOnClickRelease()
    {
        CGAffineTransform pop = CGAffineTransform.MakeScale(1.0f, 1.0f);
    
        this.Transform = pop;
        this.BackgroundColor = ApplicationStyles.ButtonBackgroundColourEnabled;           
        UIView.BeginAnimations("pop", this.Handle);
        UIView.SetAnimationDuration(0.25);
        UIView.SetAnimationDelegate(this);
        UIView.CommitAnimations();
    }