美文网首页
类似朋友圈搭建

类似朋友圈搭建

作者: 菲特峰 | 来源:发表于2020-10-16 14:18 被阅读0次

    设计图效果

    image.png image.png

    对于不等高cell的自适应有xib和纯代码方式

    参考https://www.jianshu.com/p/2f161f6a310f

    1. xib和 AutomaticDimension配合使用
    2. xib和计算高度
    3. Frame布局和计算高度
    4. YYKit + CountHeight
    5. AsyncDisplayKit + CountHeight

    这里我也同样采用Frame布局和计算高度

    将所有子控件的frame封装在model里并计算高度,图片计算逻辑看代码,以下代码只是暂时粗糙的写个简单demo,只是主要实现逻辑

    //
    //  PXSTopicFrame.swift
    //  PXSTrain
    //
    //  Created by Pro on 2020/9/23.
    //  Copyright © 2020 com.liufeng.mysterFeng. All rights reserved.
    //
    
    import UIKit
    
    class PXSTopicFrame: NSObject {
        var avatarFrame:CGRect?
        var nicknameFrame:CGRect?
        var thumbFrame:CGRect?
        var moreFrame:CGRect?
        var createTimeFrame:CGRect?
        var textFrame:CGRect?
        var contentFrame:CGRect?
        var tableViewFrame:CGRect?
    
        var imageArrFrame:[CGRect]?
        
        var commentFrame:[PXSCommentFrame]?
        
        var height:CGFloat = 0
        
        var model:PXSTopicModel?{
            didSet {
                avatarFrame = CGRect.init(x: 15, y: 15, width: 30, height: 30)
                nicknameFrame = CGRect.init(x: 50, y: 15, width: 100, height: 15)
                createTimeFrame = CGRect.init(x: 50, y: 30, width: 200, height: 15)
                let textH = self.model?.text?.getStringHeight(width: kScreenWidth-30, font: 14) ?? 20
                textFrame = CGRect.init(x: 15, y: 15+30+15, width: kScreenWidth-30, height: textH)
                let conetntH = self.model?.contentStr?.getStringHeight(width: kScreenWidth-30, font: 12) ?? 20
    
                contentFrame = CGRect.init(x: 15, y: 60+textH, width: kScreenWidth-30, height: conetntH)
                
                height =  60.0 + textH + conetntH + 10.0
    
                
                //图片宽高 图片间距 = 5
                let imageWH = (kScreenWidth - 30 - 5*2)/3
                //图片个数
                let count:Int = self.model?.images?.count ?? 0
                if count>0  {
                    //图片坐标
                    var imageX:CGFloat = 0
                    var imageY:CGFloat = 0
    
                    
                    var imageFrame = [CGRect]()
                    for index in 0..<count {
                        if index < count {
                            if count < 5 {
                                imageX = 15.0 + (index % 2).cgFloat * (imageWH + 5.0)
                                imageY = 60.0 + textH + conetntH + 10.0 + (index/2).cgFloat * (imageWH + 5.0)
    
                            }else {
                                imageX = 15.0 + (index % 3).cgFloat * (imageWH + 5.0)
                                imageY = 60.0 + textH + conetntH + 10.0 + (index/3).cgFloat  * (imageWH + 5.0)
                                
                            }
    
                            let frame = CGRect.init(x: imageX, y: imageY, width: imageWH, height: imageWH)
                            imageFrame.append(frame)
                            
                        }
                    }
                    imageArrFrame = imageFrame
    
                }
                
                
                let imageViewH = heightOfImages(images: self.model?.images ?? [
                    ])
                
                let tableViewY:CGFloat = 60.0 + textH + conetntH + 10.0 + imageViewH
    
                var tableViewH:CGFloat = 0
                
                var commentArr = [PXSCommentFrame]()
                
                if self.model?.comments?.count ?? 0 > 0 {
                    for comment in self.model!.comments! {
                        let commentFrame = PXSCommentFrame.init()
                        commentFrame.comment = comment
                        commentArr.append(commentFrame)
                        tableViewH += commentFrame.height
                        
                    }
                }
                
                self.commentFrame = commentArr
                
                self.tableViewFrame = CGRect.init(x: 55, y: tableViewY, width: kScreenWidth - 70, height: tableViewH)
                
                height = tableViewY + tableViewH + 20
                
        
                
            }
            
        }
        
    
        //图组的高度
        func heightOfImages(images:[String]) -> CGFloat {
            if images.count == 0 {
                return 0
            } else {
                let picHeight = (UIScreen.main.bounds.size.width - 15 * 2 - 5 * 2)/3
                var height = 0
                if images.count < 5 {
                    height = ((images.count - 1)/2 + 1) * Int(picHeight) + (images.count - 1)/2 * 5 + 15
                }else {
                    height = ((images.count - 1)/3 + 1) * Int(picHeight) + (images.count - 1)/3 * 5 + 15
                }
                return CGFloat(height);
            }
        }
    }
    
    

    同样评论回复cell的高度计算

    class PXSCommentFrame: NSObject {
        var textFrame:CGRect?
        var height:CGFloat = 0
        var maxW:CGFloat?
        var comment:PXSComment? {
            didSet {
                let textH = self.comment?.text?.getStringHeight(width: kScreenWidth-70, font: 12)
                self.textFrame = CGRect.init(x: 10, y: 0, width: kScreenWidth-70, height: textH ?? 0)
                
                height = textH ?? 0
            }
        }
    }
    

    自定义cell的代码

    //
    //  PXSTopicListCell.swift
    //  PXSTrain
    //
    //  Created by Pro on 2020/9/22.
    //  Copyright © 2020 com.liufeng.mysterFeng. All rights reserved.
    //
    
    import UIKit
    
    class PXSTopicListCell: UITableViewCell,UITableViewDataSource,UITableViewDelegate {
      
    
      lazy var bgView :UIView = {
          let view = UIView.init()
          view.backgroundColor = AppColor.white
          return view
      }()
      lazy var  avatarView :UIImageView = {
          let imageV = UIImageView()
          imageV.image = UIImage.init(named: "默认头像108x108 二")
          return imageV
      }()
      lazy var  nicknameLable :UILabel = {
          let label = UILabel()
          label.font = AppFont.font12
          label.textColor = AppColor.black
          
          return label
      }()
    
      lazy var  timeLab :UILabel = {
          let label = UILabel()
          label.font = AppFont.font10
          label.textColor = AppColor.darkgGray
    
          return label
      }()
    
      lazy var  textLab :UILabel = {
          let label = UILabel()
          label.font = AppFont.font14
          label.textColor = AppColor.black
          label.numberOfLines = 0
          
          return label
      }()
      
      lazy var  contextLab :UILabel = {
          let label = UILabel()
          label.font = AppFont.font12
          label.textColor = AppColor.darkgGray
    
          label.numberOfLines = 0
    
          return label
      }()
      
      lazy var tableView : UITableView = {
          let tableView = UITableView.init(frame: .zero, style: UITableView.Style.plain)
          tableView.delegate = self
          tableView.dataSource = self
          tableView.bounces = false
          tableView.isScrollEnabled = false
          tableView.showsVerticalScrollIndicator = false
          tableView.showsHorizontalScrollIndicator = false
          tableView.separatorStyle = .none
          return tableView
      }()
      
      var picsArray = [UIImageView]()
      
      var frameModel:PXSTopicFrame? {
          didSet {
              
              nicknameLable.text = self.frameModel?.model?.user?.nickname
              timeLab.text = self.frameModel?.model?.creatTime
              textLab.text = self.frameModel?.model?.text
              contextLab.text = self.frameModel?.model?.contentStr
          
          }
      }
      
      override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
          super.init(style: style, reuseIdentifier: reuseIdentifier)
          setupUI()
      }
      
      required init?(coder: NSCoder) {
          fatalError("init(coder:) has not been implemented")
      }
      
      override func layoutSubviews() {
          super.layoutSubviews()
          bgView.frame = CGRect.init(x: 0, y: 10, width: self.frame.size.width, height: self.frame.size.height-10)
          avatarView.frame = self.frameModel?.avatarFrame ?? .zero
          nicknameLable.frame = self.frameModel?.nicknameFrame ?? .zero
          timeLab.frame = self.frameModel?.createTimeFrame ?? .zero
          textLab.frame = self.frameModel?.textFrame ?? .zero
          contextLab.frame = self.frameModel?.contentFrame ?? .zero
          for (index, imageView) in self.picsArray.enumerated() {
              if index<self.frameModel?.imageArrFrame?.count ?? 0 {
                  imageView.isHidden = false
                  
                  imageView.frame = self.frameModel?.imageArrFrame?[index] ?? .zero
                  imageView.kf.setImage(with: URL.init(string: self.frameModel?.model?.images?[index] ?? ""))
              }
          }
          
          tableView.frame = self.frameModel?.tableViewFrame ?? .zero
          
      }
    
      
      
      func setupUI() {
          
          self.contentView.backgroundColor = AppColor.vcBgColor
    
          self.contentView.addSubview(bgView)
          
          tableView.register(cellWithClass: PXSTopicCommentCell.self)
          
          bgView.addSubview(avatarView)
          bgView.addSubview(nicknameLable)
          bgView.addSubview(timeLab)
          bgView.addSubview(textLab)
          bgView.addSubview(contextLab)
          bgView.addSubview(tableView)
          
          var imageViewArr = [UIImageView]()
          for i in 0..<9 {
              let imageView = UIImageView(frame: CGRect.zero)
              imageView.backgroundColor = UIColor.red
              imageView.isHidden = true
              imageView.tag = i
              imageView.isUserInteractionEnabled = true
              bgView.addSubview(imageView)
              let tap: UITapGestureRecognizer = UITapGestureRecognizer.init(target: self, action: #selector(tapPicture(tap:)))
              imageView.addGestureRecognizer(tap)
              imageViewArr.append(imageView)
          }
          
          self.picsArray = imageViewArr
      }
      
    
      @objc func tapPicture(tap:UITapGestureRecognizer) {
          
      }
    
    
    
    }
    
    
    extension PXSTopicListCell {
      
      func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
          let commentFrame = self.frameModel?.commentFrame?[indexPath.row]
    
          return commentFrame?.height ?? 0
      }
      
      func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
          return self.frameModel?.commentFrame?.count ?? 0
      }
      
      func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    
          let commentFrame = self.frameModel?.commentFrame?[indexPath.row]
          let cell = tableView.dequeueReusableCell(withClass: PXSTopicCommentCell.self, for: indexPath)
          cell.commentFrame = commentFrame
          return cell
      }
    
    }
    
    

    相关文章

      网友评论

          本文标题:类似朋友圈搭建

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