UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

Converting TableColumn to TableColumnBuilder example

Forums > SwiftUI

I have a SwiftUI Table working well and am looking to format the column text/value in a text color but I can't for the life of me figure out to translate into TableColumnBuilder. Here is the TableColumn:

Table(viewModel.listOfStructs) {
  TableColumn("Column Head", value: \ViewModel.columnValue).width(min: 50, ideal: 55, max: nil)
}

https://developer.apple.com/documentation/swiftui/tablecolumnbuilder

Am not sure how to pass the value into the TableColumnBuilder


Table(viewModel.listOfStructs) {
  TableColumnBuilder {
    Text("\(viewModel.columnValue)").foregroundColor(.red)
  }
}

2      

You don't use TableColumnBuilder like that; it's an attribute on a parameter like ViewBuilder, not something you call directly.

Here, for instance, is a simplicfication of the declaration for the Table initializer you are using in your first code snippet:

init<Data>(_ data: Data, @TableColumnBuilder<Value, Never> columns: () -> Columns)
//I removed the bits about generic conformances to make it easier to read

In your first snippet, everything between the { and } is the closure you are passing to the columns parameter, which is marked as being a TableColumnBuilder.

You can see that the columns parameter is marked as being a TableColumnBuilder. This is exactly parallel to how you use, say, VStack to create a View. Here is the initializer for VStack:

init(alignment: HorizontalAlignment = .center, spacing: CGFloat? = nil, @ViewBuilder content: () -> Content)

See that @ViewBuilder attribute? You don't call ViewBuilder directly, just like for a Table you don't call TableColumnBuilder directly.

So just like how VStack uses a closure parameter marked as being a ViewBuilder to return Views, a Table uses a closure parameter marked as being a TableColumnBuilder to return TableColumns.

Unfortunately, I am not running Monterey and therefore can't play around with the Table API, so I can't answer your question about applying colors to the values in a TableColumn.

However, looking at Apple's sample code and documentation, I imagine it would be something like this:

Table(viewModel.listOfStructs) {
  TableColumn("Column Head", value: \ViewModel.columnValue) { rowValue in
      Text(rowValue.columnValue)
          .foregroundColor(.purple)
  }
  .width(min: 50, ideal: 55, max: nil)
}

In other words, what you have works fine to just display a String but if you want to style it, you need to explicitly pass in a ViewBuilder closure for the content parameter of the TableColumn.

2      

Thanks! I was able to get that to work. Is setting the background color similar, handling padding for the entire cell and not just the text (when he background color is stored in the rowValue)? Adding .background() sets the background of the text, but not the cell. Is this just padding? I haven't been able to get any cobination to get what I need yet.

Thanks again.

2      

Unfortunately, I am not running Monterey and therefore can't play around with the Table API, so I can't really answer your question. You'll just have to play around with it yourself and see what works.

2      

Hacking with Swift is sponsored by Essential Developer

SPONSORED Join a FREE crash course for mid/senior iOS devs who want to achieve an expert level of technical and practical skills – it’s the fast track to being a complete senior developer! Hurry up because it'll be available only until April 28th.

Click to save your free spot now

Sponsor Hacking with Swift and reach the world's largest Swift community!

Archived topic

This topic has been closed due to inactivity, so you can't reply. Please create a new topic if you need to.

All interactions here are governed by our code of conduct.

 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.