need IOS UI like the picture - ios

enter image description here
a video clip of this UI, how does it look like
Please Help me how can I make one, I tried to build it by UITableView and for cell UIcollectionView it works well but I can't select collection-view Cell by code ( need after select change the cell view background color )

you can change the background color of UICollectionViewCell by overriding the cell property
override var isSelected: Bool {
didSet {
if isSelected {
self.contentView.backgroundColor = UIColor.blue
} else {
self.contentView.backgroundColor = UIColor.green
}
}
}
also since cell are reusable you may see some cells with blue color while scrolling as they are now reused, to avoid this override the method
override func prepareForReuse() {
super.prepareForReuse()
self.contentView.backgroundColor = UIColor.green
}

Related

UITableViewCell selectedBackgroundView's color not visible when building on iOS 13

I have given a tableview cell a color on selection in cellForRowAtIndexPath using
let backgroundView = UIView()
backgroundView.backgroundColor = UIColor.grey3 //custom color
cell.selectedBackgroundView = backgroundView
Since I am building with Xcode 11.0 the color is not propagated to the subviews of the cell anymore on an iOS 13 device or Simulator. If I build on an iOS 12.2 simulator using Xcode 11.0 it still works.
Anyone has an idea what has changed to cause this behaviour? I am working with .xib files.
From Apple's iOS 13 Release Notes:
The UITableViewCell class no longer changes the backgroundColor or isOpaque properties of the contentView and any of its subviews when cells become highlighted or selected. If you are setting an opaque backgroundColor on any subviews of the cell inside (and including) the contentView, the appearance when the cell becomes highlighted or selected might be affected. The simplest way to resolve any issues with your subviews is to ensure their backgroundColor is set to nil or clear, and their opaque property is false. However, if needed you can override the setHighlighted(:animated:) and setSelected(:animated:) methods to manually change these properties on your subviews when moving to or from the highlighted and selected states.
My quick test confirms this would be the cause in your case.
Cell with green-background label, orange view as .selectedBackgroundView.
iOS 12:
iOS 13:
If you use the hierarchy debugger, you'll see that in iOS 13 the contentView sits above the backgroundView and selectedBackgroundView.
This can be resolved by setting
contentView.backgroundColor = nil
in awakeFromNib
or setting the contentView's backgroundColour to clear in the storyboard
I had the same problem, my solutions is:
TableViewController:
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "testCell")! as! TestCell
// Turn off selection style for iOS12, iOS11, etc...
cell.selectionStyle = .none
return cell
}
Cell Class (I have a UIView inside cell's ContentView):
class TestCell: UITableViewCell {
#IBOutlet weak var testCellBackgroundView: UIView!
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
if selected {
contentView.backgroundColor = UIColor.white
testCellBackgroundView.backgroundColor = UIColor.red
} else {
contentView.backgroundColor = UIColor.white
testCellBackgroundView.backgroundColor = UIColor.green // default background color
}
}
// You may change highlighted color of a cell the same way
override func setHighlighted(_ highlighted: Bool, animated: Bool) {
super.setHighlighted(highlighted, animated: animated)
if highlighted {
contentView.backgroundColor = UIColor.white
testCellBackgroundView.backgroundColor = UIColor.red
} else {
contentView.backgroundColor = UIColor.white
testCellBackgroundView.backgroundColor = UIColor.green
}
}
}
Note: this is my first answer at stackoverflow, please check if it's correct.

UITableViewCell editing accessory color

I have a UITableView and have set multiple selection while editing to true
tableView.allowsMultipleSelectionDuringEditing = true
In the cell configuration (cellForRowAtIndexPath), I do:
cell.selectionStyle = .default
cell.accessoryType = .checkmark
So when tableView is set to editing mode, I get blue checkmark option on the left side. I want to change the default blue color on that accessory. How do I do that?
If you're using storyboard :
Change the tint color here
In your custom UITableViewCell, set cell's tintColor in awakeFromNib() like so,
class CustomCell: UITableViewCell {
override func awakeFromNib() {
super.awakeFromNib()
self.tintColor = .red
}
}
Just set the cell tint color whatever you want. It will automatically change the accessory type color.
[cell setTintColor:[UIColor whiteColor]];

UITableViewCell selection style changing background color for all subviews

