【iOS】天气预报仿写总结

首页#

1
[[NSNotificationCenter defaultCenter] addObserver:self
2
                                                 selector:@selector(handleAddCityNotification:)
3
                                                     name:@"AddNewCityNotification"
4
                                                   object:nil];
5
    [[NSNotificationCenter defaultCenter] addObserver:self
6
                                                    selector:@selector(handleDeleteCityNotification:)
7
                                                        name:@"DeleteCityNotification"
8
                                                      object:nil];

接收两个通知，一个是搜索页面的城市，另一个是详情页面的删除指令。

这个页面要执行两个操作：点击加号添加城市，删除城市。

这个左滑删除功能需要两段代码

1
// 添加支持滑动删除
2
- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath {
3
    return YES;
4
}
5

6
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle
7
  forRowAtIndexPath:(NSIndexPath *)indexPath {
8
    if (editingStyle == UITableViewCellEditingStyleDelete) {
9
        /*
10
         要确保是可变数组，不然程序会报错
11
         */
12
        self.cityData = [self.cityData mutableCopy];
13
        self.dicArray = [self.dicArray mutableCopy];
14
        [self.cityData removeObjectAtIndex:indexPath.section];
15
        if (indexPath.section < self.dicArray.count) {
16
            [self.dicArray removeObjectAtIndex:indexPath.section];
17
        }
18
        [tableView deleteSections:[NSIndexSet indexSetWithIndex:indexPath.section]
19
                 withRowAnimation:UITableViewRowAnimationAutomatic];
20
    }
21
}

同时，我不同城市的天气对应着不同的背景图片：

我们在MainVC中向自定义cell传了一个conditionCode（NSInteger），这个数值的范围代表了该地现在的天气。然后在cell中设置背景。

1
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
2
    TextTableViewCell* cell = [tableView dequeueReusableCellWithIdentifier:@"main" forIndexPath:indexPath];
3
    if (indexPath.section < self.dicArray.count) {
4
        NSDictionary* weatherData = self.dicArray[indexPath.section];
5
        NSDictionary *current = weatherData[@"current"];
6
        NSDictionary *condition = current[@"condition"];
7
        NSString *iconURL = condition[@"icon"];
8
        NSString *cityName = self.cityData[indexPath.section][@"name"];
9
        NSString *temp = current[@"temp_c"];
10
        [cell configureWithCity:cityName
11
                          temp:[NSString stringWithFormat:@"%@℃", temp]
12
               weatherIconURL:iconURL
13
                 conditionCode:[condition[@"code"] integerValue]];
14
    }
15
    return cell;
16
}

1
- (void)setBackgroundImageForWeatherCode:(NSInteger)code {
2
    NSString *imageName = @"photo1.jpg";
3
    if (code == 1000) {
4
        imageName = @"photo1.jpg";
5
    }//云
6
    else if (code >= 1003 && code <= 1009) {
7
        imageName = @"photo2.jpg";
8
    }//雨
9
    else if (code >= 1030 && code <= 1282) {
10
        imageName = @"photo3.jpg";
11
    }//雪
12
    else if (code >= 1066 && code <= 1237) {
13
        imageName = @"photo4.jpg";
14
    }//雷
15
    else if (code >= 1273 && code <= 1282) {
16
        imageName = @"photo5.jpg";
17
    }
18
    dispatch_async(dispatch_get_main_queue(), ^{
19
        self->_backgroundImageView.image = [UIImage imageNamed:imageName];
20
    });
21
}

网络请求部分我在另一篇博客中有介绍，在这里不多赘述：

【iOS】网络请求与异步加载_ios imagewithdata 异步-CSDN博客

搜索页面#

我们首先要实现搜索结果随输入内容变化而变化：

我们在.h文件中遵守UISearchBarDelegate，下图为UISearchBarDelegate源码：

然后我们在AddVC中加入如下代码，每次检测到改变都重新刷新tableView

1
- (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText {
2
    if (searchText.length == 0) {
3
        self.searchResults = @[];
4
        //self.searchResults = [[NSArray alloc] init];
5
        [self.tableView reloadData];
6
        return;
7
    }
8
    [self searchCitiesWithKeyword:searchText];
9
}

1
-(void) addCityToMain:(NSDictionary *)cityInfo {
2
    NSString *cityName = cityInfo[@"name"];
3
    NSDictionary *userInfo = @{@"cityName": cityName};
4
    [[NSNotificationCenter defaultCenter] postNotificationName:@"AddNewCityNotification" object:nil userInfo:userInfo];
5

6
    // 关闭添加页面
7
//    [self dismissViewControllerAnimated:YES completion:nil];
8
}

1
//选中哪个就传给主页
2
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
3
    [tableView deselectRowAtIndexPath:indexPath animated:YES];
4

5
    if (indexPath.row < self.searchResults.count) {
6
        NSDictionary *city = self.searchResults[indexPath.row];
7

8
        DetailViewController *detailVC = [[DetailViewController alloc] init];
9
        detailVC.cityName = city[@"name"];
10
        detailVC.canAddCity = YES;
11

12
        UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:detailVC];
13
        nav.modalPresentationStyle = UIModalPresentationFullScreen;
14
        [self presentViewController:nav animated:YES completion:nil];
15
    }
