{"id":13828897,"url":"https://github.com/mergesort/Slope","last_synced_at":"2025-07-09T06:33:30.494Z","repository":{"id":38554530,"uuid":"139730560","full_name":"mergesort/Slope","owner":"mergesort","description":"A simpler way to implement gradients on iOS.","archived":false,"fork":false,"pushed_at":"2021-01-17T15:13:33.000Z","size":156,"stargazers_count":237,"open_issues_count":0,"forks_count":7,"subscribers_count":7,"default_branch":"main","last_synced_at":"2024-05-01T19:26:28.013Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Swift","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mergesort.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-07-04T14:08:55.000Z","updated_at":"2023-08-18T08:25:09.000Z","dependencies_parsed_at":"2022-08-25T07:01:25.314Z","dependency_job_id":null,"html_url":"https://github.com/mergesort/Slope","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mergesort%2FSlope","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mergesort%2FSlope/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mergesort%2FSlope/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mergesort%2FSlope/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mergesort","download_url":"https://codeload.github.com/mergesort/Slope/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225492420,"owners_count":17482869,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-04T09:03:18.341Z","updated_at":"2024-11-20T08:31:20.735Z","avatar_url":"https://github.com/mergesort.png","language":"Swift","funding_links":[],"categories":["Swift","HarmonyOS"],"sub_categories":["Windows Manager"],"readme":"# Slope\n\n#### Flat is out, so let's make depth easy.\n\n---\n\n[![Pod Version](https://img.shields.io/badge/Pod-1.3.0-6193DF.svg)](https://cocoapods.org/)\n![Swift Version](https://img.shields.io/badge/Swift-5.1-brightgreen.svg)\n![License MIT](https://img.shields.io/badge/License-MIT-lightgrey.svg) \n![Plaform](https://img.shields.io/badge/Platform-iOS-lightgrey.svg)\n\n### Gradients are coming back in style, so let's party like it's 1989 again. \n\nUse them for backgrounds, use them for UI elements, use them to make yourself happy.\n\n![](Images/gradient_examples.png)\n\n---\n\nThe built in `CAGradientLayer` API is overly complex, doesn't work with auto layout, and is very fiddly. \n\nUsing Slope is simple.\n\nSimple is better than complex!\n\n#### Let's build a gradient view like above:\n\n```swift\nimport Slope\n\nlet gradientView = GradientView()\ngradientView.gradient = UniformGradient(colors: [.darkGray, .lightGray])\n```\n\nThere is no step 2. You now have a `UIView` subclass that you can add to your screen.\n\n#### Let's build the save button above:\n\nWe're going to make it a little nicer by adding a highlighting effect when you touch down.\n\n```swift\nfinal class GradientButton: UIControl {\n\n    let titleLabel: UILabel = {\n        let label = UILabel()\n        label.textColor = UIColor.white\n        label.font = UIFont.systemFont(ofSize: 24.0)\n        label.textAlignment = .center\n\n        return label\n    }()\n\n    override var tintColor: UIColor! {\n        didSet {\n            self.backgroundColor = self.tintColor\n            self.highlightedColor = self.tintColor.darkened(byPercentage: 0.1)\n            \n            let lightGreen = #colorLiteral(red: 0, green: 0.8235294118, blue: 0.5764705882, alpha: 1)\n            self.backgroundGradientView.gradient = PercentageGradient(baseColor: lightGreen, percentage: 0.06)\n        }\n    }\n\n    private let backgroundGradientView = GradientView()\n\n    private var highlightedColor: UIColor?\n\n    // MARK: Initializers\n\n    override init(frame: CGRect) {\n        super.init(frame: frame)\n\n        self.setup()\n    }\n\n    @available(*, unavailable)\n    required init?(coder aDecoder: NSCoder) {\n        fatalError(\"init(coder:) has not been implemented\")\n    }\n\n    // MARK: Touch down effects\n\n    override func touchesBegan(_ touches: Set\u003cUITouch\u003e, with event: UIEvent?) {\n        super.touchesBegan(touches, with: event)\n\n        self.backgroundColor = self.highlightedColor\n        self.backgroundGradientView.tintColor = self.highlightedColor ?? self.tintColor\n    }\n\n    override func touchesEnded(_ touches: Set\u003cUITouch\u003e, with event: UIEvent?) {\n        super.touchesEnded(touches, with: event)\n\n        self.backgroundColor = self.tintColor\n        self.backgroundGradientView.tintColor = self.tintColor\n    }\n\n    override func touchesCancelled(_ touches: Set\u003cUITouch\u003e, with event: UIEvent?) {\n        super.touchesCancelled(touches, with: event)\n\n        self.backgroundColor = self.tintColor\n        self.backgroundGradientView.tintColor = self.tintColor\n    }\n}\n\nprivate extension GradientButton {\n\n    func setup() {\n        self.addSubview(self.backgroundGradientView)\n        self.backgroundGradientView.pinToSuperview()\n\n        self.addSubview(self.titleLabel)\n\n        self.setupConstraints()\n    }\n\n    func setupConstraints() {\n        self.backgroundGradientView.translatesAutoresizingMaskIntoConstraints = false\n\n        let backgroundConstraints = [\n            self.backgroundGradientView.leadingAnchor.constraint(equalTo: self.leadingAnchor),\n            self.backgroundGradientView.trailingAnchor.constraint(equalTo: self.trailingAnchor),\n            self.backgroundGradientView.topAnchor.constraint(equalTo: self.topAnchor),\n            self.backgroundGradientView.bottomAnchor.constraint(equalTo: self.bottomAnchor)\n        ]\n        \n        NSLayoutConstraint.activate(backgroundConstraints)\n\n        self.titleLabel.translatesAutoresizingMaskIntoConstraints = false\n\n        let titleLabelConstraints = [\n            self.titleLabel.leadingAnchor.constraint(equalTo: self.leadingAnchor),\n            self.titleLabel.trailingAnchor.constraint(equalTo: self.trailingAnchor),\n            self.titleLabel.topAnchor.constraint(equalTo: self.topAnchor),\n            self.titleLabel.bottomAnchor.constraint(equalTo: self.bottomAnchor)\n        ]\n        \n        NSLayoutConstraint.activate(titleLabelConstraints)\n    }\n\n}\n```\n\nAnd voilà, a beautiful gradient button with highlighting that you can reuse across your app.\n\n---\n\n#### Types of Gradients\n\nThere are two current types of gradients, `UniformGradient` and `PercentageGradient`. \n\nYou can create your own as you see fit by conforming to the `Gradient` protocol.\n\n- If you want to make a radial gradient, go wild. \n- If you want to make a diagonal gradient, that works too. \n- If you come up with something creative, contribute to the project!\n\n\n## Installation\n\nYou can use [SPM](https://swift.org/package-manager/) to install `GenericCells`.\n\nYou can also use [CocoaPods](http://cocoapods.org/) to install `Slope` by adding it to your `Podfile`:\n\n```swift\nplatform :ios, '9.0'\nuse_frameworks!\n\npod 'Slope'\n```\n\nOr install it manually by downloading `Gradient.swift`, `UniformGradient.swift`, `PercentageGradient.swift`, and `GradientView.swift`, and dropping them in your project.\n\n## About me\n\nHi, I'm [Joe](http://fabisevi.ch) everywhere on the web, but especially on [Twitter](https://twitter.com/mergesort).\n\n## License\n\nSee the [license](LICENSE) for more information about how you can use Slope.\n\n## Is that it?\n\nYep, that's it. Good night, and have a pleasant tomorrow.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmergesort%2FSlope","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmergesort%2FSlope","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmergesort%2FSlope/lists"}