UI风格

在iOS 11中,系统APP使用了这种UI风格。这种风格最明显的变化就是使用了iOS 11的新特性--Large Title和新的SearchController。

Demo

GitHub: LargerTitleDemo

Large Title & Table View

设置Lager Title

APP全局使用Large Title

1
2
3
4
5
6
7
8
9
10
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
 // Override point for customization after application launch.
 // 设置Large Title偏好为True。
 if (@available(iOS 11.0, *)) {
  [[UINavigationBar appearance] setPrefersLargeTitles:true];
 } else {
  // Fallback on earlier versions
 }
 return YES;
}

单个ViewController使用Larger Title

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
- (void)viewWillAppear:(BOOL)animated {
 [super viewWillAppear:animated];
 // 设置Large Title偏好为YES。
 if (@available(iOS 11.0, *)) {
  [self.navigationController.navigationBar setPrefersLargeTitles:YES];
 } else {
  // Fallback on earlier versions
 }
}
 
- (void)viewWillDisappear:(BOOL)animated {
 [super viewWillDisappear:animated];
 // 设置Large Title偏好为NO。
 if (@available(iOS 11.0, *)) {
  [self.navigationController.navigationBar setPrefersLargeTitles:NO];
 } else {
  // Fallback on earlier versions
 }
}

使用上述代码设置后,即可开启Large Title的显示。

添加Table View

在StoryBoard添加TableView

在Xcode 9中,XIB和StoryBoard默认会添加 Safe Area(安全区) ,而添加在Controller的View上控件的约束也不再以supview为准,而是以Safe Area为准。

Safe Area是在iOS 9中添加的特性。如果你不需要使用Safe Area,或需要在旧版本的App中添加Safe Area,可以在XIB或StoryBoard的右侧边栏中“Show the File inspector”标签下对“Use Safe Area Layout Guides”选项下进行勾选,以添加或删除Safe Area。

添加Refresh Control

Refresh Control是系统的下拉刷新控件,配合Table View使用,以实现系统的下拉刷新效果。

1
2
3
4
5
6
7
UIRefreshControl *refreshControl = [[UIRefreshControl alloc]init];
[refreshControl addTarget:self action:@selector(beginRefresh:) forControlEvents:UIControlEventValueChanged];
if (@available(iOS 10.0, *)) {
 [self.tableView setRefreshControl:refreshControl];
} else {
 // Fallback on earlier versions
}

刷新完成调用 - (void)endRefreshing NS_AVAILABLE_IOS(6_0); 结束刷新状态。

Search Controller

添加搜索栏

1
2
3
4
5
6
if (@available(iOS 11.0, *)) {
 UISearchController *searchController = [[UISearchController alloc]initWithSearchResultsController:nil];
 self.navigationItem.searchController = searchController;
} else {
 // Fallback on earlier versions
}

关于 Search Controller 的使用在此不再赘述。可参考官方Sample Code Table Search with UISearchController

再说几句

由于Large Title及一些API仅在iOS 11提供,所以在调用前均添加了判断,以防止低版本系统调用高版本API造成应用崩溃

1
2
3
4
5
if (@available(iOS 10.0, *)) {
 // Code...
} else {
 // Fallback on earlier versions
}

在实际开发中,在ViewController上添加TableView实现效果不够理想,在滑动过程中有明显卡顿。而直接使用TableViewController实现效果最为理想,滑动无卡顿现象。

链接  http://www.jb51.net/article/130433.htm

感谢分享

