UITableView 动画实现思路

1Mac one

认识 Cocoa App 的开发:Cocoa Binding 、Window Control 、菜单栏...

本文例子是,应用的关于窗口。
比起系统的对话框,增加了两个按钮,访问官网和感谢信息

UITableView 动画实现思路_第1张图片
Screen Shot 2020-03-09 at 10.39.53 PM.png

Cocoa Binding

比起 iOS 的 KVC 和 KVO,OXS 多一个 Cocoa Binding.

KVC, 处理属性的读写。
一般开发会使用 getter 和 setter

MVC 中的控制器,干的活,就是让模型 Model 和视图 View ,保持同步 sync
KVO 和 KVB ,都减少了胶水代码。

KVO, 侧重模型。模型改变,自动订阅修改视图

KVB, 侧重视图。直接把视图暴露出可以绑定的属性,与模型,直接关联。一般结合 XIB 使用
KVB, 抽离出关心的属性,简化掉不必要的视图操作


例如:设置 NSTextView 的内容

通过 MVC 的 getter 和 setter,

// 这是感谢视图
@IBOutlet weak var acknowlesgeScroll: NSScrollView!


override func windowDidLoad() {
        // ...
        if let textView = acknowlesgeScroll.documentView as? NSTextView{
            textView.textStorage?.append(acknowledgment)
        }
       //...
}
通过 KVB,
@objc dynamic var acknowledgment = BundleInfo.get.acknowledgment

同时设置 Xib

UITableView 动画实现思路_第2张图片
Screen Shot 2020-03-09 at 11.34.47 PM.png


iOS 应用,是靠手势操作。Cocoa 应用,是靠鼠标和键盘操作。

UITableView 动画实现思路_第3张图片
Screen Shot 2020-03-11 at 9.27.26 PM.png

比起 iOS,Cocoa App 多了顶部左边的菜单栏

UITableView 动画实现思路_第4张图片
Screen Shot 2020-03-11 at 9.36.16 PM.png

Main.storyboard 里面菜单 menu 的选项, 关联到 AppDelegate, 可以方便的设置菜单事件


    let aboutWindow = AboutWindowController(windowNibName: .about)

// 进入窗口
    @IBAction func enterAbout(_ sender: NSMenuItem) {
        
        let mask:NSWindow.StyleMask = [.closable, .titled, .borderless, .resizable]
        aboutWindow.window?.styleMask = mask
        aboutWindow.appWebsiteURL = URL.demo
        aboutWindow.showWindow(nil)
        
    }
    
    
    // 进入官网
    @IBAction func enterWeWeb(_ sender: NSMenuItem) {
        if let web = URL.demo{
            NSWorkspace.shared.open(web)
        }
    }
    
UITableView 动画实现思路_第5张图片
Screen Shot 2020-03-11 at 9.37.32 PM.png
顶部菜单栏, 除了鼠标点击,还可以设置键盘快捷键


UITableView 动画实现思路_第6张图片
Screen Shot 2020-03-11 at 9.27.42 PM.png

比起 iOS,Cocoa App 多了顶部右边的状态栏

class AppDelegate: NSObject, NSApplicationDelegate {
    // 维持生命周期
    let status = NSStatusBar.system.statusItem(withLength: NSStatusItem.squareLength)
    let customMenu = NSMenu()

    
    func applicationDidFinishLaunching(_ aNotification: Notification) {
        // Insert code here to initialize your application
        
        //设置应用图标
        NSApp.applicationIconImage = NSImage.init(named: "NSInfo")
        
        
        //设置点击状态图标时的响应事件
        
        status.button?.target = self
        status.button?.action = #selector(statusBarClicked(_:))
          
        //设置状态图标
        status.button?.image = NSImage.init(named: "NSInfo")
        
        //NSMenu
        customMenu.title = "Title"

        customMenu.addItem(withTitle: "退出", action: #selector(NSApp.terminate(_:)), keyEquivalent: "k")
        status.menu = customMenu
    }
    // ...
顶部状态栏, 也可以设置键盘快捷键

这里的快捷键,是 Command + Shift + k


比起 iOS,Cocoa App 的左上角,一般还有三个圆点

UITableView 动画实现思路_第7张图片
Screen Shot 2020-03-11 at 9.45.06 PM.png

从左到右,一般是关闭窗口、最小化和尺寸拉伸

这里有一个位运算

系统给的默认的,Main.storyboard 自带的 ViewController 的 window mask 是 11.
2 进制 1011, 11 = 2 + 1 + 0 + 8
带有 4 个属性 [.closable, .titled, .borderless, .resizable],

.closable, 可关闭,值为 2,
.titled,带标题,值为 1,
.borderless , 没有边框, 值为 0
.resizable , 窗口可拉伸, 值为 8

Swift 支持 OptionSet 协议,简化了位运算

        // 控制控制器的窗口,是否可以拉伸
        var mask:NSWindow.StyleMask = [.closable, .titled, .borderless]
        if couldResize{
            mask.insert(NSWindow.StyleMask.resizable)
        }
        aboutWindow.window?.styleMask = mask


补充小的方面:

iOS 主要用到一个 Window,OSX 可以用到多个窗口。

场景多一些。

例如:视频应用,主要用两个窗口。
一个窗口,是菜单;
还有一个是播放器

访问包里面的文件,需要添加 scheme

           // 设置感谢的内容
            if let path = Bundle.main.path(forResource: "Credits", ofType: "rtf"), let address = URL(string: path.path){
                  do {
                      credit = try NSAttributedString(url: address, options: [:], documentAttributes: nil)
                  } catch let error as NSError {
                      print(error.debugDescription)
                  }
              }

添加 scheme

extension String{
    var path: String{
        "file://\(self)"
    }
}

简化滚动条, scroll bar

UITableView 动画实现思路_第8张图片
Screen Shot 2020-03-11 at 10.30.21 PM.png

UITableView 动画实现思路_第9张图片
Screen Shot 2020-03-11 at 10.31.00 PM.png

去掉滚动条的追踪条,
需要处理下 NSScroller

class TransparentScroller: NSScroller {

    override func draw(_ dirtyRect: NSRect) {
        self.drawKnob()
    }
    
}

你可能感兴趣的:(UITableView 动画实现思路)