collectionview与水平滚动与多个部分

我想开发这样的屏幕(目标C): 在这里输入图像说明

在这里有部分名称:

  1. 我们爱的新游戏
  2. 我们爱的新应用程序

两者都有水平滚动和相互独立。

我的问题是我应该用什么方式来实现这个从下面两个选项。 请提供任何参考样本(如果有):

  1. 我可以用单个UICollectionView实现相同的行为,并具有不同的部分(dynamic)。 但不同部分的卷轴应该是独立的。 因为有可能第1部分可能具有不同数量的项目(行),第2部分可能具有不同数量的项目(行)
  2. 我必须采取多个collectionview以编程方式插入然后在uiscrollview(垂直scrollview)。 abd然后定义水平滚动并通过收集collectionview来添加单元格中的项目。

目前我用下面的代码做了水平滚动的collectionview:

 - (void)viewDidLoad { [super viewDidLoad]; self.view = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; UICollectionViewFlowLayout *layout=[[UICollectionViewFlowLayout alloc] init]; _collectionView=[[UICollectionView alloc] initWithFrame:self.view.frame collectionViewLayout:layout]; [_collectionView setDataSource:self]; [_collectionView setDelegate:self]; [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cellIdentifier"]; [_collectionView setBackgroundColor:[UIColor redColor]]; [self.view addSubview:_collectionView]; // Do any additional setup after loading the view, typically from a nib. } #pragma mark Collection View Methods - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return 15; } // The cell that is returned must be retrieved from a call to -dequeueReusableCellWithReuseIdentifier:forIndexPath: - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { UICollectionViewCell *cell=[collectionView dequeueReusableCellWithReuseIdentifier:@"cellIdentifier" forIndexPath:indexPath]; cell.backgroundColor=[UIColor greenColor]; return cell; } - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { return CGSizeMake(50, 50); } 

请帮忙。

你想要做的并不是那么困难。 我已经创build了你所看到的原型。 这是你的storyboard's view controller和它的文档大纲如何:

故事板

这是每个组件的代码

TableViewController

 class TableViewController: UIViewController, UITableViewDataSource, UITableViewDelegate { @IBOutlet weak var tableView: UITableView! override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view. } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. } func numberOfSections(in tableView: UITableView) -> Int { return 5 } func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return 1 } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "tableCell", for: indexPath) as! MyTableViewCell return cell } func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { return 160 } func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? { return (section%2 == 0) ? "Games we love" : "Apps we love" } } 

MyTableViewCell

 class MyTableViewCell: UITableViewCell, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout { @IBOutlet weak var collectionView: UICollectionView! let imageNames = ["candy_crush", "cut_the_ropes", "game_1", "little_pet_shop", "zuba"] let gameNames = ["Candy Crush", "Cut the Ropes", "Arbitrary Game 1", "Littlest Pet Shop", "Zuba"] override func awakeFromNib() { super.awakeFromNib() // Initialization code } override func setSelected(_ selected: Bool, animated: Bool) { super.setSelected(selected, animated: animated) // Configure the view for the selected state } func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return imageNames.count } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "collectionCell", for: indexPath) as! MyCollectionViewCell cell.imageView.image = UIImage.init(named: imageNames[indexPath.row]) cell.titleLabel.text = gameNames[indexPath.row] cell.detailLabel.text = "Games" return cell } } 

MyCollectionViewCell

 class MyCollectionViewCell: UICollectionViewCell { @IBOutlet weak var imageView: UIImageView! @IBOutlet weak var titleLabel: UILabel! @IBOutlet weak var detailLabel: UILabel! } 

这是它在模拟器上的样子

在这里输入图像说明