公司动态
UI 学习: Appearance 外观管理
文章目录Appearance 外观管理基本概念设置导航栏的外观设置设置背景不透明的方式设置工具栏的外观Appearance 应用概述Appearance 外观管理在iOS13之前, 外观一般是通过直接设置属性来设置的,在iOS13 之后, 通过 Appearance 来统一配置, 并且Appearance 的优先级通常更高.它不只是颜色还可以设置背景透明度阴影标题样式按钮样式滚动状态下的样子基本概念Appearance 是系统控件的外观配置对象, 也就是是 皮肤系统在iOS13 之前, 直接修改控件的属性nav.navigationBar.barTintColor[UIColor redColor];nav.navigationBar.tintColor[UIColor whiteColor];nav.navigationBar.titleTextAttributes{NSForegroundColorAttributeName:[UIColor whiteColor]};特点:每个属性单独设置分散、容易漏不好维护iOS13 之后通过 Appearance 统一配置UINavigationBarAppearance*appearance[[UINavigationBarAppearance alloc]init];[appearance configureWithOpaqueBackground];appearance.backgroundColor[UIColor redColor];appearance.titleTextAttributes{NSForegroundColorAttributeName:[UIColor whiteColor]};nav.navigationBar.standardAppearanceappearance;nav.navigationBar.scrollEdgeAppearanceappearance;特点所有样式集中在一个对象里结构清晰可复用设置导航栏的外观设置在iOS13 之前, 直接修改导航栏的属性设置背景不透明的方式在iOS13 之前// 设置不透明// 默认是 YES, 透明self.navigationController.navigationBar.translucentNO;它控制的是 导航栏是否参与系统的半透明/模糊渲染, 默认是YES, 也就是透明的, 要改变导行栏的颜色, 就必须要设置为 NO; 否则不会生效在iOS13 之后[appearance configureWithOpaqueBackground];它控制的是 导航栏的视觉样式系统是否为不透明风格是“样式配置”不是开关属于 UIKit 的统一外观系统不直接影响 layout (布局分布)可分别控制不同状态standard / scrollEdge例如:// 设置导航栏的背景颜色self.navigationController.navigationBar.barTintColor[UIColor redColor];这个写法现在已经废弃, 尽管编译器不会报错, 但是无法生效在iOS13 之前// 背景色self.navigationController.navigationBar.barTintColor[UIColor redColor];// 按钮颜色self.navigationController.navigationBar.tintColor[UIColor whiteColor];// 标题颜色self.navigationController.navigationBar.titleTextAttributes{NSForegroundColorAttributeName:[UIColor whiteColor]};tintColor 和 backgroundColor 区别background 指的是导航本身的颜色而 barTintColot 则更加侧重于按钮, 图标, 可交互元素的颜色,例如, 在导航栏中, backgroundColor控制的是 导航栏的底色而 tintColor 控制的是导航栏上可以点击的 UI 的颜色 (按钮, 图标)从 iOS13开始使用 Appearance 来管理导航栏外观先创建一个UINavigationBarAppearance对象, 然后修改该对象的属性UINavigationBarAppearance*appearance[[UINavigationBarAppearance alloc]init];设置背景颜色appearance.backgroundColor[UICOlor redColor];设置标题颜色// 标题颜色appearance.titleTextAttributes{NSForegroundColorAttributeName:[UIColor redColor]};设置按钮颜色// 按钮颜色(按钮的文字颜色)appearance.buttonAppearance.normal.titleTextAttributes{NSForegroundColorAttributeName:[UIColor blueColor]};在设置好属性之后, 还需要应用才能生效// 应用UINavigationBar*navbarself.navigationController.navigationBar;navbar.standardAppearanceappearance;navbar.scrollEdgeAppearanceappearance;navbar.compactAppearanceappearance;这三个其实是同一个导航栏在不同的使用场景下的外观配置standard普通状态scrollEdge滚动到顶部大标题常见compact高度变小横屏 / 特殊场景目的是为了在所有状态下看起来一致少了哪个结果scrollEdge顶部变透明standard滚动后样式错乱compact横屏样式异常设置工具栏的外观工具栏创建UIToolbarApperance对象UIToolbarAppearance*toolAppearance[[UIToolbarAppearance alloc]init];设置不透明[toolAppearance configureWithOpaqueBackground];设置背景颜色toolAppearance.backgroundColor[UIColor yellowColor];应用UIToolbar*toolBarself.navigationController.toolbar;toolBar.standardAppearancetoolAppearance;toolBar.scrollEdgeAppearancetoolAppearance;toolBar.compactAppearancetoolAppearance;Appearance 应用概述不仅仅是navigationBar和toolBar, UINavigationBar,UIToolbar,UIBarButtonItem,UIButton,UILabel部分属性),UISwitch,UISlider,UITableView / UITableViewCell部分 都可以通过Appearance 来设置来属性UI Appearance 实际是一个peosy(代理对象) runtime动态转发,它不会立即修改对象, 而是记录你设置的样式, 在控件创建的时候自动应用,或者在layout / trait change 时更新可以理解为提前设置一套规则, 在需要使用的时候直接调用, 统一设置外观