Search code examples
iosswiftobjective-cuiimageview

how to programmatically show a colored disk behind a UIImageView, in swift on an iOS device


I have an icon that I programmatically display.
How can I display a solid, colored disk behind the icon, at the same screen position?

Icon is opaque.

I will sometimes programmatically change screen position and disk's diameter and color.

Here's how I programmatically display the icon now.............

DispatchQueue.main.async
{

       ViewController.wrist_band_UIImageView.frame = CGRect(   x: screen_position_x, 
                                                               y: screen_position_y,
                                                               width: App_class.screen_width,
                                                               height: App_class.screen_height)
}

UPDATE #1 for D.Mika below... enter image description here

UPDATE #2 for D.Mika below...

import UIKit
            import Foundation


class ViewController: UIViewController 
{
    static var circleView: UIView!

    static let wrist_band_UIImageView: UIImageView = {
       let theImageView = UIImageView()
       theImageView.image = UIImage( systemName: "applewatch" )
       theImageView.translatesAutoresizingMaskIntoConstraints = false 
       return theImageView
    }()

    override func viewDidLoad()     
    {
            super.viewDidLoad()

            view.addSubview( ViewController.wrist_band_UIImageView )
        // Init disk image:
        ViewController.circleView = UIView(frame: CGRect(x: 0.0, y: 0.0, width: 100.0, height: 100.0))
        ViewController.circleView.backgroundColor = .red
        ViewController.circleView.layer.cornerRadius = view.bounds.size.height / 2.0
        ViewController.circleView.clipsToBounds = true
            // Add view to view hierarchy below image view
        ViewController.circleView.insertSubview(view, belowSubview: ViewController.wrist_band_UIImageView)


        App_class.display_single_wearable()
    }
 }

 class App_class
 {
    static var is_communication_established = false
    static var total_packets = 0

    static func display_single_wearable()
    {
                ViewController.wrist_band_UIImageView.frame = CGRect(x: 0, y: 0,
                                                                      width: 100, height: 100)

                ViewController.circleView.frame = CGRect(   x: 0,
                                             y: 0,
                                             width: 100,
                                             height: 100)
                ViewController.circleView.layer.cornerRadius = 100
    }

    static func process_location_xy(text_location_xyz: String)
    {}
} // App_class

enter image description here


Solution

  • The following answer works.

    The answers from d.mika above did not work. Plus, he was insulting. ;-)

    // Show red circle
        let circlePath = UIBezierPath(arcCenter: CGPoint(x: 200, y: 400), radius: CGFloat(40), startAngle: CGFloat(0), endAngle: CGFloat(Double.pi * 2), clockwise: true)
        
        let shapeLayer = CAShapeLayer()
        shapeLayer.path = circlePath.cgPath
        
        // Change the fill color
        shapeLayer.fillColor = UIColor.red.cgColor
        // You can change the stroke color
        shapeLayer.strokeColor = UIColor.red.cgColor
        // You can change the line width
        shapeLayer.lineWidth = 3.0
        
        view.layer.addSublayer(shapeLayer)