Skip to main content

Widget styling and customization

The best way to style and customize the widget is using StorifyMe Widget Editor, which is a visual tool available inside StorifyMe platform.

SDK specific styling

Adding loading animation

You can set a default loading animation while the story widget is loading, here is the example code:

storifyMeWidget.setWidgetLoadingAnimationStyle(enabled: true)

and to set your custom loading view please use:

storifyMeWidget.setWidgetLoadingAnimationStyle(type: .custom(view: YourLoadingAnimationView), enabled: true)

Custom font

Download the font, it should be in .ttf format, maybe some others will do. Place it somewhere in the project you want.

In Info.plist you need to set

  • Source code
<string>Finger Paint.ttf</string>
  • Regular view

Add view

Opening story animation

Stories presenting can be customized by setting StorifyMeStoryViewerOptions.

The default behavior is listed below and can be easily customized.

options: StorifyMeStoryViewerOptions(
thumbnailItemOpeningAnimationDuration: 0.2,
thumbnailItemClosingAnimationDuration: 0.2,
storyPreviewerOpeningAnimationDuration: 0.2,
storyPreviewerClosingAnimationDuration: 0.2,
enabled: true))

If for some reason you want to disable the animations, just use the code below.

options: StorifyMeStoryViewerOptions(
enabled: false))

Grid Collection View Behavior

StorifyMeGridCollectionViewBehavior which offers flexible options for customizing the behavior of grid collection views. This includes the capability to adjust the height of the first story using the setGridCollectionViewBehavior(.adjustFirstStoryHeight(byMultiplier:)) method.

.adjustFirstStoryHeight(byMultiplier: 0.75))