UI基础

2018-11-07 本文已影响0人夜雨聲煩_

NavigationBar

基本设置

在Appdelegate中定义全局

//设置背景色
UINavigationBar.appearance().barTintColor = UIColor.orange
//设置前景色（实际为下一页面返回此页面左上角tint颜色）
UINavigationBar.appearance().tintColor = UIColor.white
//设置标题字体及颜色
if let barFont = UIFont(name: "Avenir-Light", size: 24) {
    UINavigationBar.appearance().titleTextAttributes = [
        NSAttributedString.Key.font : barFont,
        NSAttributedString.Key.foregroundColor : UIColor.blue
    ]
}

设置返回按钮样式，注意在显示该按钮的前一个页面定义。

self.navigationItem.backBarButtonItem = UIBarButtonItem(title: "", style: .plain, target: nil, action: nil)

下面tableview滑动时隐藏导航栏
设置hide bar on swip

更改状态栏颜色
有导航栏情况下

override func viewDidAppear(_ animated: Bool) {
    self.navigationController?.navigationBar.barStyle = .black
}

无导航栏情况下

override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
}

全局方法加在appdelegagte中

UIApplication.shared.statusBarStyle = .lightContent

遮挡底部视图的情况

设置under top bars 属性为no
或者配合其中控件使用自适应高度属性
webView.autoresizingMask = [.flexibleHeight]

配合StoryBoard转场传值

override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
    if segue.identifier == "showDetail" {
        let dest = segue.destination as! DetailTableViewController
        dest.area = self.areas?[self.tableView.indexPathForSelectedRow!.row]
    }
}![245d3a2e55f700e16b56434ecd09c81.png](https://img.haomeiwen.com/i5687317/4cb295dfef817461.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

注意：关于segue的两个属性。destination为目的，表示将要跳转的页面。source为源，表示来自的页面。注意两者区别。

配合StoryBoard反向转场

关联反向转场方法。在此方法中执行转场回到源视图时执行的方法，以及传值。类似于OC中点击下一页面按钮在源视图中的block回调。

@IBAction func closeReview(segue:UIStoryboardSegue) {

}

StoryBoard

拆分与引用

选中想要拆分的SB
editor->refactor to storyboard
使用新名字来创建新的SB

额外视图

将控件例如spinner拖入顶部exit左侧，然后与对应控制器相关联。利用代码控制spinner的出现及隐藏等行为。

图片

虚化效果

//创建虚化效果：light,dark等不同亮度虚化特效
let effect = UIBlurEffect(style: .light)
//使用u虚化效果创建特效视图
let effectView = UIVisualEffectView(effect: effect)
//指定特效视图尺寸
effectView.frame = view.frame
//将特效视图覆盖在原视图上，实现虚化效果
bgImageView.addSubview(effectView)

按钮

背景色及前景色

原图为透明黑色图案。
设置背景色(backgroundColor)红色，设置前景色(tintColor)，设置按钮样式(type)为system，效果为：

image.png
注意system和tintColor搭配使用
在Xib中指定layer.cornerRadius来在运行时动态设定圆角。

image.png

Xib约束

使用stackView将多个控件加入堆视图同时约束
stackView中使用Content Hugging Priority调整约束优先级
stackView内使用spacing调整内部控件间隔

TableView

cell.accessoryType设定cell右侧系统自带标识（基本对号等）
设置单元格右侧滑动出现的视图
- (nullable NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath
定义UITableViewRowAction，实现点击回调，并返回数组。
滑动到指定行
self.tableView.scrollToRow(at: NSIndexPath(row: 0, section: 0) as IndexPath, at: .top, animated: true)
动画删除指定单元格
tableView.deleteRows(at: [indexPath], with: .automatic)
使用动态行高
```
tableView.estimatedRowHeight = 40
tableView.rowHeight = UITableView.automaticDimension
```
注意设定行内控件距上下约束。同时注意设定内部label行数为0

动画

震荡动画

@available(iOS 7.0, *)
//usingSpringWithDamping: 震荡时间
//initialSpringVelocity:初速度
open class func animate(withDuration duration: TimeInterval, delay: TimeInterval, usingSpringWithDamping dampingRatio: CGFloat, initialSpringVelocity velocity: CGFloat, options: UIView.AnimationOptions = [], animations: @escaping () -> Void, completion: ((Bool) -> Void)? = nil)

组合动画

使用concatenating组合多个CGAffineTransform

//位移+放大
let startPosition = CGAffineTransform(translationX: 0, y: 500)
let startScale = CGAffineTransform(scaleX: 0, y: 0)
reviewStackView.transform = startScale.concatenating(startPosition)

UIView.animate(withDuration: 1, delay: 0, usingSpringWithDamping: 0.8, initialSpringVelocity: 0.5, options: [], animations: {
    let endPosition = CGAffineTransform(translationX: 0, y: 0)
    let endScale = CGAffineTransform.identity
    self.reviewStackView.transform = endScale.concatenating(endPosition)
    
}, completion: nil)

注意：放大组合位移有效果，反之没效果。可能是bug

其他

使用headline样式字体，适配iOS设置中动态放大字体。
多个按钮时合理使用tag重复利用一个方法。

Swift与OC混编

在导入OC第三方库的时候，新建一个.m的OC文件，系统会自动提示是否使用桥接。选择使用后系统会直接创建桥接文件，创建好后删除刚刚自己创建的.m文件。
然后在系统的桥接文件中导入#import <AVOSCloud/AVOSCloud.h>。
编译成功即可。
如果提示找不到
在build Seting 搜索：User Header Search Paths
添加：${SRCROOT} ，选择Recursive
桥接文件中改为#import "AVOSCloud/AVOSCloud.h"

LeanCloud

使用LeanCloud进行云端网络配置和操作。

授权
授权成功会打印lean cloud logo