iOS11新特性之LargeTitle的更多相关文章

  1. iOS -- iOS11新特性,如何适配iOS11

    前言 这几天抽空把WWDC的Session看了一些,总结了一些iOS11新的特性,可能对我们的App有影响,需要我们进行适配.本文作为一个总结. 本文内容包括:集成了搜索的大标题栏.横向选项卡栏.Ma ...

  2. iOS11 SDK 新特性 CoreML 及swift 小demo

    github代码 如果本博客对您有帮助,希望可以得到您的赞赏! swift 机器学习Core ML的简单调用小demo.完整代码附上: https://github.com/Liuyubao/LYBC ...

  3. WKWebView强大的新特性

    iOS11对WKWebView的功能进一步完善,新增如下功能: Manager Cookies Fileter unwanted content Provide custom resources 下面 ...

  4. SQL Server 2014 新特性——内存数据库

    SQL Server 2014 新特性——内存数据库 目录 SQL Server 2014 新特性——内存数据库 简介: 设计目的和原因: 专业名词 In-Memory OLTP不同之处 内存优化表 ...

  5. ElasticSearch 5学习(10)——结构化查询(包括新特性)

    之前我们所有的查询都属于命令行查询,但是不利于复杂的查询,而且一般在项目开发中不使用命令行查询方式,只有在调试测试时使用简单命令行查询,但是,如果想要善用搜索,我们必须使用请求体查询(request ...

  6. [干货来袭]C#6.0新特性

    微软昨天发布了新的VS 2015 ..随之而来的还有很多很多东西... .NET新版本 ASP.NET新版本...等等..太多..实在没消化.. 分享一下也是昨天发布的新的C#6.0的部分新特性吧.. ...

  7. CSS3新特性应用之结构与布局

    一.自适应内部元素 利用width的新特性min-content实现 width新特性值介绍: fill-available,自动填充盒子模型中剩余的宽度,包含margin.padding.borde ...

  8. 【译】Meteor 新手教程:在排行榜上添加新特性

    原文:http://danneu.com/posts/6-meteor-tutorial-for-fellow-noobs-adding-features-to-the-leaderboard-dem ...

  9. 跨平台的 .NET 运行环境 Mono 3.2 新特性

    Mono 3.2 发布了,对 Mono 3.0 和 2.10 版本的支持不再继续,而且这两个分支也不再提供 bug 修复更新. Mono 3.2 主要新特性: LLVM 更新到 3.2 版本,带来更多 ...

随机推荐

  1. 最小公倍数 SRM 661 Div1 250: MissingLCM

    Problem Statement The least common multiple (denoted "lcm") of a non-empty sequence of pos ...

  2. ERROR in index.web.js from UglifyJs

    使用weexpack构建weex应用时,npm run serve一直报这个错误 ERROR in index.web.js from UglifyJs Unexpected token: name ...

  3. 解析Linux操作系统文件目录

    解析Linux操作系统文件目录 随着Linux的不断发展,越来越多的人开始使用Linux,对于那些刚刚接触的人来说,恐怕最先感到困惑的就是那些“不明不白”的目录了.如果想熟练使用Linux,让Linu ...

  4. 自定义控件之万能Repeater源码

    using System.ComponentModel; using System.Web.UI; [assembly: TagPrefix("Jinlong.Control", ...

  5. 带你走进EJB--将EJB发布为Webservice(4)

    接下来的我们将会自定义一个对象,然后看看EJB是如何对复杂的参数发布成WebService的. 代码如下:在第一个版本的基础之上加上增加用户的方法,参数为User. package com.tgb.e ...

  6. Java 图片验证码工具

    package com.microwisdom.utils; import java.awt.Color; import java.awt.Font; import java.awt.Graphics ...

  7. 很赞的idea教程

    感谢: http://pan.baidu.com/s/1dDEaVxn

  8. 通过淘宝接口免费获取IP地址信息

    1.获取互联网访问IP信息 一般获取互联网访问的IP的相关信息一般都是收费接口,免费的接口不多,我使用到一个接口如下: http://ip.taobao.com/service/getIpInfo.p ...

  9. ES6学习笔记四:Proxy与Reflect

    一:Proxy 代理. ES6把代理模式做成了一个类,直接传入被代理对象.代理函数,即可创建一个代理对象,然后我们使用代理对象进行方法调用,即可调用被包装过的方法: 1)创建 var proxy = ...

  10. spark rdd Transformation和Action 剖析

    1.看到 这篇总结的这么好, 就悄悄的转过来,供学习 wordcount.toDebugString查看RDD的继承链条 所以广义的讲,对任何函数进行某一项操作都可以认为是一个算子,甚至包括求幂次,开 ...