swift code demo

import UIKit

class RunningSectionViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {

let sectionTitle = UILabel()
var buttons: [UIButton] = []
let collectionView = UICollectionView(frame: .zero, collectionViewLayout: UICollectionViewFlowLayout())
let moreDataButton = UIButton()

let metrics = ["公里数", "用时", "配速", "心率", "步频"]
var data = [[String]]()

override func viewDidLoad() {
    super.viewDidLoad()
    setupUI()
    generateDummyData()
}

func setupUI() {
    view.backgroundColor = .white
    
    // Section title
    sectionTitle.text = "分段"
    sectionTitle.font = UIFont.boldSystemFont(ofSize: 16)
    sectionTitle.frame = CGRect(x: 20, y: 40, width: 100, height: 20)
    view.addSubview(sectionTitle)
    
    // Buttons
    let buttonTitles = ["自动", "1公里", "5公里", "10公里"] // Assuming '自动' or '手动' is decided elsewhere
    let distances = [0, 1, 5, 10] // Example distances
    let userDistance = 6 // Example distance the user ran
    
    var xPosition = 20
    for (index, title) in buttonTitles.enumerated() {
        if (index == 0 || distances[index] <= userDistance) {
            let button = UIButton(frame: CGRect(x: xPosition, y: 70, width: 50, height: 30))
            button.setTitle(title, for: .normal)
            button.backgroundColor = .lightGray
            button.setTitleColor(.black, for: .normal)
            button.layer.cornerRadius = 5
            button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
            view.addSubview(button)
            buttons.append(button)
            xPosition += 60 // Adjust spacing based on design
        }
    }
    
    // CollectionView
    if let layout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
        layout.itemSize = CGSize(width: view.frame.width / 5 - 1, height: 40)
        layout.minimumInteritemSpacing = 1
        layout.minimumLineSpacing = 1
    }
    collectionView.dataSource = self
    collectionView.delegate = self
    collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "cell")
    collectionView.backgroundColor = .white
    collectionView.frame = CGRect(x: 0, y: 110, width: view.frame.width, height: 240)
    view.addSubview(collectionView)
    
    // More data button
    moreDataButton.setTitle("查看更多数据", for: .normal)
    moreDataButton.setTitleColor(.green, for: .normal)
    moreDataButton.frame = CGRect(x: 20, y: 360, width: view.frame.width - 40, height: 30)
    moreDataButton.addTarget(self, action: #selector(moreDataTapped), for: .touchUpInside)
    view.addSubview(moreDataButton)
}

func generateDummyData() {
    for _ in 1...5 {
        data.append(metrics.map { "\($0)\(Int.random(in: 1...100))" })
    }
}

@objc func buttonTapped(_ sender: UIButton) {
    print("Button tapped: \(sender.title(for: .normal) ?? "")")
}

@objc func moreDataTapped() {
    print("More data tapped")
}

// MARK: - UICollectionViewDataSource Methods
func numberOfSections(in collectionView: UICollectionView) -> Int {
    return 6 // 1 for headers, 5 for data
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return 5 // Five metrics
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath)
    for subview in cell.contentView.subviews {
        subview.removeFromSuperview()
    }
    
    let label = UILabel(frame: cell.bounds)
    label.textAlignment = .center
    label.font = UIFont.systemFont(ofSize: 12)
    
    if indexPath.section == 0 {
        label.text = metrics[indexPath.row]
        label.backgroundColor = .lightGray
    } else {
        label.text = data[indexPath.section - 1][indexPath.row]
        label.backgroundColor = .white
    }
    
    cell.contentView.addSubview(label)
    return cell
}

}