EKLongPress 1.0.1

EKLongPress 1.0.1

Maintained by Erik Kamalov.



  • By
  • Erik Kamalov

Long-press context menu

About

The mobile screen has a more confined space than desktop. Have to be careful with the design layout of application interfaces, to create ergonomically right decisions. In some cases, we have multi-action buttons without a primary action. Putting all buttons to interface or hiding to a modal view can be wrong behavior for some solutions. We have designed the long-press context menu, which is called up by a long pressing on the screen of the mobile. Design on Dribble

If you ๐Ÿ‘ the project, do not forget โญ๏ธ me
Stay tuned for the latest updates Follow me ๐Ÿค™

contributions welcome Swift Version CocoaPods Build Status Carthage compatible License

Requirements

  • iOS 12.2+
  • Xcode 11+
  • Swift 5.0+

Features

Included in this repository there are 2 layouts, further will be added others:

  • Fully customizable
  • Auto calculable intersection
  • More contributing are very welcome ๐Ÿ™Œ

Example

First clone the repo, and run carthage update from the root directory. The example application is the best way to see EKLongPress in action. Simply open the EKLongPress.xcodeproj and run the Example scheme.

Installation

CocoaPods

EKLayout is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'EKLongPress'

Carthage

Carthage is a decentralized dependency manager that builds your dependencies and provides you with binary frameworks.

To integrate EKLongPress into your Xcode project using Carthage, specify it in your Cartfile:

github "ekamalov/EKLongPress"

Run carthage update to build the framework and drag the built EKLongPress.framework into your Xcode project.

On your application targetsโ€™ โ€œBuild Phasesโ€ settings tab, click the โ€œ+โ€ icon and choose โ€œNew Run Script Phaseโ€ and add the Framework path as mentioned in Carthage Getting started Step 4, 5 and 6

Manually

If you prefer not to use any of the aforementioned dependency managers, you can integrate EKLongPress into your project manually. Simply drag the Sources Folder into your Xcode project.

Usage

After installing the lib and importing the module EKLongPress, the text field can be used like any other text field. ContextMenu initializer

    /// - Parameter items: Items
    /// - Parameter aling: To position relative to the ability to specify alignment. The items can be layouted relative to one or many comparable views.
    /// - Parameter preference: Preference used to customize the appearance
    /// - Parameter selectedItem: Close if selected item
    /// - Parameter debug: For developer
    public init(items: [EKItem], aling:ItemsAling = .center, preference: Preference = .init(),
    selectedItem: ((_ item:EKItem) -> Void)? , debug:Bool = false) {
    }

Initializer EKItem

    /// - Parameter title: Title of the item
    /// - Parameter icon: Icon of the iten
    /// - Parameter preference: Item appearance
    public init(title: String, icon: UIImage, preference: Preference.ContextMenu.Item) {
    }

Using

/// Example
// First needed to create an array of type EKItem you desire to show.
// For each item, you can create your appearance setting
let items: [EKItem] = [ EKItem.init(title:"Save", icon: #imageLiteral(resourceName: "add")),
                       EKItem.init(title:"Watch Trailer", icon: #imageLiteral(resourceName: "play")),
                       EKItem.init(title:"Share", icon: #imageLiteral(resourceName: "share")),
                       EKItem.init(title:"More", icon: #imageLiteral(resourceName: "more"))]

var cons = EKContextMenu(items: items, aling: .center, selectedItem: nil, debug: false)
view.addGestureRecognizer(cons.buildGesture()) // to add gesture call buildGesture method

If you want to change the appearance look Customizing heading or below๐Ÿ‘‡. use setAppearance method

let items: [EKItem] = [ EKItem.init(title:"Save", icon: #imageLiteral(resourceName: "add")),
                        EKItem.init(title:"Watch Trailer", icon: #imageLiteral(resourceName: "play")),
                        EKItem.init(title:"Share", icon: #imageLiteral(resourceName: "share")),
                        EKItem.init(title:"More", icon: #imageLiteral(resourceName: "more"))]

var cons = EKContextMenu(items: items, aling: .center, selectedItem: nil, debug: false)

var preference = Preference.init()
preference.menu.titleFont = Fonts.GilroyBold.withSize(48)
cons.setAppearance(preference: preference)

view.addGestureRecognizer(cons.buildGesture()) // to add gesture call buildGesture method

Customizing

In order to customize the EKLongPress appearance and behavior, you can play with the Preferences structure which encapsulates all the customizable properties. These preferences have been split into three structures:

Basic

encapsulates customizable properties specifying how EKLongPress will be drawn on the screen. See the default values:

/// Use the backgroundColor property to change the color of the context menu backgroundColor. By default, uses white with alpha 0.9
public var backgroundColor: UIColor = UIColor.black.withAlphaComponent(0.9)

/// Use the itemsDistance property to change the distance of the items between. By default, uses 15px
public var itemsDistance:CGFloat = 15

/// Use the itemDistFromCenter property to change the distance from of the item to touch point. By default, uses 15px
public var itemDistFromCenter:CGFloat = 34

/// Use the titleFont property to change the font of the  title font. By default user "Gilroy-SemiBold"  with size 48
public var titleFont:UIFont = .systemFont(ofSize: 48)

/// Use the titleColor property to change the color of the title text. By default, uses white with alpha 0.9
public var titleColor:UIColor = .white

/// Use the titleDistance property to change the distance from of the item to title text. By default, uses 64px
public var titleDistance:CGFloat = 64

/// Use the marginOfScreen property to change tThe indent from the edge of the screen. By default, uses 20px
public var marginOfScreen:CGFloat = 20

TouchPoint

You can format TouchPoint with your own parameters. Use this to get your desired style. See the default values:

/// Use the color property to change the color of the touch point. By default, uses white with alpha 0.1
public var color: UIColor = UIColor.white.withAlphaComponent(0.1)

/// The size of the touch location view // default 44
public var size: CGFloat = 44

/// The size of the touch location view // default value 6
public var borderWidth:CGFloat = 6

Item

Use this to get your desired style.. See the default values:

/// Use the backgroundColor property to change the color of the item background. By default, uses white with alpha 0.1
public var backgroundColor:ColotState = .init(active: .white,
                                              inactive: .init(red: 28 / 255, green: 28 / 255, blue: 28 / 255, alpha: 1))

/// Use the iconColor property to change the color of the icon color. By default, uses white with alpha 0.1
public var iconColor:ColotState = .init(active: .black, inactive: .white)

/// Use the iconSize property to change the size of the icon. By default, user width: 24, height: 24
public var iconSize:CGSize = .init(width: 24, height: 24)

/// Use the size property to change the size of the item. By default, user 56
public var size: CGFloat = 56

Contributing

Contributions are very welcome ๐Ÿ™Œ

License

EKLongPress is released under the MIT license. Check LICENSE.md for details.

  MIT License

  Copyright (c) 2019 Erik Kamalov <[email protected]>

  Permission is hereby granted, free of charge, to any person obtaining a copy
  of this software and associated documentation files (the "Software"), to deal
  in the Software without restriction, including without limitation the rights
  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  copies of the Software, and to permit persons to whom the Software is
  furnished to do so, subject to the following conditions:

  The above copyright notice and this permission notice shall be included in all
  copies or substantial portions of the Software.

  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  SOFTWARE.