16
}

当我们点击其中一行时，我们会跳转到该城市。同时，我们在主页面添加了一个判重逻辑，避免城市重复添加。

1
for (NSDictionary *city in self.cityData) {
2
        if ([city[@"name"] isEqualToString:newCity]) {
3
            exists = YES;
4
            break;
5
        }
6
    }
7
    if (!exists) {
8
        [self.cityData addObject:@{@"name": newCity}];
9
        [self createUrl];
10
    }

城市详情页#

我的城市详情页分为两种情况：

在搜索栏点击城市后显示的未被添加过的城市详情右上角是一个添加，而如果该城市是在主页点的，右上角是一个删除。

我们设置了一个BOOL属性:

1
if (self.canAddCity) {
2
        UIButton *addBtn = [UIButton buttonWithType:UIButtonTypeSystem];
3
        [addBtn setImage:[UIImage systemImageNamed:@"plus"] forState:UIControlStateNormal];
4
        addBtn.frame = CGRectMake(self.view.bounds.size.width - 60, 50, 40, 40);
5
        addBtn.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
6
        [addBtn setTintColor:[UIColor whiteColor]];
7
        [addBtn addTarget:self action:@selector(addCity) forControlEvents:UIControlEventTouchUpInside];
8
        addBtn.backgroundColor = [UIColor colorWithWhite:0 alpha:0.25];
9
        addBtn.layer.cornerRadius = 20;
10
        addBtn.clipsToBounds = YES;
11
        [self.scrollView addSubview:addBtn];
12
    } else {
13
        UIButton *deleteBtn = [UIButton buttonWithType:UIButtonTypeSystem];
14
        [deleteBtn setImage:[UIImage systemImageNamed:@"trash"] forState:UIControlStateNormal];
15
        deleteBtn.frame = CGRectMake(self.view.bounds.size.width - 60, 50, 40, 40);
16
        deleteBtn.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
17
        [deleteBtn setTintColor:[UIColor whiteColor]];
18
        [deleteBtn addTarget:self action:@selector(deleteCity) forControlEvents:UIControlEventTouchUpInside];
19
        deleteBtn.backgroundColor = [UIColor colorWithWhite:0 alpha:0.25];
20
        deleteBtn.layer.cornerRadius = 20;
21
        deleteBtn.clipsToBounds = YES;
22
        [self.scrollView addSubview:deleteBtn];
23
    }

同时，我实现了一个城市之间的横向滑动切换。

据我了解，这个有两种实现方式：用scrollView或PageViewcontroller。因为本人还未使用过后者，因此尝试一下。

首先，我们要实现UIPageViewControllerDelegate, UIPageViewControllerDataSource。

下图分别为DataSource和Delegate的definition。

其次，UIPageViewController默认的是使用 UIPageViewControllerTransitionStylePageCurl ，是一种仿真的翻书效果，在天气预报中，我们要把它改成StryleScroll

1
-(id) init  {
2
    self = [super initWithTransitionStyle:UIPageViewControllerTransitionStyleScroll
3
                        navigationOrientation:UIPageViewControllerNavigationOrientationHorizontal
4
                                      options:nil];
5
    return self;
6
}

同时，我们必须实现：UIPageViewControllerDataSource 和 UIPageViewControllerDelegate。前者用于告诉程序他的上一页和下一页是谁，后者是范爷完成的回调。

1
/*
2
 分别获取前一个和后一个VC
3
 */
4
- (UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerBeforeViewController:(UIViewController *)viewController {
5
    NSInteger index = [(DetailViewController *)viewController index];
6
    //不是第一个就去上一个
7
    if (index > 0) {
8
        return [self detailViewControllerForIndex:index - 1];
9
    }
10
    return nil;
11
}
12

13
- (UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerAfterViewController:(UIViewController *)viewController {
14
    NSInteger index = [(DetailViewController *)viewController index];
15
    if (index < self.cities.count - 1) {
16
        return [self detailViewControllerForIndex:index + 1];
17
    }
18
    return nil;
19
}

原文发布于 CSDN：【iOS】天气预报仿写总结