Removing a subview then adding it back - ios

I have a UICollectionViewCell with a gradient subview.
In my view controller, I have buttons that are sorting CoreData and then reloadData() on the UICollectionView.
To avoid my gradient subview to be drawn again and again (as it happened in the past), I implement removeFromSuperview() in prepareForReuse().
There I also implement a flag that keeps track of gradient existence so I still add a new gradient when cell is load.
However after removing the gradient, my willMove(toSuperview: ) doesn't work, and gradient view doesn't appear.
What's wrong with my logic?
class CollectionCell: UICollectionViewCell {
#IBOutlet weak var mealImg: UIImageView!
#IBOutlet weak var mealTitleLbl: UILabel!
#IBOutlet weak var gradientView: UIView!
var gradientWasRemoved = false
func configureCell(meal: Meal) {
mealTitleLbl.text = meal.title
let img = meal.getMealImage()
mealImg.image = img
addGradient()
}
func addGradient () {
let gradient = CAGradientLayer()
gradient.frame = gradientView.bounds
let topColor = UIColor(red:0.07, green:0.07, blue:0.07, alpha:1)
let botomColor = UIColor.clear
gradient.colors = [topColor.cgColor, botomColor.cgColor]
gradientView.layer.insertSublayer(gradient, at: 0)
if gradientWasRemoved == true {
gradientView.willMove(toSuperview: self)
}
}
override func prepareForReuse() {
super.prepareForReuse()
gradientView.removeFromSuperview()
gradientWasRemoved = true
}
}

I was able to fix the logic with following.
In UICollectionViewCell class:
import UIKit
class CollectionCell: UICollectionViewCell {
#IBOutlet weak var mealImg: UIImageView!
#IBOutlet weak var gradientView: UIView!
#IBOutlet weak var mealTitleLbl: UILabel!
var gradientWasRemoved = false
func configureCell(meal: Meal) {
mealTitleLbl.text = meal.title
let img = meal.getMealImage()
mealImg.image = img
addGradient()
}
func addGradient () {
let gradient = CAGradientLayer()
gradient.frame = gradientView.bounds
let topColor = UIColor(red:0.07, green:0.07, blue:0.07, alpha:1)
let botomColor = UIColor.clear
gradient.colors = [topColor.cgColor, botomColor.cgColor]
if gradientWasRemoved == false {
gradientView.layer.insertSublayer(gradient, at: 0)
} else if gradientWasRemoved == true {
self.addSubview(gradientView)
}
}
override func prepareForReuse() {
super.prepareForReuse()
gradientView.removeFromSuperview()
gradientWasRemoved = true
}
}
In prepareForReuse( ) I didn't delete gradientView, I removed it from the Superview. I set the flag there that it was removed.
Since I didn't nil my gradientView i was able to run addGradient() and access gradientView.bounds for creation of new CGGradientLayer.
Right before adding a new layer to gradientView, I performed if check. If we did remove gradientView then we don't add a new CGGradientLayer but simply put our gradientView back.
This way we add CGGradientLayer to our gradientView only once.
I learned that by removing views from Superview they are still alive and can be edited.
Thank you #Luis and #LeoDabus for your contribution.

Related

UIView: how does the appearance() proxy work?

I have created a simple custom UIView:
final class TestView: UIView {
var testColor: UIColor = .white {
didSet {
backgroundColor = testColor
}
}
}
Then I wrote this in my view controller:
import UIKit
class ViewController: UIViewController {
#IBOutlet weak var testView: TestView!
#IBOutlet weak var testView2: TestView!
override func viewDidLoad() {
super.viewDidLoad()
DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 3) {
TestView.appearance().testColor = .red
}
}
}
By doing this, I get an error:
Could you help me understanding what's wrong here and how to implement the UIAppearance proxy for any custom UIView?
Thank you for your help
You need to make the property #objc and dynamic:
final class TestView: UIView {
#objc dynamic var testColor: UIColor? = .white {
didSet {
backgroundColor = testColor
}
}
}
Worth noting: the UIAppearance proxy does NOT affect views which are already part of the view hierarchy.
So, in your example, adding #objc dynamic to your property will get rid of the crash, but you will not see any change to the two #IBOutlet views.
If you call it as part of viewDidLoad() (instead of DispatchQueue.main.asyncAfter):
override func viewDidLoad() {
super.viewDidLoad()
TestView.appearance().testColor = .red
}
The two #IBOutlet views will get the red background.
Or, if you add a new view to the hierarchy, it will get the red background:
class AppearanceTestViewController: UIViewController {
#IBOutlet weak var testView: TestView!
#IBOutlet weak var testView2: TestView!
override func viewDidLoad() {
super.viewDidLoad()
DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 3) {
TestView.appearance().testColor = .red
self.addAnotherTestView()
}
}
func addAnotherTestView() -> Void {
let v = TestView()
v.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(v)
NSLayoutConstraint.activate([
v.widthAnchor.constraint(equalToConstant: 240.0),
v.heightAnchor.constraint(equalTo: v.widthAnchor),
v.centerXAnchor.constraint(equalTo: view.centerXAnchor),
v.centerYAnchor.constraint(equalTo: view.centerYAnchor),
])
// this newly added view WILL have a red background
}
}

