美文网首页iOS之MAC端开发程序员iOS Developer
Swift3.0 开发macOS应用程序(2) NSCollec

Swift3.0 开发macOS应用程序(2) NSCollec

作者: MNode | 来源:发表于2016-11-30 14:24 被阅读576次

    MACOS NSCollectionView的使用及介绍

    一个NSCollectionView对象显示的是可定制布局的有序数据集合,最简单的集合视图显示在其网格中的item中,你可以定义你想要的布局去管理item。NSCollectionView和UIKit中UICollectionView有很多相似之处,不过NSCollectionView的结构和UICollectionView有些差异,但使用方法差不多,都需要遵循dataSource和delegate,都有LayoutFlow特性。

    0.png
    1.NScollectionView在storyboard中的层次结构

    如下图

    1.png

    由此可以发现CollectionView并非只有ColletionView一个视图,它只是Bordered Scroll View 里面的一个子视图。

    2.搭建实例UI界面

    从右下角控件Library拖拽1个NSCollectionView、一个NSTextFieldView和1个NSButton到视图控制器中,并进行约束

    2.png
    3.创建一个继承与NSCollectionViewItem的SBCollectionItem,并勾选xib
    5.png

    如下图所示

    6.png

    并在右下角的控件Library中拖拽一个NSObject对象到SBCollectionItem.xib中,如上图所示
    设置Object对象class为SBCollectionItem,如下图所示

    7.png

    在SBCollectionItem.xib中添加一个label,约束居中。

    3.连线并写代码

    将storyboard中对于控件连线到ViewController.swift文件中,并命名,代码如下:

    import Cocoa
    
    class ViewController: NSViewController ,NSCollectionViewDataSource, NSTextFieldDelegate{
        //输入框
        let reuse = "reuseItem"
        var data:[String] = ["张三","李四","王五","小六"]
        var item = SBCollectionItem()
        
        @IBOutlet weak var collectionView: NSCollectionView!//colletionView
        @IBOutlet weak var inputMessages: NSTextField!//输入框
        
        override func viewDidLoad() {
            super.viewDidLoad()
            inputMessages.delegate=self
            collectionView.register(NSNib.init(nibNamed: "SBCollectionItem", bundle:nil), forItemWithIdentifier: reuse)
            //成为第一响应者
            inputMessages.becomeFirstResponder()
        }
        //点击Add按钮响应的事件
        @IBAction func add(_ sender: Any) {
            addMessages()
        }
        //添加信息
        func addMessages(){
        if !inputMessages.stringValue.isEmpty {
                data.append(inputMessages.stringValue)
                let indexPath = NSIndexPath.init(forItem: data.count-1, inSection: 0)
                collectionView.insertItems(at: [indexPath as IndexPath])
                collectionView.scrollToItems(at: [indexPath as IndexPath], scrollPosition: .bottom)
                collectionView.reloadItems(at: [indexPath as IndexPath])
                inputMessages.stringValue=""
            }
        }
        override var representedObject: Any? {
            didSet {
            // Update the view, if already loaded.
            }
        }
        //MARK: NSCollectionViewDataSource
        func collectionView(_ collectionView: NSCollectionView, numberOfItemsInSection section: Int) -> Int {
            return data.count
        }
        func collectionView(_ collectionView: NSCollectionView, itemForRepresentedObjectAt indexPath: IndexPath) -> NSCollectionViewItem {
            item = collectionView.makeItem(withIdentifier: reuse, for: indexPath) as! SBCollectionItem
            item.nameLabel.stringValue=data[indexPath.item]
            return item
        }
        //MARK:NSTextFieldDelegate
        //按回车键即可发送内容
        override func controlTextDidEndEditing(_ obj: Notification) {
            addMessages()
        }
    }
    
    4.运行程序
    9.gif

    源码-->:github

    相关文章

      网友评论

      • Stormstout:你好,想问一下
        我从SB中拖入一个NSCollectionView,连VC创建对象,可是这个控件默认继承的是NSScrollView!,里面没有register(NSNib方法,如果使用则报错, Extra argument 'forItemWithIdentifier' in call -- 如果强行将collectionView的继承改为NSCollectionView!,这样不会报错,可是运行的时候提示说没有找到方法...这个怎么办,当前版本Xcode8.3.1
        Stormstout:@走哪都有风 成功了:cold_sweat: ,不过约束真恶心,item的约束没看懂,内约束可以,外约束还不知道在哪设置
        MNode:默认的是NSScrollView没错,但是不是连接它,mac开发应用跟iOS有些区别,需展开NSScrollView里面子视图,与里面的CollectionView连接
      • 喜欢你说丶阮阮阮:你好,咨询一下。
        item.nameLabel.stringValue=data[indexPath.item]
        我这里报错了, item.nameLabel = nil,请问这是哪里错了?
        另外,我对比了一下 SBCollectionItem.xib ,教程里 Label 下有Constraints ,我工程里没有,是版本的问题还是需要手动设置?
        MNode:@喜欢你说丶阮阮阮 你说的对。不过不清楚你写的其它地方有没有错误
        喜欢你说丶阮阮阮:@走哪都有风 我理解下来,约束是对控件布局的约束是吗?所以有没有约束 并不会对程序运行造成影响。
        nameLabel 控件我也加了,并且连线到SBCollectionViewItem.swift 了。为何会是nil
        MNode:nameLabel是我拖进xib里的控件,还学对控件进行约束,约束是要自己手动设置的

      本文标题:Swift3.0 开发macOS应用程序(2) NSCollec

      本文链接:https://www.haomeiwen.com/subject/gxhtmttx.html