Add SwiftUI Support for Button

[imthath-m]

Platforms Impacted

• iOS
• macOS

Description of changes

Added a new FluentButtonStyle which confirms to SwiftUI.ButtonStyle. This makes it easy to apply fluent styles to any button in SwiftUI.

The behaviour of styles in SwiftUI is slightly different from how we work with custom components in UIKit. Hence, this new FluentButtonStyle does not affect the content inside the button, which can be text, image or both. We can create a separate custom SwiftUI view to mimic the behaviour of the custom UIKit button with regards to images and text.

Binary change

Total increase: 1,50,920 bytes
Total decrease: -920 bytes

File	Before	After	Delta
Total	3,11,49,392 bytes	3,12,99,392 bytes	🛑 1,50,000 bytes

Full breakdown

File	Before	After	Delta
FluentButtonStyle.o	0 bytes	1,27,096 bytes	🛑 1,27,096 bytes
__.SYMDEF	48,86,280 bytes	49,08,664 bytes	⚠️ 22,384 bytes
FocusRingView.o	8,23,392 bytes	8,24,832 bytes	⚠️ 1,440 bytes
Button.o	2,12,528 bytes	2,12,280 bytes	🎉 -248 bytes
ListActionItem.o	2,25,496 bytes	2,24,824 bytes	🎉 -672 bytes

Verification

Compared existing buttons in UIKit with SwiftUI. Looks similar.

Visual Verification

Before	After
Screenshot or description before this change	Screenshot or description with this change

Pull request checklist

This PR has considered:

• Light and Dark appearances
• iOS supported versions (all major versions greater than or equal current target deployment version)
• VoiceOver and Keyboard Accessibility
• Internationalization and Right to Left layouts
• Different resolutions (1x, 2x, 3x)
• Size classes and window sizes (iPhone vs iPad, notched devices, multitasking, different window sizes, etc)
• iPad Pointer interaction
• SwiftUI consumption (validation or new demo scenarios needed)
• Objective-C exposure (provide it only if needed)

Microsoft Reviewers: Open in CodeFlow

[imthath-m]

I am not able to test how the UIKit button responds to keyboard interactions in iPad. I tried but couldn't get control to reach this delegate method and see how it behaves.

So I've not implemented the focus ring view in the new FluentButtonStyle. Would be helpful if anyone can point out what I am missing with regards to focus behaviour.

[mischreiber]

• Implemented in [SwiftUI] FluentButtonStyle #1986