UIVisualEffectView added to UICollectionViewCell visibly

I have UICollectionView with a lot of cells. The cells have images on them that need to be blurred. That's why I am adding UIVisualEffectView with blur effect to the image views. The cells are like pages - every cell takes up the whole screen.
The problem is with the second cell. When it appears the blurred view is added visibly and it's ugly. The rest of the cells have the blurred view already when they become visible on the screen and are okay. This is the code I am using to add the blur view:
class ImageCell: UICollectionViewCell {
#IBOutlet weak var mainImageView: UIImageView!
#IBOutlet weak var backgroundImageView: UIImageView!
override func awakeFromNib() {
super.awakeFromNib()
let regularBlur = UIBlurEffect(style: .regular)
let blurView = UIVisualEffectView(effect: regularBlur)
blurView.frame = backgroundImageView.bounds
blurView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
backgroundImageView.addSubview(blurView)
}
}
Modifying your code:
class ImageCell: UICollectionViewCell {
#IBOutlet weak var mainImageView: UIImageView!
#IBOutlet weak var backgroundImageView: UIImageView!
override func awakeFromNib() {
super.awakeFromNib()
backgroundImageView.isHidden = true
let regularBlur = UIBlurEffect(style: .regular)
let blurView = UIVisualEffectView(effect: regularBlur)
blurView.frame = backgroundImageView.bounds
blurView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
backgroundImageView.addSubview(blurView)
backgroundImageView.isHidden = false
}
}
You can code like this:
class ImageCell: UICollectionViewCell {
#IBOutlet weak var mainImageView: UIImageView!
#IBOutlet weak var backgroundImageView: UIImageView!
let blurView = UIVisualEffectView(effect: UIBlurEffect(style: .regular))
override func awakeFromNib() {
super.awakeFromNib()
blurView.frame = backgroundImageView.bounds
blurView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
backgroundImageView.addSubview(blurView)
}
override func prepareForReuse() {
blurView.isHidden = true
}
}

Weird Button Animation

It's my first try on IOS animation, so if I'm worry from the very beginning, just tell me the right direction.
All I want: when I click ButtonOne, Label disappears slowly.
The code as below:
import UIKit
class ViewController: UIViewController {
#IBOutlet weak var labelHeight: NSLayoutConstraint!
private var isHidden: Bool = false
#IBAction func clickButtonOne(sender: UIButton) {
isHidden = !isHidden
if isHidden {
labelHeight.constant = 0
} else {
labelHeight.constant = 60
}
UIView.animateWithDuration(1.0, animations: {
() -> Void in
self.view.layoutIfNeeded()
}, completion: nil)
}
override func viewDidLoad() {
super.viewDidLoad()
}
}
Before I click ButtonOne:
After I click ButtonOne(label shrinks from bottom to top):
The UILabel is disappearing, but it's content is still visible.
You need to set the clipsToBounds property of the UILabel to true.
label.clipsToBounds = true
You can set the same property in the interface builder by checking the Clip Subviews property in the attributes inspector.
I think you should also animate UIView.alpha property:
import UIKit
class ViewController: UIViewController {
#IBOutlet weak var button: UIButton!
#IBOutlet weak var labelHeight: NSLayoutConstraint!
private var isHidden: Bool = false
#IBAction func clickButtonOne(sender: UIButton) {
isHidden = !isHidden
var alpha: CGFloat = 1
if isHidden {
alpha = 0
labelHeight.constant = 0
} else {
labelHeight.constant = 60
}
UIView.animateWithDuration(1.0, animations: {
() -> Void in
self.button.alpha = alpha
self.view.layoutIfNeeded()
}, completion: nil)
}
override func viewDidLoad() {
super.viewDidLoad()
}
}

horizontally scaling a background color image

