EurekaCommunity/SplitRow

Change background color of a SplitRow?

JoshAtPCI opened this issue · 9 comments

Is there a way to change the background color of a split row, either each cell individually or both at the same time? I have spent a while trying to change just about every .backgroundColor property I could find with no luck.

Thanks,
Josh

@JoshAtPCI have you tried the cellSetup and the cellUpdate callbacks? They should allow you to change the backgroundColor of the whole SplitRow cell: https://github.com/xmartlabs/Eureka#understanding-row-and-cell

Haven't tested this though; can you please give it a try and report back?

@marbetschar unfortunately that does not seem to work.

Right after I posted the issue I tried making the tableViewLeft and tableViewRight properties on the SplitRowCell<L, R> class public, also had to make the SplitRowCellTableView<T> public. I was then able to set the background color on both TableViews to clear.

<<< SplitRow<TextRow, TextRow>("Tag") {
    // Initialize rows....

    $0.cell.backgroundColor = .clear
    $0.cell.contentView.backgroundColor = .clear

    // These two lines are what finally removed the last white background.
    $0.cell.tableViewLeft.backgroundColor = .clear
    $0.cell.tableViewRight.backgroundColor = .clear
}

It appears as though the TableViews themselves had a white background in addition to the regular Eureka cells.

Do you mind adding a pull request?

@marbetschar, happy to help, pull request #26 created.

@JoshAtPCI thank you very much for creating a pull request for this issue! But before I'll merge: I'd prefer the classes not to be public available for this single use case.

Therefore, do you mind changing the code which allows setting the .backgroundColor in the Eureka way e.g. cellSetup and/or cellUpdate of the SplitRow itself? The pull request should allow the following to work properly without any further need of customization:

SplitRow<TextRow,TextRow>{
    $0.rowLeft = TextRow()
    $0.rowRight = TextRow()
}.cellSetup{ cell, row in
    cell.backgroundColor = .yellow
}

and/or

SplitRow<TextRow,TextRow>{
    $0.rowLeft = TextRow()
    $0.rowRight = TextRow()
}.cellUpdate{ cell, row in
    cell.backgroundColor = .yellow
}

@marbetschar I have updated PR #26 to remove the public access modifiers and added new properties that better match the existing properties of SplitRow. I added a rowLeftBackgroundColor and rowRightBackgroundColor as I found that there might be instances where I wanted to change each background color individually.

The following code works. I was unable to make it work in the cellSetup method, but cellUpdate works.

SplitRow<TextRow,TextRow>{
    $0.rowLeft = TextRow()
    $0.rowRight = TextRow()
    $0.rowLeftBackgroundColor = .yellow
}.cellUpdate{ cell, row in
    row.rowRightBackgroundColor = .yellow
}

Thanks for the pointers as I am still relatively new to iOS development.

@JoshAtPCI don't worry - I really appreciate the work you put into this 👍

Can you please verify the following code works as intended? If so, I'm happy to merge this in. If not we have to refactor a bit.

SplitRow<TextRow,TextRow>{
    $0.rowLeftBackgroundColor = .yellow
    $0.rowLeft = TextRow()
    $0.rowRight = TextRow()   
}

@JoshAtPCI In addition, can you please set the default .backgroundColor of rowLeft and rowRight to .clear ? So we end up with:

We can set the .backgroundColor for the entire row like:

SplitRow<TextRow,TextRow>{
    $0.rowLeft = TextRow()
    $0.rowRight = TextRow()
}.cellSetup{ cell, row in
    cell.backgroundColor = .yellow
}

We can can set each color individually (if needed) like:

SplitRow<TextRow,TextRow>{
    $0.rowLeft = TextRow()
    $0.rowRight = TextRow()

    $0.rowLeftBackgroundColor = .yellow
    $0.rowRightBackgroundColor = .blue
}

@marbetschar, yes it was intended to allow for $0.rowLeftBackgroundColor = .yellow in the main row setup closure.

I have updated the SplitRowCell init method to set the left and right TableView's background color to clear.