Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add custom corner radius for PaymentButtons #229

Merged
merged 7 commits into from
Jan 4, 2024
Merged

Add custom corner radius for PaymentButtons #229

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
820ef4b
Add custom case for PaymentButonEdges
vradopp Dec 14, 2023
551ce8e
Remove unused combine import
vradopp Dec 15, 2023
fafb929
Add changelog entry
vradopp Dec 15, 2023
e1008cf
Add Equatable conformance to PaymentButtonEdges
vradopp Dec 15, 2023
2659d64
lowercase unreleased for CI
vradopp Jan 4, 2024
eb0bd69
Rename Id to ID
vradopp Jan 4, 2024
9c4da93
Merge branch 'main' into button-corner-radius
vradopp Jan 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@

# PayPal iOS SDK Release Notes

## Unreleased
vradopp marked this conversation as resolved.
Show resolved Hide resolved
* PaymentButtons
* Add `custom` case for `PaymentButtonEdges`

## 1.1.0 (2023-11-16)
* PayPalNativePayments
* Bump `PayPalCheckout` to `1.2.0`
Expand Down
2 changes: 1 addition & 1 deletion Demo/Demo/Extensions/PaymentButtonEnums+Extension.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ extension PayPalCreditButton.Color: CaseIterable {
extension PaymentButtonEdges: CaseIterable {

public static var allCases: [PaymentButtonEdges] {
[.hardEdges, .softEdges, .rounded]
[.hardEdges, .softEdges, .rounded, .custom(10)]
}

static func allCasesAsString() -> [String] {
Expand Down
8 changes: 7 additions & 1 deletion Demo/Demo/SwiftUIComponents/SwiftUIPaymentButtonDemo.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ struct SwiftUIPaymentButtonDemo: View {
@State private var edgesIndex = 0
private var edges = PaymentButtonEdges.allCasesAsString()
@State private var selectedEdge = PaymentButtonEdges.allCases[0]
@State private var customEdge: Int = 10

@State private var sizesIndex = 1
private var sizes = PaymentButtonSize.allCasesAsString()
Expand Down Expand Up @@ -63,7 +64,12 @@ struct SwiftUIPaymentButtonDemo: View {
selectedEdge = PaymentButtonEdges.allCases[edgesIndex]
buttonId += 1
}

Stepper("Custom Corner Radius: \(customEdge)", value: $customEdge, in: 0...100).onChange(of: customEdge) { _ in
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Very neat!

if selectedEdge.description == "custom" {
selectedEdge = PaymentButtonEdges.custom(CGFloat(customEdge))
buttonId += 1
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

curious q: is button ID used by SwiftUI to re-render?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
buttonId += 1
buttonID += 1

Also side note our team uses ID naming convention for iOS.

Copy link
Contributor Author

@vradopp vradopp Jan 4, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

curious q: is button ID used by SwiftUI to re-render?

Yeah the views use the buttonId as their .id() and it triggers a re-render

Also side note our team uses ID naming convention for iOS.

It was already declared I can change it though

}
}
Picker("sizes", selection: $sizesIndex) {
ForEach(sizes.indices, id: \.self) { index in
Text(sizes[index])
Expand Down
11 changes: 10 additions & 1 deletion Sources/PaymentButtons/PaymentButtonEdges.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import UIKit

/// Edges for the smart payment button, these affect the corner radius.
public enum PaymentButtonEdges: Int {
public enum PaymentButtonEdges: Equatable {

/// Hard edges on button with 0 corner radius.
case hardEdges
Expand All @@ -12,6 +12,9 @@ public enum PaymentButtonEdges: Int {
/// Pill shaped corner radius.
case rounded

/// Custom corner radius.
case custom(CGFloat)

func cornerRadius(for view: UIView) -> CGFloat {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
func cornerRadius(for view: UIView) -> CGFloat {
func cornerRadius(for buttonSize: CGRect) -> CGFloat {

🧶 : Might be overkill, but it would remove need for import UIKit for this enum.

switch self {
case .hardEdges:
Expand All @@ -22,6 +25,9 @@ public enum PaymentButtonEdges: Int {

case .rounded:
return view.frame.size.height / 2

case .custom(let cornerRadius):
return min(cornerRadius, view.frame.size.height / 2)
}
}
public var description: String {
Expand All @@ -34,6 +40,9 @@ public enum PaymentButtonEdges: Int {

case .rounded:
return "rounded"

case .custom:
return "custom"
}
}
}
Loading