I am new to iOS and Swift. I am trying to add a background image for a slide right effect. I want that image to stick to the right of the screen no matter what orientation. The image will always be a set size (now its (382x145px). How can I adjust it on landscape orientation so that the picture stays to the right.
Here is my custom view cell class.
class CustomRouteViewCell: UITableViewCell {
#IBOutlet var downImage: UIImageView!
#IBOutlet var downTime: UILabel!
#IBOutlet weak var leadingSpaceConstraint: NSLayoutConstraint!
#IBOutlet weak var trailingSpaceConstraint: NSLayoutConstraint!
#IBOutlet var locationTitle: UILabel!
#IBOutlet weak var panView: UIView!
#IBOutlet var timerLabel: UILabel!
var indexRow: Int = 0
var timeInterval: Int = 0
override func awakeFromNib() {
super.awakeFromNib()
self.selectedBackgroundView = nil
var img = UIImage(named: "tableSwipeArrow.png")!
self.panView.backgroundColor = UIColor(patternImage: img)
if self.respondsToSelector(Selector("setLayoutMargins:")) {
layoutMargins = UIEdgeInsetsZero
}
if self.respondsToSelector(Selector("setPreservesSuperviewLayoutMargins:")) {
preservesSuperviewLayoutMargins = false
}
var panGestureRecognizer = UIPanGestureRecognizer(target: self, action: "handlePanGesture:")
panGestureRecognizer.delegate = self
addGestureRecognizer(panGestureRecognizer)
}
func handlePanGesture(recognizer: UIPanGestureRecognizer) {
switch(recognizer.state) {
case UIGestureRecognizerState.Changed:
var translation = recognizer.translationInView(recognizer.view!)
var little = CGFloat(trailingSpaceConstraint.constant + translation.x * -1)
trailingSpaceConstraint.constant = fmax(0, little)
leadingSpaceConstraint.constant = fmin(0, leadingSpaceConstraint.constant + translation.x)
recognizer.setTranslation(CGPointZero, inView: recognizer.view!)
timeInterval = Int(trailingSpaceConstraint.constant / 30) * 5
timerLabel.text! = "\(timeInterval)"
case UIGestureRecognizerState.Ended, UIGestureRecognizerState.Cancelled:
var refreshAlert = Alarm.getReminderView(self.timeInterval, view: self.parentViewController!.view)
self.parentViewController?.presentViewController(refreshAlert, animated: true, completion: nil)
leadingSpaceConstraint.constant = 0
trailingSpaceConstraint.constant = 0
UIView.animateWithDuration(0.25, animations: { () -> Void in
self.layoutIfNeeded()
})
default:
trailingSpaceConstraint.constant = 0
leadingSpaceConstraint.constant = 0
}
}
}
extension CustomRouteViewCell: UIGestureRecognizerDelegate
{
override func gestureRecognizerShouldBegin(gestureRecognizer: UIGestureRecognizer) -> Bool {
if gestureRecognizer.isKindOfClass(UIPanGestureRecognizer) {
var velocity = (gestureRecognizer as! UIPanGestureRecognizer).velocityInView(gestureRecognizer.view!)
return fabs(velocity.x) > fabs(velocity.y)
}
return true;
}
}
Use auto layout to link the position of the images.
In your case you can connect the trailing of the background image with the container view.
Hold Control on image and link the Trailing Attribute with the main view
Just adjust the constant to 0.

Implementing Protocol in Swift to Change UIView's Attribute

I thought I wrote this correctly. I'm trying to get a value set in another viewcontroller (then stored in a singleton) to change the height of the rectangle in my BarGraphView, but my BarGraphView doesn't redraw when the value I'm passing in is changed...can anyone spot what I'm missing?
BarGraphViewController:
import UIKit
class BarGraphViewController: UIViewController, BarGraphViewDataSource {
#IBOutlet weak var barGraphView: BarGraphView! {
didSet {
barGraphView.datasource = self
}
}
#IBOutlet weak var testLabel: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
}
var firstBarHeight: Int = 30 {
didSet {
firstBarHeight = SharkTankSingleton.instance.firstInvestorTotalasInt / 250
updateUI()
}
}
private func updateUI() {
barGraphView.setNeedsDisplay()
}
func firstBarHeightForBarGraphView(sender: BarGraphView) -> CGFloat? {
return CGFloat(firstBarHeight)
}
BarGraphView:
import UIKit
protocol BarGraphViewDataSource: class {
func firstBarHeightForBarGraphView(sender: BarGraphView) -> CGFloat?
}
#IBDesignable
class BarGraphView: UIView {
#IBInspectable var firstBarColor: UIColor = UIColor.blueColor()
weak var datasource: BarGraphViewDataSource?
override func drawRect(rect: CGRect) {
let firstBarHeight = datasource?.firstBarHeightForBarGraphView(self) ?? 0
let firstBar = CGRect(x: 200, y: 400, width: 30, height: firstBarHeight)
// firstBarColor.setFill()
var firstBarPath = UIBezierPath(rect: firstBar)
UIColor.redColor().setFill()
firstBarPath.fill()

Resources