2

This is the design of a Section

enter image description here

This is what i have achieved so far.

enter image description here

This is the code for talbeview cell

override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        contentView.addSubview(content)
      contentView.backgroundColor = UIColor.red
        content.backgroundColor = UIColor(hexString: "#eaeaea", alpha: 1.0)
//        content.snp_makeConstraints { (make) -> Void in
//            make.edges.equalTo(contentView)
//        }
//      content.frame = CGRect(x: StandardHorizontalMargin, y: 0, width: , height: contentView.frame.height)
      let margin = StandardHorizontalMargin
      content.frame = UIEdgeInsetsInsetRect(contentView.bounds, UIEdgeInsetsMake(0, margin, 0, margin))

This is the code for tableview header label

override func layoutSubviews() {
        super.layoutSubviews()
        let margin = StandardHorizontalMargin
        self.headerLabel.frame = UIEdgeInsetsInsetRect(self.bounds, UIEdgeInsetsMake(margin, margin, 0, margin))
        headerLabel.backgroundColor = UIColor(hexString: "#eaeaea", alpha: 1.0)
        horizontalTopLine.frame = CGRect(x: 0, y: 0, width: self.bounds.size.width, height: OEXStyles.dividerSize())
    }

i want to align it like the design. what am i missing here? why the content's height is not as same as the contentview? can anyone help me?

Ganesh Kumar
  • 1,631
  • 2
  • 21
  • 35
  • Get idea from here: https://stackoverflow.com/questions/44367129/uitableviewcell-shadows/44367371#44367371 – Salman Ghumsani Oct 25 '17 at 08:14
  • @SalmanGhumsani it is for a single tableviewcell. but here i want that for the entire section. – Ganesh Kumar Oct 25 '17 at 08:16
  • I am not sure you should use sections the way you do or at least that to be the best approach. There are plenty of ways to inset it or to just add a subview on the right to hover over the cells... But how do you expect to draw that shadow under the whole "card". I suggest you to use table view cell for what you call a section and then either add stack view or add views on it programmatically. In any case you may use automatic dimensions for correct sizing of the cells. – Matic Oblak Oct 25 '17 at 08:41
  • @MaticOblak so this is way too complicated to do right? – Ganesh Kumar Oct 25 '17 at 08:47
  • Also if this is all you got from designer you should reject it. Designer should also prepare edge cases such as for minimum; what it looks like if title is single line and there is only 1 subsection (is there even enough room for "completed" part). and for maximum; What if title has 10 lines there are 10 subsection, will "completed" just hover somewhere in the middle? These are all important questions because now because you might find out you will need another tool then what you are using. Maybe different cells depending on number of components... – Matic Oblak Oct 25 '17 at 08:47
  • @GaneshKumar Not too complicated at all but is hackish. Many things may go wrong. And managing code may be very hard if some changes are desired. With a cell and stack view this should be as easy as it gets. – Matic Oblak Oct 25 '17 at 08:49
  • @MaticOblak yes. you are right. – Ganesh Kumar Oct 25 '17 at 08:50
  • It doesn't seem to difficult , As @MaticOblak Suggest You can design all in cell , In your cell Take one view call Container View add leading trailing top and bottom some constant as show in image add all items in and you rock – Prashant Tukadiya Oct 25 '17 at 10:13

0 Answers0