@bm-fe/react-native-ui-components 1.1.3 → 1.1.4

package/ios/Modules/BMUIComponents/BMUIComponents/Classes/Components/AlertView/BMComponentAlertController.swift

@@ -0,0 +1,574 @@
+//
+//  BMComponentAlertController.swift
+//  BMComponents
+//
+//  Created by james on 2025/12/31.
+//
+
+import UIKit
+import BMTheme
+import BMCore
+import SnapKit
+
+// MARK: - Button Style 按钮风格
+public enum BMComponentAlertButtonStyle {
+    /// 主要按钮：渐变色（绿色到亮绿色）
+    case primaryGradient
+    /// 次要按钮：深绿色背景
+    case secondary
+    /// 文本按钮：纯文本，无背景
+    case text
+}
+
+// MARK: - Button Layout 按钮布局方向
+public enum BMComponentAlertButtonLayout {
+    /// 水平排列（左右）
+    case horizontal
+    /// 垂直排列（上下）
+    case vertical
+}
+
+// MARK: - Button Action 按钮动作
+public class BMComponentAlertAction {
+    public let title: String
+    public let style: BMComponentAlertButtonStyle
+    public var handler: ((BMComponentAlertAction) -> Void)?
+    
+    public init(title: String, style: BMComponentAlertButtonStyle, handler: ((BMComponentAlertAction) -> Void)? = nil) {
+        self.title = title
+        self.style = style
+        self.handler = handler
+    }
+}
+
+// MARK: - BMComponentAlertController 主类
+open class BMComponentAlertController: UIViewController {
+    
+    // MARK: - Constants
+    private struct Constants {
+        static let maxContainerWidth = UIScreen.main.bounds.size.width - 38 * 2
+        static let maxContainerHeight = UIScreen.main.bounds.size.height * 0.6
+        static let buttonHeight: CGFloat = 44
+        static let buttonSpacing: CGFloat = 12
+        static let horizontalPadding: CGFloat = 20
+        static let verticalPadding: CGFloat = 24
+        static let titleTopPadding: CGFloat = 20
+        static let titleMessageSpacing: CGFloat = 12
+        static let messageButtonSpacing: CGFloat = 20
+        static let imageSize: CGFloat = 100
+        static let imageTopPadding: CGFloat = 24
+        static let imageTitleSpacing: CGFloat = 16
+        static let cornerRadius: CGFloat = 16
+        static let closeButtonSize: CGFloat = 24
+        static let progressLabelHeight: CGFloat = 20
+    }
+    
+    // MARK: - Properties
+    public var enableDimmingViewTap = true
+    public var needShowCloseBtn = true {
+        didSet {
+            closeBtn.isHidden = !needShowCloseBtn
+        }
+    }
+    
+    /// 按钮布局方向，默认为自动
+    public var buttonLayout: BMComponentAlertButtonLayout = .horizontal {
+        didSet {
+            if isViewLoaded {
+                setupButtons()
+            }
+        }
+    }
+    
+    private let titleText: String?
+    private let messageText: String?
+    private let image: UIImage?
+    private let progressText: String?
+    private var actions: [BMComponentAlertAction] = []
+    
+    // MARK: - UI Components
+    private lazy var bgButton: UIButton = {
+        let button = UIButton(type: .custom)
+        button.addTarget(self, action: #selector(bgButtonClick), for: .touchUpInside)
+        return button
+    }()
+    
+    private lazy var containerView: UIView = {
+        let view = UIView()
+        view.cexTheme.backgroundColor = .drawerBgColor
+        view.layer.cornerRadius = Constants.cornerRadius
+        view.clipsToBounds = true
+        view.layer.cexTheme.borderColor = .borderColor
+        view.layer.borderWidth = 1
+        return view
+    }()
+    
+    private lazy var closeBtn: UIButton = {
+        let btn = UIButton()
+        btn.setImage(UIImage(named: "fun_close")?.withTintColor(BMCexThemeColor.primaryColor.currentUIColor()), for: .normal)
+        btn.addTarget(self, action: #selector(closeAction), for: .touchUpInside)
+        return btn
+    }()
+    
+    private lazy var imageView: UIImageView = {
+        let imageView = UIImageView()
+        imageView.contentMode = .scaleAspectFit
+        imageView.clipsToBounds = true
+        return imageView
+    }()
+    
+    private lazy var titleLabel: UILabel = {
+        let label = UILabel()
+        label.cexTheme.textColor = .primaryColor
+        label.font = UIFont.S1Font
+        label.numberOfLines = 2
+        label.textAlignment = .center
+        return label
+    }()
+    
+    private lazy var messageLabel: UILabel = {
+        let label = UILabel()
+        label.cexTheme.textColor = .primaryColor
+        label.font = UIFont.B2Font
+        label.numberOfLines = 0
+        label.textAlignment = .center
+        return label
+    }()
+    
+    private lazy var progressLabel: UILabel = {
+        let label = UILabel()
+        label.cexTheme.textColor = .primaryColor
+        label.font = UIFont.B2Font
+        label.textAlignment = .center
+        return label
+    }()
+    
+    private lazy var buttonStack: UIStackView = {
+        let stack = UIStackView()
+        stack.axis = .vertical
+        stack.spacing = Constants.buttonSpacing
+        stack.distribution = .fillEqually
+        return stack
+    }()
+    
+    // 存储渐变按钮和对应的渐变层
+    private var gradientButtons: [UIButton: CAGradientLayer] = [:]
+    
+    // MARK: - Initialization
+    public init(title: String? = nil, 
+                message: String? = nil,
+                image: UIImage? = nil,
+                progressText: String? = nil) {
+        self.titleText = title
+        self.messageText = message
+        self.image = image
+        self.progressText = progressText
+        super.init(nibName: nil, bundle: nil)
+        self.modalPresentationStyle = .custom
+//        self.transitioningDelegate = self
+    }
+    
+    required public init?(coder: NSCoder) {
+        fatalError("init(coder:) has not been implemented")
+    }
+    
+    // MARK: - Lifecycle
+    open override func viewDidLoad() {
+        super.viewDidLoad()
+        bgButton.isEnabled = enableDimmingViewTap
+        closeBtn.isHidden = !needShowCloseBtn
+        configUI()
+    }
+    
+    // MARK: - UI Configuration
+    private func configUI() {
+        // 背景
+        view.backgroundColor = UIColor.black.withAlphaComponent(0.7)
+        view.addSubview(bgButton)
+        view.addSubview(containerView)
+        // 关闭按钮
+        containerView.addSubview(closeBtn)
+        closeBtn.snp.makeConstraints { make in
+            make.top.equalToSuperview().offset(20)
+            make.trailing.equalToSuperview().offset(-20)
+            make.width.height.equalTo(Constants.closeButtonSize)
+        }
+        
+        // 图片
+        if let image = image {
+            containerView.addSubview(imageView)
+            imageView.image = image
+            imageView.snp.makeConstraints { make in
+                make.top.equalToSuperview().offset(Constants.imageTopPadding)
+                make.centerX.equalToSuperview()
+                make.width.height.equalTo(Constants.imageSize)
+            }
+        }
+        
+        // 标题
+        if let title = titleText {
+            containerView.addSubview(titleLabel)
+            titleLabel.text = title
+            titleLabel.snp.makeConstraints { make in
+                if image != nil {
+                    make.top.equalTo(imageView.snp.bottom).offset(Constants.imageTitleSpacing)
+                } else {
+                    make.top.equalToSuperview().offset(Constants.titleTopPadding)
+                }
+                make.leading.equalToSuperview().offset(Constants.horizontalPadding)
+                make.trailing.equalToSuperview().offset(-Constants.horizontalPadding)
+            }
+        }
+        
+        // 描述
+        if let message = messageText {
+            containerView.addSubview(messageLabel)
+            messageLabel.text = message
+            messageLabel.snp.makeConstraints { make in
+                if titleText != nil {
+                    make.top.equalTo(titleLabel.snp.bottom).offset(Constants.titleMessageSpacing)
+                } else if image != nil {
+                    make.top.equalTo(imageView.snp.bottom).offset(Constants.imageTitleSpacing)
+                } else {
+                    make.top.equalToSuperview().offset(Constants.titleTopPadding)
+                }
+                make.leading.equalToSuperview().offset(Constants.horizontalPadding)
+                make.trailing.equalToSuperview().offset(-Constants.horizontalPadding)
+            }
+        }
+        
+        // 进度指示器
+        if let progress = progressText {
+            containerView.addSubview(progressLabel)
+            progressLabel.text = progress
+            progressLabel.snp.makeConstraints { make in
+                if messageText != nil {
+                    make.top.equalTo(messageLabel.snp.bottom).offset(8)
+                } else if titleText != nil {
+                    make.top.equalTo(titleLabel.snp.bottom).offset(Constants.titleMessageSpacing)
+                } else {
+                    make.top.equalToSuperview().offset(Constants.titleTopPadding)
+                }
+                make.leading.equalToSuperview().offset(Constants.horizontalPadding)
+                make.trailing.equalToSuperview().offset(-Constants.horizontalPadding)
+                make.height.equalTo(Constants.progressLabelHeight)
+            }
+        }
+        
+        // 按钮
+        containerView.addSubview(buttonStack)
+        setupButtons()
+        
+        // 布局约束
+        bgButton.snp.makeConstraints { make in
+            make.edges.equalToSuperview()
+        }
+        
+        containerView.snp.makeConstraints { make in
+            make.center.equalToSuperview()
+            make.width.equalTo(Constants.maxContainerWidth)
+            make.width.lessThanOrEqualTo(Constants.maxContainerWidth)
+        }
+        
+        buttonStack.snp.makeConstraints { make in
+            let topView: UIView
+            if progressText != nil {
+                topView = progressLabel
+            } else if messageText != nil {
+                topView = messageLabel
+            } else if titleText != nil {
+                topView = titleLabel
+            } else if image != nil {
+                topView = imageView
+            } else {
+                topView = containerView
+            }
+            
+            make.top.equalTo(topView.snp.bottom).offset(Constants.messageButtonSpacing)
+            make.leading.equalToSuperview().offset(Constants.horizontalPadding)
+            make.trailing.equalToSuperview().offset(-Constants.horizontalPadding)
+            make.bottom.equalToSuperview().offset(-Constants.verticalPadding)
+        }
+    }
+    
+    // MARK: - Button Setup
+    private func setupButtons() {
+        // 清除现有按钮
+        buttonStack.arrangedSubviews.forEach { $0.removeFromSuperview() }
+        gradientButtons.removeAll()
+        guard !actions.isEmpty else { return }
+        // 确定布局方向
+        let layoutAxis: NSLayoutConstraint.Axis
+        switch buttonLayout {
+        case .horizontal:
+            layoutAxis = .horizontal
+        case .vertical:
+            layoutAxis = .vertical
+        }
+        // 创建按钮容器
+        if layoutAxis == .horizontal {
+            // 水平布局：创建水平 StackView
+            let buttonContainer = UIStackView()
+            buttonContainer.axis = .horizontal
+            buttonContainer.spacing = Constants.buttonSpacing
+            buttonContainer.distribution = .fillEqually
+            actions.forEach { action in
+                let button = createButton(for: action, needsHeightConstraint: false)
+                buttonContainer.addArrangedSubview(button)
+            }
+            buttonStack.addArrangedSubview(buttonContainer)
+            buttonContainer.snp.makeConstraints { make in
+                make.height.equalTo(Constants.buttonHeight)
+            }
+        } else {
+            // 垂直布局：直接添加到 buttonStack
+            actions.forEach { action in
+                let button = createButton(for: action, needsHeightConstraint: true)
+                buttonStack.addArrangedSubview(button)
+            }
+        }
+        // 更新布局
+        view.setNeedsLayout()
+        view.layoutIfNeeded()
+    }
+    
+    private func createButton(for action: BMComponentAlertAction, needsHeightConstraint: Bool) -> UIButton {
+        let button = UIButton(type: .custom)
+        button.setTitle(action.title, for: .normal)
+        button.layer.cornerRadius = 8
+        button.clipsToBounds = true
+        
+        switch action.style {
+        case .primaryGradient:
+            // 渐变色主要按钮
+            button.cexTheme.backgroundColor = .brandColor
+            button.cexTheme.setTitleColor(.btnTextColor, for: .normal)
+            button.titleLabel?.font = UIFont.S1Font
+        case .secondary:
+            // 深绿色次要按钮
+            button.cexTheme.backgroundColor = .brandBgColor
+            button.cexTheme.setTitleColor(.brandColor, for: .normal)
+            button.titleLabel?.font = UIFont.S1Font
+        case .text:
+            // 文本按钮
+            button.backgroundColor = .clear
+            button.cexTheme.setTitleColor(.primaryColor, for: .normal)
+            button.titleLabel?.font = UIFont.S4Font
+        }
+        // 根据布局方向决定是否需要高度约束
+        // 水平布局时，容器统一管理高度；垂直布局时，每个按钮需要单独设置高度
+        if needsHeightConstraint {
+            button.snp.makeConstraints { make in
+                make.height.equalTo(Constants.buttonHeight)
+            }
+        }
+        button.onTap { [weak self] in
+            self?.dismiss(animated: true) {
+                action.handler?(action)
+            }
+        }
+        
+        return button
+    }
+    
+
+    
+    open override func viewDidLayoutSubviews() {
+        super.viewDidLayoutSubviews()
+        // 更新所有渐变按钮的渐变层frame
+        gradientButtons.forEach { button, gradientLayer in
+            gradientLayer.frame = button.bounds
+        }
+    }
+    
+    // MARK: - Actions
+    @objc private func bgButtonClick() {
+        if enableDimmingViewTap {
+            dismiss(animated: true, completion: nil)
+        }
+    }
+    
+    @objc private func closeAction() {
+        dismiss(animated: true, completion: nil)
+    }
+    
+    // MARK: - Public Methods
+    public func addAction(_ action: BMComponentAlertAction) {
+        actions.append(action)
+        // 如果 view 已经加载，立即更新按钮
+        if isViewLoaded {
+            setupButtons()
+        }
+    }
+}
+
+// MARK: - UIViewControllerTransitioningDelegate
+//extension BMComponentAlertController: UIViewControllerTransitioningDelegate {
+//    public func animationController(forPresented presented: UIViewController, presenting: UIViewController, source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
+//        return AlertAnimatedTransitioning()
+//    }
+//
+//    public func animationController(forDismissed dismissed: UIViewController) -> UIViewControllerAnimatedTransitioning? {
+//        return AlertAnimatedTransitioning()
+//    }
+//}
+
+// MARK: - Convenience Methods 便捷方法
+public extension BMComponentAlertController {
+    /// 便捷方法：创建并显示一个简单的弹窗
+    /// - Parameters:
+    ///   - title: 标题
+    ///   - message: 描述信息
+    ///   - image: 图片（可选）
+    ///   - progressText: 进度文本（可选）
+    ///   - primaryActionTitle: 主要按钮标题
+    ///   - primaryActionHandler: 主要按钮回调
+    ///   - secondaryActionTitle: 次要按钮标题（可选）
+    ///   - secondaryActionHandler: 次要按钮回调（可选）
+    ///   - textActionTitle: 文本按钮标题（可选）
+    ///   - textActionHandler: 文本按钮回调（可选）
+    ///   - buttonLayout: 按钮布局方向（默认自动）
+    ///   - showCloseButton: 是否显示关闭按钮
+    ///   - enableDimmingTap: 是否允许点击背景关闭
+    ///   - from: 显示的视图控制器
+    static func show(
+        title: String? = nil,
+        message: String? = nil,
+        image: UIImage? = nil,
+        progressText: String? = nil,
+        primaryActionTitle: String,
+        primaryActionHandler: ((BMComponentAlertAction) -> Void)? = nil,
+        secondaryActionTitle: String? = nil,
+        secondaryActionHandler: ((BMComponentAlertAction) -> Void)? = nil,
+        textActionTitle: String? = nil,
+        textActionHandler: ((BMComponentAlertAction) -> Void)? = nil,
+        buttonLayout: BMComponentAlertButtonLayout = .horizontal,
+        showCloseButton: Bool = true,
+        enableDimmingTap: Bool = true,
+        from viewController: UIViewController
+    ) {
+        let alert = BMComponentAlertController(
+            title: title,
+            message: message,
+            image: image,
+            progressText: progressText
+        )
+        
+        alert.needShowCloseBtn = showCloseButton
+        alert.enableDimmingViewTap = enableDimmingTap
+        alert.buttonLayout = buttonLayout
+        
+        // 添加主要按钮
+        let primaryAction = BMComponentAlertAction(
+            title: primaryActionTitle,
+            style: .primaryGradient,
+            handler: primaryActionHandler
+        )
+        alert.addAction(primaryAction)
+        
+        // 添加次要按钮（如果提供）
+        if let secondaryTitle = secondaryActionTitle {
+            let secondaryAction = BMComponentAlertAction(
+                title: secondaryTitle,
+                style: .secondary,
+                handler: secondaryActionHandler
+            )
+            alert.addAction(secondaryAction)
+        }
+        
+        // 添加文本按钮（如果提供）
+        if let textTitle = textActionTitle {
+            let textAction = BMComponentAlertAction(
+                title: textTitle,
+                style: .text,
+                handler: textActionHandler
+            )
+            alert.addAction(textAction)
+        }
+        
+        viewController.present(alert, animated: true)
+    }
+}
+
+/*
+ 使用示例：
+ 
+ // 示例1: 单按钮弹窗（渐变色主要按钮）
+ BMComponentAlertController.show(
+     title: "Title",
+     message: "This is a text description.",
+     primaryActionTitle: "Button",
+     primaryActionHandler: { action in
+         print("Primary button tapped")
+     },
+     from: self
+ )
+ 
+ // 示例2: 双按钮并排布局（自动，默认行为）
+ BMComponentAlertController.show(
+     title: "Title",
+     message: "This is a text description.",
+     primaryActionTitle: "Confirm",
+     primaryActionHandler: { action in
+         print("Confirm tapped")
+     },
+     secondaryActionTitle: "Cancel",
+     secondaryActionHandler: { action in
+         print("Cancel tapped")
+     },
+     from: self
+ )
+ 
+ // 示例2b: 双按钮垂直排列（手动指定）
+ BMComponentAlertController.show(
+     title: "Title",
+     message: "This is a text description.",
+     primaryActionTitle: "Confirm",
+     primaryActionHandler: { action in
+         print("Confirm tapped")
+     },
+     secondaryActionTitle: "Cancel",
+     secondaryActionHandler: { action in
+         print("Cancel tapped")
+     },
+     buttonLayout: .vertical,  // 强制垂直排列
+     from: self
+ )
+ 
+ // 示例3: 多按钮堆叠布局（包含文本按钮）
+ let alert = BMComponentAlertController(
+     title: "Title",
+     message: "This is a text description of a dialog Lorem ipsum.",
+     progressText: "1/2"
+ )
+ alert.needShowCloseBtn = true
+ alert.buttonLayout = .vertical  // 明确指定垂直布局
+ alert.addAction(BMComponentAlertAction(title: "Button", style: .secondary) { action in
+     print("Secondary button tapped")
+ })
+ alert.addAction(BMComponentAlertAction(title: "Button", style: .primaryGradient) { action in
+     print("Primary gradient button tapped")
+ })
+ alert.addAction(BMComponentAlertAction(title: "Button Text", style: .text) { action in
+     print("Text button tapped")
+ })
+ present(alert, animated: true)
+ 
+ // 示例4: 多个按钮水平排列
+ let alert2 = BMComponentAlertController(title: "Title", message: "Message")
+ alert2.buttonLayout = .horizontal  // 强制水平排列
+ alert2.addAction(BMComponentAlertAction(title: "Button 1", style: .secondary))
+ alert2.addAction(BMComponentAlertAction(title: "Button 2", style: .primaryGradient))
+ alert2.addAction(BMComponentAlertAction(title: "Button 3", style: .text))
+ present(alert2, animated: true)
+ 
+ // 示例5: 带图片的弹窗
+ BMComponentAlertController.show(
+     title: "Title",
+     message: "This is a text description.",
+     image: UIImage(named: "example_image"),
+     primaryActionTitle: "Button",
+     primaryActionHandler: { _ in },
+     from: self
+ )
+ */

package/ios/Modules/BMUIComponents/BMUIComponents/Classes/Components/Buttons/BMComponentButton+Examples.swift

@@ -0,0 +1,77 @@
+//
+//  BMComponentButton+Examples.swift
+//  BMComponents
+//
+//  Created by james on 2025/12/31.
+//  使用示例和便捷方法
+//
+
+import UIKit
+
+// MARK: - Convenience Methods
+
+public extension BMComponentButton {
+    
+    /// 创建主色按钮
+    static func primary(title: String? = nil, icon: UIImage? = nil,size: BMComponentButtonSize = .Medium,iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButton {
+        let config = BMComponentButtonConfiguration.primary(size: size, iconPosition: iconPosition)
+        return BMComponentButton(title: title,icon: icon,configuration: config)
+    }
+    
+    /// 创建次要按钮
+    static func secondary(title: String? = nil,icon: UIImage? = nil,size: BMComponentButtonSize = .Medium,iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButton {
+        let config = BMComponentButtonConfiguration.secondary(size: size, iconPosition: iconPosition)
+        return BMComponentButton(title: title,icon: icon,configuration: config)
+    }
+    
+    /// 创建买入按钮（绿色）
+    static func buyButton(title: String? = nil,icon: UIImage? = nil,size: BMComponentButtonSize = .Medium,iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButton {
+        let config = BMComponentButtonConfiguration.buy(size: size, iconPosition: iconPosition)
+        return BMComponentButton(title: title,icon: icon,configuration: config)
+    }
+    
+    /// 创建卖出按钮（红色）
+    static func sellButton(title: String? = nil,icon: UIImage? = nil,size: BMComponentButtonSize = .Medium,iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButton {
+        let config = BMComponentButtonConfiguration.sell(size: size, iconPosition: iconPosition)
+        return BMComponentButton(title: title,icon: icon,configuration: config)
+    }
+ 
+    /// 创建灰色按钮
+    static func whiteButton(title: String? = nil,icon: UIImage? = nil,size: BMComponentButtonSize = .Medium,iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButton {
+        let config = BMComponentButtonConfiguration.white(size: size, iconPosition: iconPosition)
+        return BMComponentButton(title: title,icon: icon,configuration: config)
+    }
+    
+}
+
+
+// MARK: - Preset Configurations
+public extension BMComponentButtonConfiguration {
+    
+    /// 主色按钮（标准样式）
+    static func primary(size: BMComponentButtonSize = .Medium, iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButtonConfiguration {
+       return BMComponentButtonConfiguration(type: .primary,size: size, iconPosition: iconPosition)
+    }
+    
+    /// 次要按钮（标准样式）
+    static func secondary(size: BMComponentButtonSize = .Medium, iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButtonConfiguration {
+        return  BMComponentButtonConfiguration(type: .secondary, size: size, iconPosition: iconPosition)
+    }
+    
+    /// 买入按钮（标准样式）
+    static func buy(size: BMComponentButtonSize = .Medium, iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButtonConfiguration {
+        return BMComponentButtonConfiguration(type: .green, size: size, iconPosition: iconPosition)
+    }
+    
+    /// 卖出按钮（标准样式）
+    static func sell(size: BMComponentButtonSize = .Medium, iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButtonConfiguration {
+        return BMComponentButtonConfiguration(type: .red,size: size, iconPosition: iconPosition)
+    }
+    
+    /// 灰色按钮（标准样式）
+    static func white(size: BMComponentButtonSize = .Medium, iconPosition: BMComponentButtonIconPosition = .leading) -> BMComponentButtonConfiguration {
+        return BMComponentButtonConfiguration(type: .white,size: size, iconPosition: iconPosition)
+    }
+}
+ 
+