照片墙案例和数据视图

照片墙案例和数据视图

照片墙案例

照片墙就是手机相册中的图片展示形式，且可以点击互动
但本质上还是对前面学习的控件的使用
这里注意一下新出现的手势控件
UITapGestureRecognizer* tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(pressTap)] ;//创建一个点击手势
tap.numberOfTapsRequired = 1 ;//触发事件的点击次数
tap.numberOfTouchesRequired = 1 ;//触发事件的点击手指数量
该控件运用于手势交互

//
//  VCRoot.m
//  照片墙案例
//
//  Created by 朱敬业 on 2023/6/4.
//

#import "VCRoot.h"
#import "VCimageShow.h"
@interface VCRoot ()

@end

@implementation VCRoot

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    self.title = @"照片墙" ;
    self.navigationController.navigationBar.translucent = NO ;
    self.navigationController.navigationBar.backgroundColor = UIColor.whiteColor ;
    self.navigationController.navigationBar.barTintColor = UIColor.purpleColor ;
    UIScrollView* sv = [[UIScrollView alloc] init] ;
    sv.frame = CGRectMake(5, 10, 300, 480) ;//坐标从导航栏下面开始算
    sv.contentSize = CGSizeMake(300, 480 * 1.5) ;
    sv.userInteractionEnabled = YES ;//开启用户交互
    sv.backgroundColor = UIColor.whiteColor ;
    for (int i = 0; i < 15; i++) {
        NSString* str = [NSString stringWithFormat:@"%d.jpeg", i + 1] ;
        UIImage* image = [UIImage imageNamed:str] ;
        UIImageView* view = [[UIImageView alloc] initWithImage:image] ;
        view.frame = CGRectMake(3 + (i % 3) * 100, 5 + (i / 3) * 140, 90, 130) ;//注意照片墙的布局
        [sv addSubview:view] ;
        view.userInteractionEnabled = YES ;
        UITapGestureRecognizer* tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(pressTap)] ;//创建一个点击手势
        tap.numberOfTapsRequired = 1 ;//触发事件的点击次数
        tap.numberOfTouchesRequired = 1 ;//触发事件的点击手指数量
        [view addGestureRecognizer:tap] ;
    }
    [self.view addSubview:sv] ;
}

- (void)pressTap {
    VCimageShow* vc = [[VCimageShow alloc] init] ;
    UIImageView* iview = (UIImageView*) tap.view ;
}
/*
#pragma mark - Navigation

// In a storyboard-based application, you will often want to do a little preparation before navigation
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    // Get the new view controller using [segue destinationViewController].
    // Pass the selected object to the new view controller.
}
*/

@end

理解之前控件学习的使用，难点在于照片墙布局的算法
且一定要把滑动视图的用户交互开启

数据视图UITableView

数据视图常常用于同类型选项的展示，也就好是单元格
首先，数据视图的使用一定要设置普通代理和数据库代理且代理类也要实现代理协议
，然后数据库协议一定要实现三个方法，下面有
，最后对单元格进行设置
代码如下

//
//  ViewController.m
//  UITableView
//
//  Created by 朱敬业 on 2023/6/5.
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    _tableview = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStyleGrouped] ;
    _tableview.delegate = self ;
    _tableview.dataSource = self ;
    [self.view addSubview:_tableview] ;
}
//获取每组元素的行数（个数）
//程序在显示视图时会调用该函数
//返回值：每组元素的个数，p1:数据视图对象本身 p2:那一组需要的行数
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 5 ;
}
//设置数据视图的组数
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 3 ;
}
//创建单元格对象函数
//p2:传入数据视图的行数和组数
- (UITableViewCell*) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    NSString* cellStr = @"cell" ;
    //创建单元格对象
    UITableViewCell* cell = [_tableview dequeueReusableCellWithIdentifier:cellStr] ;
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellStr] ;//p1:单元格的样式 p2:单元格的复用标记 ;
    }
    NSString* str = [NSString stringWithFormat:@"第%ld组，第%ld行",indexPath.section, indexPath.row] ;
    //单元格的文字标签赋值
    cell.textLabel.text = str ;
    return cell;
}

@end

注意注释的重点

以下还有几个可选实现方法

//获取单元格高度
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    return 100;
}
//获取单元格的头部标题
- (NSString*)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {
    return [NSString stringWithFormat:@"头部标题"] ;
}
//尾部标题
- (NSString*)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section {
    return @"尾部标题";
}
//获取头部标题高度
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
    return 40;
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
    return 60;
}

//开启编辑状态
[_tableview setEditing:YES] ;
这也是个常用方法，可以开启编辑状态
接下来是单元格函数

//单元格显示效果函数
- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath {
    //默认显示效果为删除
    //return UITableViewCellEditingStyleDelete | UITableViewCellEditingStyleInsert;//组合状态
    return UITableViewCellEditingStyleDelete;
}
//手指拖动时显示编辑状态,且让该状态可以响应
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
    NSLog(@"Delete!") ;
    [_arrayData removeObjectAtIndex:indexPath.row] ;
    //让数据视图更新
    [_tableview reloadData] ;
}
//选中单元格时调用该函数
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    NSLog(@"该单元格被选中 %ld",indexPath.row);
}
//单元格被取消选中时调用该函数
- (void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath {
    NSLog(@"该单元格被取消选中 %ld %ld",indexPath.section, indexPath.row) ;
}

@end