I'm writing in swift, using the storyboard, and I'm working with iOS 10.
I have a UITableViewCell composed of some subviews (they're UIViews). Some of those subviews have a background color.
The selection style on the cell is Default (gray).
When I tap the cell, the cell becomes gray. Good. However, the background color of each subview in the cell is also changed automatically to match the selection color (gray) of the cell. Not good.
How can I best prevent this behavior? I don't want the background colors of the subviews in the cell to change.
NOTE: I don't consider it a very good solution to do my own selection by listening for the didSelectRowAtIndexPath delegate method and then setting the background color of the cell's content view. Perhaps this is the only way, but I want to see if there are other options first.
UPDATE:
Just to clarify, another reason I don't like the above solution of listening for the delegate is that it fixes the issue per cell. So if I have other custom cells that use the same subviews, I would have to implement the same fix. I want something that fixes this at the view level, rather than the cell level. So that when I use those same views in other custom cells for different table views, I don't have to worry about it.
This way is better than listening to the didSelectRowAtIndexPath for sure.
Play with these properties in your custom cell class:
override var isSelected: Bool {
didSet {
if isSelected {
//play with colors
print("selected")
} else {
//play with colors
print("deselected")
}
}
}
override var isHighlighted: Bool {
didSet {
if isHighlighted {
//play with colors
print("highlighted")
} else {
//play with colors
print("not highlighted")
}
}
}
Disable selection style:
cell.selectionStyle = UITableViewCellSelectionStyleNone
And tricky one:
cell.selectedBackgroundView = UIView()

swift change label on uitableviewcell background color

I have UItablview with custom cell i need to change a label background colour when select this row, but the label colour is repeated when scroll down
You could subclass your Cell like this (and cellForRow then will not be responsible for updating the color, only for setting default color).
class YourTableViewCellClass: UITableViewCell {
#IBOutlet weak var yourLabel: UILabel!
override func setSelected(_ selected: Bool, animated: Bool) {
if(selected) {
self.contentView.backgroundColor = UIColor.red //or what you want as your cell bg color
self.yourLabel.backgroundColor = UIColor.green //or what you want
} else {
self.contentView.backgroundColor = UIColor.white //or what you want as your cell bg color
self.yourLabel.backgroundColor = UIColor.red //or what you want
}
} }
What I understand is, you put code in didSelectRow method of tableview to change the color, but it shows previous color while scrolling.
So,you need to set condition in cellForRow method also e.g.
if(condition)
{
lbl.textcolor = x
}
else
{
lbl.textcolor = y
}

Unexpected box of color in UITableViewCell When Setting Background Color

Sometimes an unexpected box of color shows up in a UITableViewCell.
The following method ultimately gets called by tableView:cellForRowAtIndexPath:
func indicateAsDoneCell(cell: ButtDTaskListTableViewCell) {
if let itemName = cell.item?.name {
var attrs = [NSStrikethroughStyleAttributeName : 1]
cell.textLabel?.attributedText = NSMutableAttributedString(string:"\(itemName)", attributes: attrs)
cell.contentView.alpha = 0.5
cell.backgroundColor = self.allTasksAreDone() ? UIColor.yellowColor() : UIColor.darkGrayColor()
}
}
In Interface Builder, clip subviews is on for both the cell and content view. It's a Basic Style cell. It happens in iOS 7 and iOS 8.
What also may be related is that done items are moved/animated to the bottom when selected.
When I scroll the cells with the unexpected light-gray box off the screen and scroll it back onto the screen, I still see the unexpected light-gray box.
If I comment out the line that sets the cell's background, I sometimes get this.
Any idea as to what is going on with the light-gray box showing up in some of the Done items / cells?
Additional Code as requested.
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell : ButtDTaskListTableViewCell = tableView.dequeueReusableCellWithIdentifier("TaskCell", forIndexPath:indexPath) as ButtDTaskListTableViewCell;
cell.textLabel?.textColor = UIColor.whiteColor()
let sortedByDoneStatus = !tableView.editing // self.sortByDoneStatus
let item : ButtDTaskItem = taskManager.objectInListAtIndex(indexPath.row, sortedByDoneStatus:sortedByDoneStatus)
cell.item = item
indicateDoneStatusOnCell(cell, inEditMode:tableView.editing) // !tableView.editing
return cell;
}
func indicateDoneStatusOnCell(cell : ButtDTaskListTableViewCell, inEditMode:Bool) {
if let existingItem = cell.item? {
if (!inEditMode && existingItem.isDone) {
indicateAsDoneCell(cell)
} else {
indicateAsNotDoneCell(cell)
}
}
}
I got the box to go away by setting the following in Interface Builder:
a "Default" background color on the Table View
a "Default" background color on the Cell
a "Clear Color" on the Content View
a "Default" background color on the Label.
The data source no longer sets the background color nor changes the alpha. The willDisplayCell method sets the appropriate backgroundColor on the cell.

Resources