swift - Complex Dynamic Collection Of UILabels Two Columns and Multiple Rows iOS -


i've been struggling thinking how setup kind of layout in tableviewcell. see photo:

more info:

  1. data dynamic. there might other days , each days might consists of multiple set of time.
  2. auto-layout needed of course dynamic/responsive height of cell.

what did:

  1. i did try doing using ib.
  2. i tried programmatically.
  3. both in ib , programmatically, used uistackview. kinda hard set up.
  4. i'm thinking set using uiviews containers, uistackview less complex.

i'm setting row row. first line time vertically, , view or stackview of paired horizontally day. after that, same other days.

enter image description here

for formality of question, here part of code in cell setting layout, suggest not taking effort read it, believe know doing, , think need approach guys.

var job: job! {     didset {          _ = self.subviews.map {             if $0 uistackview {                 $0.removefromsuperview()             }         }          gplog(classsender: self, log: "🎉setting stackview jobshift")          // add main vertical stackview          let stackview_vertical = uistackview(frame: .zero)         stackview_vertical.translatesautoresizingmaskintoconstraints = false         stackview_vertical.alignment = .fill         stackview_vertical.distribution = .fillproportionally         stackview_vertical.axis = .vertical         stackview_vertical.spacing = 16.0         self.addsubview(stackview_vertical)          // add constraints          stackview_vertical.topanchor.constraint(equalto: self.topanchor, constant: 15.0).isactive = true         stackview_vertical.bottomanchor.constraint(equalto: self.bottomanchor, constant: -15.0).isactive = true         stackview_vertical.leadinganchor.constraint(equalto: self.leadinganchor, constant: 15.0).isactive = true         stackview_vertical.trailinganchor.constraint(equalto: self.trailinganchor, constant: -15.0).isactive = true          if let dummyjson = self.readjson() {             if let shiftsjsonarray = dummyjson.array {                 shiftjson in shiftsjsonarray {                      let newshift = dummydatashift(json: shiftjson)                      if let day = newshift.day,                         let schedules = newshift.schedule {                         let generatedstackview = self.generatedayschedulestackview(day: day, schedules: schedules)                         stackview_vertical.addarrangedsubview(generatedstackview)                     }                 }             }         }     } }  // mark: - functions  // generate full schedule stack view. func generatedayschedulestackview(day: string, schedules: [dummydataschedule]) -> uistackview {      // label day (e.g. monday)     let newlabel_day = self.shiftlabel     newlabel_day.translatesautoresizingmaskintoconstraints = false     newlabel_day.text = day     newlabel_day.backgroundcolor = .red     newlabel_day.heightanchor.constraint(equaltoconstant: 30.0).isactive = true      // prepare vertical schedule stackview     let stackview_schedule = uistackview(frame: .zero)     stackview_schedule.alignment = .fill     stackview_schedule.distribution = .fillequally     stackview_schedule.axis = .vertical      // add schedules stackview vertically     schedule in schedules {         let newlabel_time = self.shiftlabel         newlabel_time.text = "\(schedule.timein!) - \(schedule.timeout!)"         newlabel_time.backgroundcolor = self.getrandomcolor()         newlabel_time.translatesautoresizingmaskintoconstraints = false         newlabel_time.heightanchor.constraint(equaltoconstant: 30.0).isactive = true          stackview_schedule.addarrangedsubview(newlabel_time)     }      // prepare horizontal dayschedulestackview     let stackview_dayschedule = uistackview(frame: .zero)     stackview_dayschedule.alignment = .fill     stackview_dayschedule.distribution = .fillproportionally     stackview_dayschedule.axis = .horizontal      // add arranged subviews     stackview_dayschedule.addarrangedsubview(newlabel_day)     stackview_dayschedule.addarrangedsubview(stackview_dayschedule)       return stackview_dayschedule }

problem is: lots of warnings broken constraints, know how set , fix constraints. when fix it, nothing displaying. feel i'm wasting time pushing , trying hard continue approach. thought me lot if ask suggestions?

there multiple ways of solving problem. try give 1 approach it.

1) use tableview, each section cell containing "day of week" label plus vertical stackview time labels (use equal spacing).

2) if set constraints properly, can return uitableviewautomaticdimension on sizeforrow: delegate.

override func tableview(_ tableview: uitableview, heightforrowat      indexpath: indexpath) -> cgfloat {     return uitableviewautomaticdimension }

then, on cellforrowat method, can append labels vertical stack view times. height of each cell correct come constraints.


Comments

Post a Comment

Popular posts from this blog

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

i'm implementing inapp billing in android app. works well, however, i'm trying decouple broadcast receiver activity manifest. suggestion in android's trivialdrive sample: // important: dynamically register broadcast messages updated purchases. // register receiver here instead of <receiver> in manifest // because call getpurchases() @ startup, therefore can ignore // broadcasts sent while app isn't running. // note: registering listener in activity bad idea, done here // because sample. regardless, receiver must registered after // iabhelper setup, before first call getpurchases(). currently there's class extends broadcastreceiver : public class iabbroadcastreceiver extends broadcastreceiver { /** * intent action receiver should filter for. */ public static final string action = "com.android.vending.billing.purchases_updated"; private final iabbroadcastlistener mlistener; public iabbroadcastreceiver(iabbroadcastlistener listener) { m...
Read more

python Tkinter Capturing keyboard events save as one single string -

is possible store keyboard events 1 string? code below stores 1 char , prints it. card reader or bar code reader, contains collection of character/ string not 1 character @ time. goal save char pressed text variable. from tkinter import * root = tk() def key(event): text= event.char text+= event.char print ("pressed", text) def callback(event): frame.focus_set() print ("clicked at", event.x, event.y) frame = frame(root, width=100, height=100) frame.bind("<key>", key) frame.bind("<button-1>", callback) frame.pack() root.mainloop() currently, creating text variable , everytime key() function gets called, , text stores last character typed. you can define text module level variable , , use module level text inside key function - text = '' def key(event): global text text+= event.char print("pressed", text)
Read more

sql server - Why does Linq-to-SQL add unnecessary COUNT()? -

here tables: create table customer ( cid int primary key, name varchar(32) ) create table ord ( oid int primary key, cid int foreign key references customer, address varchar(20) ) here's linq-to-sql statement: var aaa = c in db.customer select new { c, o = c.ord.tolist() }; and here's inexplicable query generated linq-to-sql: select [t0].[cid] [cid], [t0].[name] [name], [t1].[oid] [oid], [t1].[cid] [cid2], [t1].[address] [address], (select count(*) [dbo].[ord] [t2] [t2].[cid] = [t0].[cid]) [value] [dbo].[customer] [t0] left outer join [dbo].[ord] [t1] on [t1].[cid] = [t0].[cid] order [t0].[cid], [t1].[oid] i want understand how rid of count(*) part. it's entirely uncalled for! linq needs count(*) in order determine number of entries returned o = c.ord.tolist() .
Read more