[ios]iosJXSegmentedView使用(连载13)
先看看我们的成果。类似于头条,腾讯视频的顶部滑动切换分类。----
### JXSegmentedView使用
接下里,我们需要做多个tab显示商品分类的页面。
首先我们先来学习基本的使用。
引入`JXSegmentedView`
podfile文件增加
```swift
pod 'JXSegmentedView'
//保存之后,执行安装
pod install
```
等待安装完成,如果网络不好,用手机热点更快。
### 简单的使用案例
在使用之后,先导入组件
```swift
import JXSegmentedView
```
然后就是初始化组件,设置需要显示的tab个数
以下全部代码,都已经增加了注释
```swift
//
//LoadDataViewController.swift
//JXSegmentedView
//
//Created by alice on 2021/3/28.
//
import UIKit
import JXSegmentedView
import SnapKit
class LoadDataViewController: UIViewController {
var segmentedDataSource: JXSegmentedTitleDataSource!
var segmentedView: JXSegmentedView!
var listContainerView: JXSegmentedListContainerView!
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
//直接隐藏bar
navigationController?.setNavigationBarHidden(true, animated: false)
//1、初始化JXSegmentedView
segmentedView = JXSegmentedView()
//2、配置数据源
//segmentedViewDataSource一定要通过属性强持有!!!!!!!!!
segmentedDataSource = JXSegmentedTitleDataSource()
segmentedDataSource.titles = getRandomTitles()
segmentedDataSource.isTitleColorGradientEnabled = true
segmentedView.dataSource = segmentedDataSource
//3、配置指示器
let indicator = JXSegmentedIndicatorLineView()
indicator.indicatorWidth = JXSegmentedViewAutomaticDimension
indicator.lineStyle = .lengthen
segmentedView.indicators =
//4、配置JXSegmentedView的属性
view.addSubview(segmentedView)
//5、初始化JXSegmentedListContainerView
listContainerView = JXSegmentedListContainerView(dataSource: self)
view.addSubview(listContainerView)
//6、将listContainerView.scrollView和segmentedView.contentScrollView进行关联
segmentedView.listContainer = listContainerView
//布局子控件,
segmentedView.snp.makeConstraints { (make) in
//tab的宽度等于屏幕宽度
make.width.equalToSuperview()
//tab高度50
make.height.equalTo(50)
//tab的顶部,在安全区顶部
make.top.equalTo(view.safeAreaLayoutGuide.snp.top)
}
listContainerView.snp.makeConstraints { (mm) in
//可以滑动的容器,在tab的下面,宽度屏幕宽,底部在安全区的最下边
mm.top.equalTo(segmentedView.snp.bottom)
mm.width.equalToSuperview()
mm.bottom.equalTo(view.safeAreaLayoutGuide.snp.bottom)
}
}
@objc func reloadData() {
segmentedDataSource.titles = getRandomTitles()
segmentedView.defaultSelectedIndex = 1
segmentedView.reloadData()
}
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
}
func getRandomTitles() -> {
let titles = ["猴哥", "青蛙王子", "旺财", "粉红猪", "喜羊羊", "黄焖鸡", "小马哥", "牛魔王", "大象先生", "神龙"]
//随机title数量,4~n
let randomCount = Int(arc4random()%7 + 4)
var tempTitles = titles
var resultTitles = ()
for _ in 0..<randomCount {
let randomIndex = Int(arc4random()%UInt32(tempTitles.count))
resultTitles.append(tempTitles)
tempTitles.remove(at: randomIndex)
}
return resultTitles
}
}
extension LoadDataViewController: JXSegmentedListContainerViewDataSource {
func numberOfLists(in listContainerView: JXSegmentedListContainerView) -> Int {
//tab的总个数
return segmentedDataSource.dataSource.count
}
func listContainerView(_ listContainerView: JXSegmentedListContainerView, initListAt index: Int) -> JXSegmentedListContainerViewListDelegate {
//当切换的时候,加载不同的页面
let vc = LoadDataListViewController()
vc.typeString = segmentedDataSource.titles
return vc
}
}
```
这个就是多个tab的开始模样,后面我们会根据网络的分类,分别加载不同分类的数据。
> 下一篇:获取网络的分类数据,显示在tab上面
代码地址:
https://github.com/cat13954/IOSUiTableViewSample canyesh 发表于 2021-3-30 11:07
...那你走什么?
逆向或驱动开发吧{:301_1007:} 现在还走Swift开发IOS的好像很少了{:301_1009:} lyl610abc 发表于 2021-3-30 10:44
现在还走Swift开发IOS的好像很少了
...那你走什么? lyl610abc 发表于 2021-3-30 10:44
现在还走Swift开发IOS的好像很少了
国内的确不多。都是oc为主。
国外情况很多都是swift了。慢慢过渡。
以前不用swift是因为abi问题,年年大改,升级一个版本不能用了。现在swift5开始稳定了,swift5应该是19年发布,到现在swift版本是5.3所以未来应该是趋势吧。
swift ui苹果也在推,是使用swift的。
我不是奔着工作来学习的,所以,我还是直接用swift写吧。现在很多工具lib都支持swift了,虽然去查资料的时候很多都是oc的,不过勉强能看懂吧。
后面有精力再回去回顾下oc也行。 莫问刀 发表于 2021-3-30 14:10
国内的确不多。都是oc为主。
强啊,大佬都有精力玩额外的了{:301_974:} lyl610abc 发表于 2021-3-30 14:13
强啊,大佬都有精力玩额外的了
有时间再说看看oc吧哈哈,先写在日程表上。{:301_1007:}
页:
[1]