Skip to main content

DyteButton

Overview​

A button that follows Dyte's Design System.

Topics:​

Creating a button.​

public init(style: Style = .solid, dyteButtonState: States = .active, size: Size = .large, appearance: DyteButtonAppearance = DyteButtonAppearanceModel())

Creates DyteButton for the Style States Size you passed.

Parameters:​

Optional
style: passed any type of Style. Default value of style is solid.
dyteButtonState: passed any type of States. Default value of states is active.
size: passed any type of Size. Default value of size is large.
appearance: Any type which conforms to protocol DyteButtonAppearance

Style​

public enum Style {
  case solid
  case line
  case iconLeftLable(icon: DyteImage)
  case iconRightLable(icon: DyteImage)
  case text
  case textIconLeft(icon: DyteImage)
  case textIconRight(icon: DyteImage)
  case iconOnly(icon: DyteImage)
  case splitButton
}

States​

public enum States
{
  case active
  case disabled
  case hover
  case focus
  case pressed
}

Size​

public enum Size {
  case small
  case medium
  case large 
}

For example we can use DyteButton as follows

let dyteImage = DyteImage(image:ImageProvider.image(named: "icon_down_arrow"))
let downloadButton: DyteButton = {
    let button = DyteButton(style: .iconOnly(icon: dyteImage),
                  dyteButtonState: .active)
    button.backgroundColor = dyteSharedTokenColor.background.shade800
    button.isUserInteractionEnabled = false
    button.tintColor = .white
    // Set additional button properties if needed
    button.selectedStateTintColor = DesignLibrary.shared.color.status.danger
    return button
}()