iOS文字间距对齐

51 篇文章 0 订阅
这篇博客介绍了如何使用Swift编程语言创建一个自定义视图,用于展示订单选项信息,如‘支付方式’及其具体内容。通过设置文字间距和属性字符串,实现了灵活适配不同长度的选项名称,确保布局美观。示例代码展示了如何创建订单选项视图,并调用该函数展示‘支付方式’为‘微信支付’的例子。
摘要由CSDN通过智能技术生成

在这里插入图片描述
用的是比较笨的办法,通过设置文字间距来实现,直接来代码

/// 创建订单选项视图
    /// - Parameters:
    ///   - itemName: 选项名称,如:手机号 下单时间
    ///   - contentStr: 选项对应的具体值
    ///   - count: 选项名称的文字个数,如 手机号有3个文字,下单时间有4个文字
    /// - Returns: 创建好的视图
    func createOrderItemInfoView(itemName: String, contentStr: String, count: Int) -> UIView {
        let contentView = UIView()
        contentView.backgroundColor = .white
        // 选项名称
        let itemLabel = UILabel(text: itemName, textColor: normalNineColor, font: UIFont.pingFangSCRegular(size: 14))
        itemLabel.tag = 1001
        contentView.addSubview(itemLabel)
        itemLabel.snp_makeConstraints { (make) in
            make.left.equalToSuperview().offset(15)
            make.centerY.equalToSuperview()
        }

        // 单个文字的宽度,设置为和字号差不多就行
        let unit_w: CGFloat = 15
        // 计算字间距
        // 60 = unit_w * 4  最大长度度,即要显示的选项标题最大字数 例如:手机号=3 下单时间=4
        let word_space = (60 - (CGFloat(count) * unit_w)) / CGFloat(count - 1)
        // 设置间距
        let attributeStr = NSMutableAttributedString(string: itemName)
        attributeStr.addAttribute(.kern, value: word_space, range: NSRange(location: 0, length: itemName.count))
        itemLabel.attributedText = attributeStr
        
        // 冒号
        let colonLabel = UILabel(text: ":", textColor: normalNineColor, font: UIFont.pingFangSCRegular(size: 14))
        contentView.addSubview(colonLabel)
        colonLabel.snp_makeConstraints { (make) in
            // 注意要减去间距
            make.left.equalTo(itemLabel.snp_right).offset(-word_space)
            make.centerY.equalTo(itemLabel)
        }
        
        // 选项对应的值
        let contentLabel = UILabel(text: contentStr, textColor: normalThreeColor, font: UIFont.pingFangSCRegular(size: 14))
        contentLabel.tag = 1002
        contentView.addSubview(contentLabel)
        contentLabel.snp_makeConstraints { (make) in
            make.left.equalToSuperview().offset(99)
            make.centerY.equalToSuperview()
        }
        return contentView
    }

调用

createOrderItemInfoView(itemName: "支付方式", contentStr: "微信支付", count: 4)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值