- Previous + Previous       - Next + Next

Customization

This guide shows you how to customize UI style and view mode in TinyCrayon SDK

@@ -115,7 +115,7 @@

Customize UI style

The TCUIView is an abstraction of UI related styles of UIView, the following graph shows the TCUIView components of TCMaskView:


-

Responsive image

+

Responsive image

TCUIView components


@@ -177,18 +177,18 @@

Customize UI style


-

Responsive image

+

Responsive image

Dark color theme

-

Responsive image

+

Responsive image

Dark color theme of settings view


Customize view mode


-

TCMaskViewMode defines how the current masking result is shown to the user. The user can switch the view mode by tapping the eye button at the top right of imageView in TCMaskView.

+

TCMaskViewMode defines how the current masking result is shown to the user. The user can switch the view mode by tapping the eye button at the top right of imageView in TCMaskView.

By default, TCMaskView provides three view modes:

  • viewModes[0] = TCMaskViewMode(foregroundColor: UIColor(white: 1, alpha: 0.5), backgroundImage: nil, isInverted: true)
  • @@ -198,19 +198,19 @@

    Customize view mode


    -

    Responsive image

    +

    Responsive image

    viewModes[0]

    -

    Responsive image

    +

    Responsive image

    viewModes[1]

    -

    Responsive image

    +

    Responsive image

    viewModes[2]

    -

    You can create your customized TCMaskViewMode by setting its foreground/background image/color, check out the TCMaskViewMode docs for details.

    +

    You can create your customized TCMaskViewMode by setting its foreground/background image/color, check out the TCMaskViewMode docs for details.

    The following example creates a gray scale view mode which makes TCMaskView look like a color effect app: