Question

我的iOS应用开发布局如下。

布局包含以下部分：

合拢工具栏：此view应该像在android中一样工作，即在滚动时必须将其折叠。
标签菜单：这是标签菜单。滑动时，tableview必须根据所选菜单进行更新。在scrolling标签上，菜单必须固定在顶部。
Tableview ：这只是一个tableview，其中包含在标签菜单中选择的菜单中的数据。
底部标签：这是UITabbarMenu。

我尝试了以下方法：

我使用Pagingkit库作为标签菜单。我创建了vProductList的高度（tabbar和tableview的父视图）到设备屏幕的高度。

表视图位于scrollview内时出现问题。问题是tableview和scrollview在滚动时的行为不同。因此，要删除此选项，我首先禁用了tableview的滚动，并在选项卡菜单视图位于屏幕的（0,0）点的情况下以viewDidScroll方法启用了滚动。但是，必须滚动两次才能获得效果。这感觉有些毛病。如何使用这种方法实现平滑滚动？有没有可以解决此问题的库？

Answer 1

这是解决问题的方法。

查看层次结构：

您可以使用UICollectionView创建Tabbar。 UITableView为tab时，selected用于处理数据。要处理UICollectionView和UITableView中的数据，请创建一个ViewModel。这是一个示例，

enum ListType: Int {
    case fruits, animals, vegetables
}

class ViewModel {
    let tabs: [ListType] = [.fruits, .animals, .vegetables]

    let fruits = ["Apple", "Banana", "Grapes", "Papaya", "Apple", "Banana", "Grapes", "Papaya", "Apple", "Banana", "Grapes", "Papaya"]
    let animals = ["Rabbit", "Monkey", "Bear", "Deer", "Rabbit", "Monkey", "Bear", "Deer", "Rabbit", "Monkey", "Bear", "Deer"]
    let vegetables = ["Carrot", "Potato", "Cucumber", "Spinach", "Carrot", "Potato", "Cucumber", "Spinach", "Carrot", "Potato", "Cucumber", "Spinach"]

    func numberOfTabs() -> Int {
        return self.tabs.count
    }

    func tab(at index: Int) -> ListType {
        return self.tabs[index]
    }

    func numberOfRows(for listType: ListType) -> Int {
        switch listType {
        case .fruits: return fruits.count
        case .animals: return animals.count
        case .vegetables: return vegetables.count
        }
    }

    func element(at index: Int, for listType: ListType) -> String? {
        switch listType {
        case .fruits: return fruits[index]
        case .animals: return animals[index]
        case .vegetables: return vegetables[index]
        }
    }
}

在上面的代码中，我创建了

一个enum ListType，用于标识types of tabs中的collectionView和要在tableView中显示的数据。
处理class ViewModel和dataSource的{{1}}的{{1}}。

让我们创建一个collectionView的{{1}}，即

tableView

为UIViewController

添加方法

outlets

class ViewController: UIViewController { @IBOutlet weak var tableView: UITableView! @IBOutlet weak var collectionView: UICollectionView! @IBOutlet weak var collapsingViewHeightConstraint: NSLayoutConstraint! private let viewModel = ViewModel() private var lastContentOffset: CGFloat = 0.0 override func viewDidLoad() { super.viewDidLoad() self.collectionView.selectItem(at: IndexPath(row: 0, section: 0), animated: false, scrollPosition: .left) } }和UITableViewDataSource方法

extension ViewController: UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        if let selectedIndex = self.collectionView.indexPathsForSelectedItems?.first?.row, let listType = ListType(rawValue: selectedIndex) {
            return self.viewModel.numberOfRows(for: listType)
        }
        return 0
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        if let selectedIndex = self.collectionView.indexPathsForSelectedItems?.first?.row, let listType = ListType(rawValue: selectedIndex) {
            let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
            cell.textLabel?.text = self.viewModel.element(at: indexPath.row, for: listType)
            return cell
        }
        return UITableViewCell()
    }
}

要处理UICollectionViewDataSource UICollectionViewDelegate上的extension ViewController: UICollectionViewDataSource, UICollectionViewDelegate { func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return self.viewModel.numberOfTabs() } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! CustomCollectionCell cell.textLabel.text = String(describing: self.viewModel.tab(at: indexPath.row)).capitalized return cell } func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { collectionView.scrollToItem(at: indexPath, at: .centeredHorizontally, animated: true) self.tableView.reloadData() } }，请实施collapsing view方法并根据{{的tableView}处理scroll 1}}，即

scrollViewDidScroll(_:)

如何在iOS中实现以下布局？

1 个答案: