自适应视图经验总结

标签元素由于 Stack View 设置的元素间距过大,而被截断

为了避免元素被截断,在这个案例中的顶级 Stack View(容纳了一个 Image View 和装着 Name Label 和 Type Label 的 Stack View) 的元素间距设置可以设置为缺省。右图示例就是在 iPhone 11 模拟器下,左右间距为8,元素间距设置为 270 的显示效果。

[su_spacer][su_divider top=”no” style=”dashed”]

[su_spacer][su_divider top=”no” style=”dashed”]

Imageview 区块设置了固定高度,并上、左、右和 SuperView 的间距设为0。并和下方的堆叠视图设置好间距。

下方的堆叠视图设置了与 Superview 的左右各8,下部大于5的间距,并在设置时勾选了 「Constrain to margins」。

[su_spacer][su_divider top=”no” style=”dashed”]

最后的成品
发布日期:
分类:Swift

自定义 TableViewCell

class RestaurantTableViewCell: UITableViewCell {
    
    @IBOutlet var nameLabel: UILabel!
    @IBOutlet var locationLabel: UILabel!
    @IBOutlet var typeLabel: UILabel!
    @IBOutlet var thumbnailImageView: UIImageView!
    // @IBOutlet 宣告一个属性,后续可以用于链接视图组件,为其赋值

    override func awakeFromNib() {
        super.awakeFromNib()
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

    }

}

发布日期:
分类:Swift

自定义 TableViewController 覆写

   override func numberOfSections(in tableView: UITableView) -> Int {
        // #warning Incomplete implementation, return the number of sections
        return 1
    }
    //表示表格视图只有一个区块
    //缺省为 1,不写不影响运行

    
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return restaurantNames.count
    }
    //回传数列的数量和列数
    //缺省为 0,不写视为无数据
    
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cellIdentifier = "datacell"
        let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath)

        cell.textLabel?.text = restaurantNames[indexPath.row]
        cell.imageView?.image = UIImage(named: restaurantNames[indexPath.row])
    //定义 cell 的内容

        return cell
    }

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cellIdentifier = "datacell"
        let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath)

        cell.textLabel?.text = restaurantNames[indexPath.row]
        cell.imageView?.image = UIImage(named: restaurantNames[indexPath.row])
     // [indexPath.row] 为枚举

        return cell
    }


发布日期:
分类:Swift