Skip to content

Instantly share code, notes, and snippets.

@harshvishu
Created August 20, 2020 07:41
Show Gist options
  • Select an option

  • Save harshvishu/94b7297de06a727c14bba6da355c6f92 to your computer and use it in GitHub Desktop.

Select an option

Save harshvishu/94b7297de06a727c14bba6da355c6f92 to your computer and use it in GitHub Desktop.

Revisions

  1. harshvishu created this gist Aug 20, 2020.
    138 changes: 138 additions & 0 deletions ConnectorView.swift
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,138 @@
    //
    // ConnectorView.swift
    // Helper
    //
    // Created by Harsh 20/08/20.
    // Copyright © 2020 Harsh. All rights reserved.
    //

    import UIKit

    @IBDesignable
    class ConnectorView: UIView {

    @IBInspectable
    var firstColor: UIColor? {
    get {
    return firstSeparator.backgroundColor
    }

    set {
    firstSeparator.backgroundColor = newValue
    }
    }

    @IBInspectable
    var fullColor: UIColor? {
    get {
    return fullSeparator.backgroundColor
    }

    set {
    fullSeparator.backgroundColor = newValue
    }
    }

    @IBInspectable
    var lastColor: UIColor? {
    get {
    return lastSeparator.backgroundColor
    }

    set {
    lastSeparator.backgroundColor = newValue
    }
    }

    // MARK: - INitialization

    override init(frame: CGRect) {
    super.init(frame: frame)
    xibSetup()
    }

    required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    xibSetup()
    }

    // MARK: - IBOutlet

    @IBOutlet var firstSeparator: UIView!
    @IBOutlet var fullSeparator: UIView!
    @IBOutlet var lastSeparator: UIView!

    // MARK: - Properties

    var contentView: UIView!
    var lineColor: UIColor = #colorLiteral(red: 0.9294117647, green: 0.9450980392, blue: 0.9607843137, alpha: 1)
    let strokeWidth: CGFloat = 0.5

    var mode: Mode = .end {
    didSet {
    switch mode {
    case .only:
    firstSeparator.isHidden = true
    fullSeparator.isHidden = true
    lastSeparator.isHidden = true
    case .start:
    firstSeparator.isHidden = false
    fullSeparator.isHidden = true
    lastSeparator.isHidden = true
    case .end:
    firstSeparator.isHidden = true
    fullSeparator.isHidden = true
    lastSeparator.isHidden = false
    case .node:
    firstSeparator.isHidden = true
    fullSeparator.isHidden = false
    lastSeparator.isHidden = true
    }
    }
    }

    // MARK: - Methods

    func xibSetup() {
    contentView = loadViewFromNib()

    // use bounds not frame or it'll be offset
    contentView.frame = bounds

    // Make the view stretch with containing view
    contentView.autoresizingMask = [UIView.AutoresizingMask.flexibleWidth, UIView.AutoresizingMask.flexibleHeight]

    // Adding custom subview on top of our view (over any custom drawing > see note below)
    addSubview(contentView)
    }

    func loadViewFromNib() -> UIView! {

    // swiftlint:disable all
    let bundle = Bundle(for: type(of: self))
    let nib = UINib(nibName: String(describing: type(of: self)), bundle: bundle)
    let view = nib.instantiate(withOwner: self, options: nil).first as! UIView
    // swiftlint:enable all
    return view
    }

    // MARK: - Nested Properties

    enum Mode {
    case start, node, end, only

    static func getConnectorModeFrom(index: Int, count: Int) -> Mode {
    if count == 1 {
    return .only
    }
    switch index {
    case 0:
    return .start
    case count - 1:
    return .end
    default:
    return .node
    }
    }
    }
    }
    64 changes: 64 additions & 0 deletions ConnectorView.xib
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,64 @@
    <?xml version="1.0" encoding="UTF-8"?>
    <document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="14313.18" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
    <device id="retina4_7" orientation="portrait">
    <adaptation id="fullscreen"/>
    </device>
    <dependencies>
    <deployment identifier="iOS"/>
    <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14283.14"/>
    <capability name="Safe area layout guides" minToolsVersion="9.0"/>
    <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
    </dependencies>
    <objects>
    <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner" customClass="ConnectorView" customModule="Hoberman_Client" customModuleProvider="target">
    <connections>
    <outlet property="firstSeparator" destination="476-ht-4Pu" id="H8w-Qk-ZBG"/>
    <outlet property="fullSeparator" destination="jgN-wF-uoT" id="n0S-Me-ZR9"/>
    <outlet property="lastSeparator" destination="4mQ-tf-PFg" id="cvF-UP-SAv"/>
    </connections>
    </placeholder>
    <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
    <view contentMode="scaleToFill" id="iN0-l3-epB">
    <rect key="frame" x="0.0" y="0.0" width="375" height="290"/>
    <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
    <subviews>
    <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="476-ht-4Pu" userLabel="first">
    <rect key="frame" x="187.5" y="145" width="0.5" height="145"/>
    <color key="backgroundColor" red="0.92941176470588238" green="0.94509803921568625" blue="0.96078431372549022" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
    <constraints>
    <constraint firstAttribute="width" constant="0.5" id="efY-AW-ZbU"/>
    </constraints>
    </view>
    <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="jgN-wF-uoT" userLabel="full">
    <rect key="frame" x="187.5" y="0.0" width="0.5" height="290"/>
    <color key="backgroundColor" red="0.92941176470588238" green="0.94509803921568625" blue="0.96078431372549022" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
    <constraints>
    <constraint firstAttribute="width" constant="0.5" id="iUq-Ti-HMx"/>
    </constraints>
    </view>
    <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="4mQ-tf-PFg" userLabel="last">
    <rect key="frame" x="187.5" y="0.0" width="0.5" height="145"/>
    <color key="backgroundColor" red="0.92941176470588238" green="0.94509803921568625" blue="0.96078431372549022" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
    <constraints>
    <constraint firstAttribute="width" constant="0.5" id="Q0U-gg-KmE"/>
    </constraints>
    </view>
    </subviews>
    <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
    <constraints>
    <constraint firstItem="4mQ-tf-PFg" firstAttribute="centerX" secondItem="vUN-kp-3ea" secondAttribute="centerX" id="6Co-dn-So0"/>
    <constraint firstItem="jgN-wF-uoT" firstAttribute="centerX" secondItem="vUN-kp-3ea" secondAttribute="centerX" id="81I-JQ-hjB"/>
    <constraint firstItem="4mQ-tf-PFg" firstAttribute="height" secondItem="iN0-l3-epB" secondAttribute="height" multiplier="0.5" id="A8R-sf-xw9"/>
    <constraint firstItem="4mQ-tf-PFg" firstAttribute="top" secondItem="vUN-kp-3ea" secondAttribute="top" id="FJy-Pl-6Qp"/>
    <constraint firstItem="vUN-kp-3ea" firstAttribute="bottom" secondItem="476-ht-4Pu" secondAttribute="bottom" id="KCV-zR-Ofk"/>
    <constraint firstItem="476-ht-4Pu" firstAttribute="height" secondItem="iN0-l3-epB" secondAttribute="height" multiplier="0.5" id="Sau-2t-PHa"/>
    <constraint firstItem="476-ht-4Pu" firstAttribute="centerX" secondItem="vUN-kp-3ea" secondAttribute="centerX" id="aEb-bD-NBm"/>
    <constraint firstItem="vUN-kp-3ea" firstAttribute="bottom" secondItem="jgN-wF-uoT" secondAttribute="bottom" id="gUj-r1-VKE"/>
    <constraint firstItem="jgN-wF-uoT" firstAttribute="top" secondItem="vUN-kp-3ea" secondAttribute="top" id="jkC-Co-yWC"/>
    </constraints>
    <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
    <viewLayoutGuide key="safeArea" id="vUN-kp-3ea"/>
    <point key="canvasLocation" x="55.200000000000003" y="-121.4392803598201"/>
    </view>
    </objects>
    </document>